HTML and CSS Reference
Individuals in their late teens and early twenties generally prefer dark background colors
with occasional use of bright contrast, music, and dynamic navigation. Figure 5.23
shows http://underatedrock.com, a Web site designed by Michael Martin for this age
Many teens and
young adults find
dark sites appealing
Go to the end of the
book for a full color
version of this figure
Note how it has a completely different look and feel from the site designed for children.
If your goal is to appeal to everyone, follow the example of the popular Amazon.com
and eBay.com Web sites in their use of color. These sites use a neutral white background
with splashes of color to add interest and highlight page areas. Use of white as a back-
ground color was also reported by Jakob Nielsen and Marie Tahir in Homepage
Usability: 50 Websites Deconstructed, a book that analyzed 50 top Web sites.
According to this study, 84 percent of the sites used white as the background color and
72 percent used black as the text color. This maximized the contrast between text and
background—providing maximum readability.
For an older target audience, light backgrounds, well-defined images, and large text are
appropriate. The screenshot of the Senior Health site ( http://nihseniorhealth.gov) shown
in Figure 5.24 is an example of a Web page intended for the over 55 group.
Focus on Accessibility
Another issue related to color is the fact that many individuals experience color defi-
ciency (color blindness). The inability to differentiate between red and green, called
deuteranopia, is the most common type of color deficiency. To increase the accessibility
of Web pages for these individuals, a Web designer can use high contrast between back-
ground and text. The choice of colors is important—avoid using red, green, brown,
gray, or purple next to each other. White, black, and shades of blue and yellow are
easier for these individuals to differentiate. To see what your pages look like to a person
with color blindness, try the online simulator at http://www.vischeck.com/vischeck/.