An Introduction to Web Fonts & Modern Web Typography
Simon Foster, Web Designer
-
-
1. Welcome to the class, an introduction and some context.
13:25 -
2. Main Project Part 1
9:20 -
3. Main Project Part 2
15:05 -
4. Main Project Part 3
11:33 -
5. Adding self hosted webfonts via fontsquirrel.com
7:37
-
About This Class
Typography on the web has come on leaps and bounds in recent years and is ever improving and evolving. Designers have more and more control not only of how they approach typography but also the fonts they use and the treatments they style them with, but with great control comes great responsibility. Typography on the web isn't just about choosing the latest pretty font, readability, usability and cross-device scalability must be balanced with aesthetics.
Who should take this class? This class is for beginner level front-end web designers who are already learning, or about to learn HTML(5) and CSS(3) and want to hone and improve their typographical skills within the context of todays modern responsive and forward thinking design techniques.
The Project. Students will work through a series of type-heavy tasks on a mockup web page article that I will provide that will cover the functional, practical but also fun sides of working with type on the web. You will learn how to use both hosted and 3rd party webfonts, how to maximise readabilty for the user and provide safe fallbacks to aid usabilty, but most importantly how to really enjoy typography and see it as an exciting form of communication.
So what will you learn? The core skills that will be learnt in the class are:
- The difference between good typography and choosing a nice font.
- How to impliment web fonts using @font-face and via 3rd party services.
- How to make your content consistantly readable regardless of the device being used.
- How to use CSS(3) media queries to enhance the experience when suitable.
- How to match different typefaces together to compliment each other.
- How to use your use of typography to aid communication.
- How typography can be used with images to great effect.
- How responsive design has changed the way we view web typography and how to enhance the experience on all devices.
Class Projects 2 See All
Students
Projects
-
- --
- Beginner
- Intermediate
- Advanced
- All Levels
- Beg/Int
- Int/Adv
Level
Community Generated
The level is determined by a majority opinion of students who have reviewed this class. The teacher's recommendation is shown until at least 5 student responses are collected.
I previously ran my own freelance web design business but nowadyas I'm a front end web designer at Hamilton-Brown in Farringdon, London. I also regularly write articles, give interviews and my work is regularly featured in well respected publications such as .net Magazine and awwwards.com amongst many others. I specialise in front-end responsive design and web typography with an emphasis on content and simplicity of use.
Related Classes
