the same cannot be said for older Mac-based computers, which often rely on the similar

but subtly different Helvetica.6 To produce a similar experience on both operating systems,

the CSS needs to define both faces, such as the following:

p {

font-family: Arial, Helvetica, sans-serif;

}

It is also important to note that some fonts may not be called the same thing between OSs,

and ones that are may look slightly different between the platforms. The font Times is

common on the Mac, but completely absent on most PCs, except for a rare variation that

produces a grungy, distressed version of the classic Times New Roman. To avoid the

appearance of this nasty alternative and ensure the same look is produced on both plat-

forms, the CSS would be the following:

p {

font-family: "Times New Roman", Times, serif;

}

Finally, it is critical to include a generic term at the end, whether serif, sans-serif, or

monospace. It is foolhardy to assume any given machine has even the most generic font

installed, so a contingency rule must be added. Otherwise, the browser will use its own

style sheet (and that is almost never desirable). Testing the website on all platforms will, of

course, weed out many of these potential design trolls.

Consider contrast

Finally, contrast is very important in web design, and most important when designing text.

Like the conundrum over serif or sans serif, there are no hard-and-fast rules, only guide-

lines. Some prefer dark text on a light background; others like their copy reversed.

Whatever the case, contrast—the level of color difference between the words and their

environment—must be set relatively high in web design. A thousand different monitors

will produce a thousand different images. For a deeper discussion on the topic and a list of

tools to help discern contrast ratios, see Chapter 3.

5. Diving into advanced typography is beyond the scope of this book. However, a great book that

wades neck-deep into the topic is CSS Mastery: Advanced Web Standards Solutions, by Andy

Budd, Simon Collison, and Cameron Moll.

6. For an entertaining read on how Arial was unceremoniously derived from Helvetica, read Mark

Simonson’s article “The Scourge of Arial,” at www.ms-studio.com/articles.html.

33