HTML and CSS Reference
order for that particular font to appear. Your page may look great with Gill Sans
Ultra Bold Condensed, but if your visitor doesn't have the font, the browser's
default font will be displayed. Explore the list of “Web-safe” fonts at http://
● Serif fonts, such as Times New Roman, were originally developed for printing
text on paper—not for displaying text on a computer monitor. Research shows
that sans serif fonts, such as Arial, are easier to read than serif fonts when
displayed on a computer screen (see http://www.alexpoole.info/academic/
for details). The sans serif Verdana font, designed by Microsoft specifically for
display on a computer screen, may be more readable than Arial due to the
increased width and openness of the letters.
● Be careful with the size of the fonts—12 point font size is the same as “Medium”
size and is the same as 1 em. Be aware that fonts display smaller on a Mac than
on a PC. Even within the PC platform, the default font size displayed by browsers
may not be the same. Consider creating prototype pages of your font size settings
to test on a variety of browsers and screen resolution settings.
● Use appropriate color combinations. Students often choose color combinations
for Web pages that they would never dream of using in their wardrobe. An easy
way to choose colors that contrast well and look good together is to select colors
from an image or logo you will use for your site. Make sure your page back-
ground color properly contrasts with your text and hyperlink colors. Refer to
Chapter 3 for additional color scheme ideas.
● Be aware of line length and alignment—use white space and multiple columns if
possible. Review Figures 5.25, 5.26, and 5.27 for examples of text placement on
a Web page.
● Bold (use the <strong> element) or emphasize (use the <em> element to configure
italics) important text.
● Hyperlink keywords or phrases—do not hyperlink entire sentences.
● Avoid the use of the words “click here”—users know what to do by now.
Finally, check spelling and grammar. Many Web sites every day contain misspelled
words. Most Web authoring tools have built-in spell checkers; consider using this fea-
ture. Also, be sure that you proofread and test your site thoroughly. It is very helpful if
you can find Web developer buddies—you check their sites and they check yours. It's
always easier to see someone else's mistake than your own.
Chapter 4 discussed the use of graphics on Web pages. This section summarizes and
adds to the recommended practices discussed in that chapter.
● If you would like your site to have the most consistent display on various moni-
tors using various computer platforms, choose from the 216 colors on the Web
● Use antialiased text in images. Antialiasing introduces intermediate colors to
smooth jagged edges in digital images. Graphic applications such as Adobe
Photoshop and Adobe Fireworks can be used to create antialiased text images.
The graphic shown in Figure 5.33 was created using antialiasing.