HTML 4.0 Sourcebook
(Publisher: John Wiley & Sons, Inc.)
Author(s): Ian S. Graham
ISBN: 0471257249
Publication Date: 04/01/98

At the same time, a number shorter than 24 bits is too short to specify how much red, green, and blue to use in making the color—recall that you need 24 bits to fully specify a color. Thus, a system that has less than 24 bits per pixel needs a way of relating the number associated with a given pixel to the desired RGB color. The mechanism for doing so is called a colormap or colormap table.

Let’s take the example of an 8-bit color system. In an 8-bit system, each pixel can contain an integer value ranging from 0 to 256. To determine the color each of these integers corresponds to, we create a colormap table that relates each possible position in the colormap (referenced by the colormap index) to a full RGB color code. An example table is:

Each 8-bit number in a pixel now corresponds to one of the colors in the table. Thus, if a pixel is set to the number 2, the graphics system will look to the color table, pull out the RGB hex code 000033, and paint the pixel with this color.

Default System Colormaps

Most computers that only have 8-bit color hardware have a default colormap—that is, they come preconfigured with a colormap that relates pixel codes to specific RGB colors. On Microsoft Windows systems, this is known as the Windows colormap. The Windows colormap defines 232 (16 values from the VGA color palette, plus an additional 216 colors, for a total of 232) out of the 256 possible colors. The group of 216 colors is defined using the individual primary color codes 0, 51, 102, 153, 204, 255—the 216 comes from having 6 different shades of red, 6 different shades of green, and 6 different shades of blue, for a total of 6×6×6=216 different colors. The other 16 are from the colors defined in the VGA color palette—these are the 16 colors originally defined on old DOS and Windows machines that only supported 16 colors (the colors and RGB codes are listed on the companion Web site in Appendix F). The remaining 24 colors can sometimes be dynamically set by programs needing specific colors—for example, a Web browser, when trying to display an image, may set these entries to the colors needed by the image being displayed.

Obviously, this scheme omits a lot of colors! But, it does evenly cover the range of possible colors and provides a reasonable set of default values.

With Microsoft Windows, the 24 undefined positions are the only ones that can be modified by software—Windows 3.1, 95, or NT do not let user programs change the other 232 colormap entries. Thus, on 8-bit Windows systems, you’re essentially stuck with the colors defined by the Windows colormap. Other systems (Macintosh or UNIX) with 8-bit color are generally more forgiving, and can dynamically modify the system colormap to account for the colors desired by an application. Thus, for Web applications it is best to use the Windows colormap when creating images, since this will work best on Microsoft Windows systems and will also work acceptably well on other machines.

Displaying Images—Color Dithering

Problems arise if an image contains a color that is not available in the system colormap. For example, you might have an image that contains the color 00102F, but a user’s 8-bit color system can only get as close as the colors 000000, 000033, and 003333. How, then, will the system display the desired color?

There are two approaches. First, the computer can look in the system colormap for the color “nearest” the color in the image and use this color instead. Given the Windows colormap, the computer might then take all pixels of color 00102F and paint them with color 000033. Unfortunately, the concept of “nearest” can lead to truly bizarre replacement colors, so this is often not an ideal replacement scheme.

The second way is known as color dithering. With dithering, the program displaying the image tries to find colors in the local colormap that are close to those in the actual image and then replaces blocks of the original color by a mixture of the colors actually available on the computer. You can often detect dithering by looking at regions of an image that “should” appear as a solid color. If the area appears mottled, with lots of dots of slightly different colors, then the image has been dithered.

Dithering is illustrated in Figure 3.1. The chosen color, illustrated at the upper left, is not defined in the 8-bit color palette. Thus, when the color is displayed on a 256 color system, the color is dithered, as illustrated by the figure labeled “Dithered.” The bottom of the figure shows an expanded view of a dithered region and more clearly illustrates how the original color is mimicked via a mix of other colors. In this case, the original color (pale aquamarine) is dithered using a mix of white, gray, and aqua.

Dithering is sometimes better than taking the closest color and sometimes not. Both cases are not ideal, and a better choice is to make sure that images use the colors that are available in the system colormap. This is most easily accomplished by selecting an appropriate colormap when the images are created. For the Web, this means choosing the Windows colormap mentioned previously.

Selecting an Image Colormap

Most Web browsers, including Netscape Navigator, support the Windows colormap for 8-bit displays. Thus, if you are creating an image (an icon or line graphic, as opposed to a photograph), it is best to create it using the Windows colormap (most graphics editors let you choose the colormap you wish to use), as opposed to a colormap customized for the occasion.