Join Val Head for an in-depth discussion in this video Establishing the font stack, part of Responsive Typography Techniques.
…In this tutorial we'll show the importance of font stacks in responsive…design, and show you how you know you're selecting a good one.…Web fonts let us be wonderfully expressive with our type on the web, but…it's easy to forget that not all…browsers or devices out there actually support them.…Responsive design is all about being aware of the expansive device landscape…out there, and we need to reflect that in our typographic decisions, too.…And that's where font stacks can come into play.…So what…might make your web font choices not show up?…There's the fact that some devices don't support @font-face…embedding or may not support the loading of web fonts.…
Due to the nature of the Internet in general,…your web font might time out, there might be…a server outage that makes your web font completely…unavailable, and in that case, it definitely won't load.…And also you might do it on purpose.…If you decide to conditionally load your type…resources as suggested in this typekit blog article you…might intentionally not load your fonts and need…
- Deciding between self-hosted and hosted web fonts
- Sizing your type with pixels, ems, and rems
- Applying and choosing a typographic scale
- Creating a font stack
- Maintaining line lengths
- Using media queries to set natural typographic break points
Skill Level Intermediate
1. Comparing and Choosing Web Fonts
2. Establishing Rhythm in Your Typographic System
3. Creating Type Prototype Pages
Establishing the font stack7m 32s
4. Setting Type for Readability Across Screen Sizes
5. Helpful Online Tools and Scripts
- Mark as unwatched
- Mark all as unwatched
Are you sure you want to mark all the videos in this course as unwatched?
This will not affect your course history, your reports, or your certificates of completion for this course.Cancel
Take notes with your new membership!
Type in the entry box, then click Enter to save your note.
1:30Press on any video thumbnail to jump immediately to the timecode shown.
Notes are saved with you account but can also be exported as plain text, MS Word, PDF, Google Doc, or Evernote.