Color in HTML

Transitional versions of HTML and XHTML support color settings for each text as well as for the background of the document, or even individual table cells. With style sheets, you will see that it is also possible to set foreground and background color names for nearly any element. There are 16 widely known color names defined in HTML. These names and their associated hex RGB values are shown below.

Black (#000000) Green (#008000)
Silver (#C0C0C0) Lime (#00FF00)
Gray (#808080) Olive (#808000)
White (#FFFFFF) Yellow (#FFFF00)
Maroon (#80000) Navy (000080)
Red (#FF0000) Blue (#0000FF)
Purple (#800080) Teal (#008080)
Fuchsia (#FF00FF) Aqua (#00FFFF)

To set a particular section of text yellow, simply surround the content with

Of course, in addition to the simple color names listed below, there are many others, some of which seem to have been introduced by the browser vendors. The problem with using browser-defined colors is that they don’t always do what they are suppose to do. Even worse, you can invent your own colors. Try setting the following and viewing it under Netscape and Microsoft Internet Explorer;

This color name is totally invalid, but it still results in a shade of green that is very distinct in each browser. It is possible to make up colors like “chilidog brown” or “stale beer yellow”, but this is no more recommended than using the browser-defined color “dodger blue”. Using hex color values is the preferred way to set colors because some nonstandard color names are not supported correctly across browsers.
Instead of using color names, we ought to use values that represent the color that we want. To understand how to come up with a color value, first consider that a computer displays color using a combination of red, green, and blue. We call this additive color process RGB color. The easiest way to think of RGB color is as a set of three dials that control the amount of red, green, and blue mixed into the final color. Because of the way computers calculate things, the color values range from 0 to 255 in decimal or 00 to FF if we count in hexadecimal like a computer scientist. So a color specified by 0,255,0 or equivalently 00,FF,00, is equivalently to the green dial turned way up and other dials turned off. This is a pure green. Equivalently, FF,00,00 is pure red. Finally, 00,00,FF is pure blue. Obviously, all dials off at 00,00,00 is the absence of color or simply black, whereas all dials on at FF,FF,FF is white. In HTML, we set these hex values using a pound sign and the equivalent RR,GG, and BB values are run together; for example, we could use the hex value #FFFF00 for the color attribute instead of the word “yellow”.
Rather than becoming an expert at hexadecimal, it is easy to use the Web editor to pick a color, a color reference can be found online at http://www.htmlref.com/colorchart.html .

Using Color
Page designers should be forewarned not to choose a link that can confuse their viewers. For example, reversing link colors so that visited links are blue and unvisited links are red could confuse a user. While it is unlikely that a page author would do such a thing, it has been done more than once-particularly in situations where the look and feel is the driving force of the site. Page designers also run into trouble when they set all link values to blue with the belief that users will revisit sections thinking they haven’t been there before. While this might make sense from a marketing standpoint, the frustration that results from lost navigation cues overrides any potential benefit from extra visits. Likewise, setting all the link colors to red could create similar trouble because users may think they have seen the site already.
Designers also must be extremely careful to preserve readability when setting text and background colors. Page designers often are tempted to use light colors on dark colors on dark backgrounds. For example, a gray text on a black background might look cool on every monitor, it will be unreadable. White and black always makes a good pairing and red certainly is useful in small doses. The best combination, in terms of contrast, actually is yellow and black, but imagine the headache from reading a page that looks like a road sign. Despite the generally high contrast, designers should be careful of white text on a black background particularly when font size are very small or thin font faces are in use.

Enter your email address:

Delivered by FeedBurner

My other blog;
1. Across this bridge
2.Struggling parents
4. When life become a book
5. Read Between the Lines
6. The Sleeping Turtle Art Gallery

Subscribe in "Struggling Parents