Using Web Color : Page 4

There are two ways to bring color into your Web site—through graphics or through code.

by DEVX Staff

Jan 1, 2000

Page 4 of 4

"Web-safe" Colors "Web-safe" colors are the 216 colors that are supported by all browsers and platforms.

Web Safe colors are a subset of the millions of possible colors between 000000 (black) and FFFFFF (white). Some people prefer to use only these 216 colors on a Web page because they feel only these colors can accurately be represented across all platforms and browsers.

Web-safe colors have six possible RGB hex values: 00, 33, 66, 99, CC, and FF. These six values can combine to form 216 colors. If you remember these six hex values, it is easy to tell whether a color is "Web safe" or not. 6633CC is a Web safe color; and 05F211 is not. 66 and 33, and CC are acceptable values; 05, F2, and 11 are not.

Choosing Web safe colors by specifying a value such as FF3399, is not very intuitive, so most software uses a color palette like this one from Fireworks, which give a visual representation of the Web safe colors. Click on the color you want to use and the Web safe hex color value is selected. Some image editing software also has a "snap to" function that will allow you to mix any color and then it converts it to the nearest Web safe color from the 216 palette.

Viewer Variation Your readers won't see colors exactly as you do.

Getting "accurate" color on the web is difficult to impossible, as so many variations are involved. Your best bet is to select colors that work, then test them under as many different variations as possible. Even then, you'll still have perception differences; biologically, different people perceive colors differently.

But testing can help a lot. First, try viewing your pages under a 256 color monitor. Although increasing numbers of readers have true-color monitors, this is one place where you will still find some variation.

To simulate a basic color monitor, change your monitor's color setting to 256 colors. On a Macintosh, use the "Monitors and Sounds" control panel:

On a PC use the Setting/Control Panel/Display option, then select the Settings tab/256 color option:

If you look at your images in 256 color mode, you'll get a better sense of what your readers are seeing.

Next, try viewing your page under both Netscape Navigator and Internet Explorer. There is a fairly even mix of these browsers in use, and each has some subtle variations.

Finally, if you have access to Macintosh, PC, and UNIX machines, try viewing your page on the different platforms. You will see system-to-system differences in rendering.