Colors in GIF and/or JPG format

In an earlier chapter, I mentioned that there was a way to handle the vast array of colors that can be used on a Web page. Well, this is the chapter that I hope to convey the message in an easy to understand format.

If you remember, GIFs can display up to 256 colors, and JPGs can use up to 16.7 million colors. Well, I expect it would be next to impossible to worry about 16.7 million colors as well as 256, I would be stretching it if I said I knew over a hundred colors by name, so I better come up with a plan on how to tell the browser exactly what color I want for my Web pages. Web page designers rely upon a numbering system to tell browsers how to color their pages, it's called hexadecimal and it won't be too terribly hard to learn.

Colors by name only

Browsers know quite a few colors by their names, for example, red, yellow or blue, even, aqua, silver, gold and goldenrod to name a few. Before long you are going to run out of names for colors I guess, so I had better get with it. This is the proper way to color a background for a Web page; write this inside the BODY tag... < BODY BGCOLOR= "cyan" > if you want a bright pool-colored blue for your page. It will work on any browser because it's one of the secondary color names used in the color wheel for light.

Here is an example of how the color wheel works for your TV and VIDEO on your computer. RED, GREEN and BLUE are the primary colors; RED plus GREEN make YELLOW, GREEN plus BLUE make CYAN, and BLUE plus RED make FUCHSIA. So there are the primary and secondary colors of light. If you add all three primary colors together, they produce WHITE, take all the primary colors away and you have BLACK, the absence of color.

Here are a few names of colors, there are too many to list, but it will give you an idea of what to expect. ALICEBLUE, ANTIQUEWHITE, AQUA, AZURE, CADETBLUE, CRIMSON, DARKMAGENTA, FORESTGREEN, HOTPINK, INDIGO, KHAKI, must I go on? There are pages of colors by name. Problem? If I used some of the more esoteric names like THISTLE, would you really know what to expect? Probably not!

Colors by Number

Remember from above, I said the primary colors were, RED, GREEN and BLUE, we need these three numbers in exactly that order to create a numbering system that works for the Web. In hexadecimal, the numbering system is not your regular garden-variety base ten system, you know, 10 pennies make a dime, 10 dimes make a dollar, etc. we need something better to get to 16,700,000 colors. We will use a numbering system that is called base 16, wow, what's that? Well it looks a lot like our base 10 at first, but not for long. This system starts with a zero (0) and stalls at nine (9), we can't use 10 because it's two digits wide. So we switch to letters for a while, 10 becomes A, 11 becomes B, 12 now C, 13 now D, 14 now E and 15 now F. So if you've been paying attention, it starts at 0 and ends at F, that's sixteen numbers and letters.

We will use two numbers or letters to describe every shade and hue of RED, GREEN, and BLUE. From the absolute lack of color being 00 to the maximum of that color FF. For example, RED would be expressed as the maximum of RED and the absence of GREEN and BLUE, so it would look like this, FF0000.

To describe the color GREEN we would use 00FF00, and the color BLUE, 0000FF. So what would yellow look like? Try all RED plus GREEN and no BLUE, FFFF00. Getting the idea? Well that's four colors down, only 16, 696,000 to go, I've got time, do you? Not really.

Well I've not told you yet, the Internet can only see 256 colors as pure, and all others will be dithered as approximations. So what's dithering? It's the mixture of colors in such a way that your eye creates another color for you. For instance, if you made a series of yellow dots with a crayon on a piece of paper, then added a few red dots to the mixture, your eye would create a third color, orange. You never used an orange crayon, but the eye nevertheless sees orange, that's dithering in a nutshell. To be sure to use the best colors available, Web designers use the safe pallet of 216 colors, (the browsers save about 40 colors for themselves). The hexadecimal numbers and letters that correspond to these are 0, 3, 6, 9, C, and F. Any combination of these will produce quite a rainbow of colors yet still appear clean on your Web page. Here is an example of the safe colors and the address of a Web page that will display them for you anytime you need them for reference.