• Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint

Color Management

Placing color on a Web page is easy. Making the right choices so the colors you choose work presents some challenges.

Web pages are viewed on different computers, employing different color-handling conventions. To overcome this color Babel, the developers of HTML (assisted by Netscape) created a standard for Web color that makes it possible for all Web users with color-capable browsers and computers to see the same colors. Creating and adopting that standard meant adopting a chromatic lowest common denominator. Many colors available on some systems (notably the Macintosh) are not part of the "Web-safe" color set.

Whatever development platform you use, it's important that Web designers use "Web-safe" colors on their Web pages to avoid dithering, the process whereby a computer "fakes" a color by the splotchy imposition of one color over another.

There are nine ways to define and use colors in GoLive. Only one of them is specifically Web-safe.

In GoLive, all color comes from the Color palette. You'll find the Color palette in the window with the Objects palette. Just click the Color tab, or choose Window > Color. The tabs of the Color palette (Figure 4.40) contain the nine different ways of defining color. They are, from left to right:

Figure 4.40. The Color palette contains nine ways to determine color. Only one, the Web Color List, contains colors that will appear predictably across all platforms.

  • Grayscale (Gray Slider), which defines colors as percentages of black. The 256 levels of gray can be shown on any Web browser, but you lose the impact of color.

  • RGB color (RGB Sliders), which is how your computer monitor assembles colors from its red, green, and blue light sources. Values here are represented on slider bars for each base color, which can be mixed in near-infinite combinations.

  • CMYK color (CMYK Sliders), the color model most used in the printing industry. Pigmented "process" inks of Cyan, Yellow, Magenta, and Black are mixed for 4-color printing. Actually, you're seeing an RGB representation of the CMYK color model on your computer screen. The CMYK tab contains millions of colors that are not Web-safe, but are useful when trying to match a printed color.

  • The HSB Color Wheel has a circle in which the RGB color space is defined in hue (base color) and saturation (color density). Pick a color point inside the circle, then use the Brightness slider to modify its level of brightness.

  • HSV Color Picker is based on the Windows system color model. The tab's controls are a combination of RGB percentages moderated by Hue, Saturation, and Value controls.

  • The Palettes tab contains the 256-color system palette, and, from its pop-up menu, arbitrary palettes of 16 colors and 16 levels of gray, the 34 colors reserved by Windows for its desktop, and a Custom palette for making up to 36 colors, so that your site uses a consistent group of colors.

  • The Web Color List is the most useful group of colors because these colors can be displayed in all browsers. Colors in this palette appear on the left side of the palette, with their hexadecimal code equivalents on the right. Confusing? Maybe so, but to the rescue comes…

  • Web Name Colors, display colors with some rather odd but memorable names and hexadecimal values. Web Name Colors are not necessarily Web-safe colors, as some of these colors will dither when displayed on some systems.

  • Site Color List, contains a visual list of all the colors used on a loaded site. This tab is very useful for maintaining color consistency in a growing site.

There are very few colors visible to the human eye that are not contained somewhere in the color ranges or gamuts of the Color palette. However, for universal and most predictable results, use the 216-color Web Color List.


Although there are no Tooltips for identifying the tabs of the Color palette, you can click the arrow near the upper-right corner to see a selection menu for the tabs (Figure 4.41).

Figure 4.41. The Color palette has a handy menu for selecting the right color-naming scheme.

Applying color

To apply color to a page or an element in GoLive, drag the color from the Color palette to the Inspector of the item to be colored.

To apply background color to a page:

Open a new document.

With the Inspector open, click the Page icon (Figure 4.42) in the upper-left corner of the page, just above the Document window.

Figure 4.42. Click the Page icon in the Document window to open the Page Inspector.

Under the Background heading in the Inspector, make sure Color is checked.

Open the Color palette (click the Color tab in the Objects palette or choose Window > Color).

Select the Web Color List tab.

Choose a pleasing color from the list. You can use the eyedropper cursor and select a color by clicking one of the range of colors, or by scrolling through their names on the right side of the window. When you click to select a color, your selection will appear in the color preview pane on the left side of the Color palette, and as a selection with a hexadecimal name to the right.

Click and hold the mouse button in the preview pane of the Color palette. The cursor becomes a small square outline. You are now carrying a color swatch.

Keep holding the mouse button down as you drag the swatch onto the Color box in the Inspector (Figure 4.43). The selected color fills the Color box in the Inspector and fills the Document window.

Figure 4.43. Drag the color over to the Inspector and drop it on the Color field.


A shortcut to making a background page color is to drag a color swatch directly on to the Page icon below the toolbar.


Highlighted text may be colored by dragging a swatch directly on to the text.


To change the default color of text, drag a selected color into the Text Color box on the toolbar (Figure 4.44).

Figure 4.44. Drop a selected color onto the toolbar's Text Color field to change the default text color. Selected text can also be colored using this method.

Using the Color palette to match colors

From time to time you may want to use a color which appears in a graphic. The Color palette's eyedropper cursor will sample colors and give you an exact match in RGB, or the closest match in Web-safe colors. For example, imagine that you need to match the color of a graphic you are going to use to some other element on a page.

To match an existing color:

Open the page containing the graphic or other item whose color you want to match.

Open the Color palette. Select the Web Color List tab. Your graphic may have colors that are not Web-safe, but GoLive will locate the nearest match from the Web Color List.

Place your cursor over one of the 216 Web-safe colors and click and hold the mouse button. The cursor becomes an eyedropper (Figure 4.45).

Figure 4.45. Clicking and dragging the mouse over the displayed colors changes the cursor into an eyedropper, which is used to sample colors.

Drag the eyedropper over the image (Figure 4.46). The eyedropper samples the color and displays the nearest Web-safe color in the Preview pane of the Color palette.

Figure 4.46. Move the mouse over to the graphic that contains the color you wish to sample. The color's closest match in Web-safe colors will appear in the Web Color List as a selection.

  • Creative Edge
  • Create BookmarkCreate Bookmark
  • Create Note or TagCreate Note or Tag
  • PrintPrint