Colors

All right, let's talk a little bit more about color. This is an amazingly complex subject, so I will do my best to keep it simple and to the point.

Remember that the web has evolved. It was not designed and no one person or group put it together. So there are many artifacts left over from the days when the web was much more primitive. And color is very heavy with those artifacts.

Remember just a few years ago a color monitor costs thousands or even tens of thousands of dollars. In those days, just about everyone had black and white monitors and they were all character based. In fact, graphics didn't even exist on the web at all until 1991!

The first color monitors supported just a few colors - eight or sixteen of them. That was all. This lasted for a few years until some advances allowed for 256 colors. And that's the way the industry stayed for a few years.

Now, of course, it's hard to find a monitor which does not support tens of thousands or even millions of colors. But since HTML was put together during those early years, we are stuck with an archaic color system and, worse yet, with supporting the millions of old monitors still in use.

Okay, take a deep breath and let's jump right in. Color on the web is typically represented in RED GREEN BLUE format. You represent the amount of "saturation" of the color using a numeric number between 0 and 255 (00 to FF in hexadecimal format, which is a common way to represent color values).

The smallest value (0) is the least amount of the color and the largest value (255) is the most amount of the color. Thus, to get black  you set RED to 0, GREEN to 0 and BLUE to 0. On the other hand, to get white  you set RED to 255, GREEN to 255 and BLUE to 255. To get anything in between you set the values up or down.

If you do the math, you will find out that this scheme supports over 16.7 million colors! Yet to be safe, you are best limiting yourself to the Windows 256 color set. Actually, to be even safer, you should limit your colors to a set of 216 (this is because Windows reserves some of the color values for itself). If you only use these colors your web pages will work the same on all but the most primitive monitors.

The Netscape 216 color web-safe palette is shown below. Click on a square to get the numeric value of the color. 

What happens if you specify a color outside this range on a 256 color monitor? Windows does something called dithering. What this means is the operating system mixes dots of colors to attempt to represent the color your requested. What this implies is that if you venture outside of the 216 color range the colors you specify may not be the colors you get on every monitor.

How do you use this? Many tags accept one or more color attributes. You specify the numeric value of the color as part of the attribute.

For example, one of the simplest things you can do is use the <FONT> tag to change the color of your text.

<font color="0000FF">Cody's animation
station has hundreds of free animations split into easy
categories.</font>

Cody's animation station has hundreds of free animations split into easy categories.

You can also represent colors using their English names. 

<font color="BLUE">Cody's animation
station has hundreds of free animations split into easy
categories.</font>

Cody's animation station has hundreds of free animations split into easy categories.

For a more complete description of color, see "Color" and for a full list of all of the color names, see "Color Names".

It's important to remember that you are not limited in any way to the 216 color palette. You can use any of the 16.7 million colors that are available. If your visitors system does not support the colors then the operating system will simply get as close as it can.

All right, I hoped that helped out with colors a bit. This is a tough subject and I've only hit on the basics. However, it should be enough to last you quite a while.