DEV Community

Cover image for Web Development Part 2B: Fonts, Colors, Etc.
Tim
Tim

Posted on

Web Development Part 2B: Fonts, Colors, Etc.

It's time to spice things up!
We're going to learn about fonts, colors, and a few other tricks! Don't forget to use the hashtag #TimTeachesCode on twitter! Remember, you can all contact me whenever you have questions or feedback.

This course is completely free and will be free forever. It takes a bit of time to prepare and support, so if you'd like to contribute, you can do so at https://paypal.me/tevko. Any contribution helps!

This week: Making it Nice.
In the last lesson, we used Grid and Flexbox to layout our FAQ page. We also added media queries to allow the content to display nicely on all screen sizes.

In this lesson, we're going to add more styles to our FAQ page. This means fonts, colors, underlines, backgrounds, and anything else you can think of! You'll need to do a lot of studying and browsing for this lesson, in order to learn about the different things you can do with CSS.

What you'll need to study

https://css-tricks.com/almanac/properties/

A few tips:

  • Make sure the CSS you're using is supported by all browsers, and not deprecated!
  • Find some inspiration to help with your design.
  • Make sure your color schemes, font sizes, and overall page design is accessible!

Homework:
Reply to the email with a link to the updated codepen and a brief summary of what you've learned about CSS design. Also include your plans to continue studying CSS and how you'll keep this new skill sharp!

Extra points.
Read through https://daveceddia.com/implement-a-design-with-css/ and find a new design to replicate on your own!

Top comments (0)