CSS in Depth

Chapter 13. Typography

This chapter covers

• How web fonts can give your page a unique feel
• Using the Google Fonts API
• Tuning font spacing (tracking and leading)
• Web font performance concerns and optimizations
• Dealing with FOUT and FOIT

You can make or break a page design with its fonts. For years, web developers had to choose from a limited set of typefaces, referred to as web safe fonts. These are font families like Arial, Helvetica, and Georgia that are commonly installed on most users’ systems. Browsers could render the page using only these system fonts, so that’s what we had to work with. We could specify a more exotic font, such as Helvetia Neue, but it would only show up for those users who happened to have it installed; other users ...