An ESPG Lesson in Web Design

Table of Contents


Part 10: Using Text and Background Colors

The default color of the background is gray (unless the user has changed this in his or her preferences). This can be changed without using a background image. You may also choose the color for the body text as well as for the links, visited links, and activated links. To do this, you also add attributes to the <BODY> tag. See the following example:

<BODY BGCOLOR="#FFFFFF" TEXT="#FF0000">

In this example, only the background color and text color have been changed: the background is now white with red text. The six-digit number code for the color probably looks quite confusing at first. Basically, what you are giving the browser is the RGB values for the color. The first two digits give define the amount of red in the color. The next two digits represent the same for green, and the last two represent blue. The digits themselves are a Hexadecimal number, representing the strength of that color and range from 00, being 0%, to FF, which is 100%. Trying to figure out how to make the color you want from this code is a very daunting task. It would take me a long time to explain all of this, but luckily, there are many excellent cites designed to help you find the perfect color. The following site is one of my favorites:

HYPE Color Specifier (http://www.users.interport.net/~giant/COLOR/hype_color.html)

Besides being able to control background and text color, you may also specify the color of links on the page. The following attributes may be used to control colors in the <BODY> tag:

BGCOLOR Background color
TEXT Text color
LINK Hypertext link color
ALINK Link activated by mouse color
VLINK Visited link color

Keep in mind that not all of your pages` readers are young and well-sighted: it is a kind web designer who choses high-contrast colors for her pages. Combinations to avoid like the plague follow, but are by no means limited to:

Please do not use this! Please do not use this! Please do not use this! Please do not use this!
Please do not use this! Please do not use this! Please do not use this! Please do not use this!
Please do not use this! Please do not use this! Please do not use this! Please do not use this!
Please do not use this! Please do not use this! Please do not use this! Please do not use this!

It really is best to keep your backgrounds a neutral color, preferably something light, pastel, or just plain white. Few things scream "I am an HTML newbie!" like bad color combinations and annoying background images. Just because you *can* do things with color does not mean you *have* to!

A final note: some of the best websites out there are those which have a single background or theme which stays constant through the whole site. These constancies remind your reader that yes, you are on the same site you were on a few pages back, and provide a reassuring presence. Websites that use a different background or style on every page may be fun to design, but also look very amateurish to the reader, and can cause confusion if the reader is not sure he or she is still on the same site.

On to Part 11: Linking