HTML and CSS Reference
Web safe colors
Go to the end of the
book for a full color
version of this figure
for a comparison of a Web Safe Color, #CC0000 , and a non-Web safe color, #880000 .
Both are a shade of red; however, the Web safe color will display predictably across
Windows and Mac OS platforms and the other color will not. Using Web safe colors
has become less important now that most monitors display billions of colors. The Web
Color Palette is rather limited and it is common for today's Web designers to choose
colors creatively rather than select them from the Web Color Palette.
You may be wondering how to select colors to display on Web pages. One easy way to
choose colors is to use a monochromatic color scheme—all shades or tints of the same
color. Try the Color Blender at http://meyerweb.com/eric/tools/color-blend to select col-
ors for a monochromatic color scheme. Another way to create a color scheme is to base
it on a photograph or image. Visit http://www.colr.org to generate a color scheme based
on an image from the Web or one that you upload. If you have a favorite color and
would like to create a color scheme around it, visit one of the following sites that sug-
gest color schemes:
Focus on Accessibility
While using color can help you create a compelling Web page, keep in mind that not all
your visitors will see or be able to distinguish between colors. Some visitors will use a
screen reader and will not experience your colors, so your information must be clearly
conveyed even if colors cannot be viewed. Other visitors may be challenged with color
vision deficiency (color blindness) and will not see the colors as you intended.
According to Vischeck ( http://www.vischeck.com/vischeck/) about 1 out of 20 people
experience some type of color deficiency. To increase Web page accessibility, choose
background and text colors with a high amount of contrast. 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 individuals with color vision defi-
ciencies to differentiate. Visit http://www.vischeck.com/vischeck/vischeckURL.php to
simulate how a person with a color deficiency experiences the colors on a Web page.
Using color on Web pages will be revisited in Chapter 5, Web Design.