HTML & CSS: The Good Parts

Working with Typefaces and Fonts

The ability to specify typefaces outside of markup is one of the greatest strengths of CSS. On account of this, presentation of typography on the web medium is now a far cry from where it was in its infancy, when all pages were set in a single typeface chosen by the visitor.

The Challenge of Limited Choices

To make another long story extremely short, there are all of 16 typefaces available to Windows XP that are appropriate for web use—and of those, 3 are functionally useless, each for its own reasons. OS X offers a broader range of choices, but given its market share, the best thing a designer can do is choose one of the XP typefaces as a fallback, in addition to choosing an OS X font, as shown in Table 12-3.

The ubiquity of Microsoft Office (and its bundled fonts) is a bright spot in this otherwise bleak typography landscape, but most of those fonts are intended for print use, not web use.

Table 12-3. Latin typefaces ^[2] commonly available to web users, according to operating system. Broadly available fonts are highlighted; fallbacks ^[3] are spelled out.

Typeface	Operating system
	Windows XP	Windows Vista & 7	Mac OS X 10.3	Mac OS X 10.5
American Typewriter	Courier New	Courier New	✓	✓
Andale Mono [a]	✓	✓	Monaco	✓
Apple Gothic	Microsoft Sans Serif	Microsoft Sans Serif	✓	✓
Arial [a]	✓	✓	✓	✓
Arial Black [b]	✓	✓	✓	✓
Arial Narrow [b]	✓	✓	✓	✓
Arial Rounded	Arial	Arial	✓	✓
Arial Unicode	Arial Unicode MS	Arial Unicode MS	Arial	×
Arial Unicode MS	✓	✓	Arial Unicode	✓
Baskerville	Palatino Linotype	Palatino Linotype ...