Font Families and Web Fonts

The same bold heading, "Quick Weeknight Lentil Soup", measured 481px wide in Georgia, 442px in Arial and 406px in Times New Roman, all at the browser's default heading size of 32px. Only one property changed between the three runs: font-family, which chooses the typeface, that is, the design of the letters. The choice changes the look of the page, how much text fits on a line, and, when the font has to be downloaded, what the reader sees in the first seconds.

This chapter styles one recipe article from start to finish