browser-compatible font families

There are five generic font families, each including some fonts:

serif:   have finishing strokes, flared or tapering ends, or have actual serifed endings (including slab serifs);  are typically proportionately-spaced;  often display a greater variation between thick and thin strokes than fonts from the ’sans-serif’ generic font family. Examples of fonts that fit this description include:

• Garamond
• Georgia
• New York
• Times
• Times New Roman

font	installed(%)
	win	mac	unix
Georgia	97.76	94.20	57.70
Times New Roman	97.51	91.71	60.98
Lucida Bright	30.01	59.77	73.97

sans serif:  have stroke endings that are plain — without any flaring, cross stroke, or other ornamentation;  are typically proportionately-spaced;   often have little variation between thick and thin strokes, compared to fonts from the ’serif’ family. Examples of fonts that fit this description include:

• Arial
• Geneva
• Helvetica
• Lucida Sans
• Trebuchet
• Verdana

font	installed(%)
	win	mac	unix
Verdana	99.13	95.58	59.67
Tahoma	98.98	74.86	—-
Arial	98.73	96.41	65.90
Lucida Sans	41.17	59.77	73.97

monospace: have the same fixed width so it is similar to a manual typewriter. Examples of fonts that fit this description include:

• Courier New
• Courier
• monospac

font	installed(%)
	win	mac	unix
Courier New	98.73	90.88	64.59
Monaco	2.77	98.34	4.11

cursive and fantasy are not suggested to be used in the body text.

Some common rules:

1. Sans serif for online, serif for print.
2. Monospace for typewriter and code.
3. Cursive and fantasy for accents.

The following combinations are fairly safe when it comes to universal application across operating systems and browser platforms:

• Arial, Helvetica, sans-serif
• Verdana, Arial, Helvetica, sans-serif
• Georgia, Times New Roman, Times, serif
• Times New Roman, Times, serif
• Courier New, Courier, monospace

[references]

http://www.codestyle.org

http://webdesign.about.com/od/fonts/a/aa080204.htm

http://www.w3.org/TR/CSS2/fonts.html#generic-font-families

“Prof ASP.NET 2.0 Design _ CSS, Themes, and Master Pages”, Wrox, 2007