Basic Web Design: Color

We have discussed the technical aspects of color fairly exhaustively, but I want to reiterate the importance of designing using the web-safe color palette. Chances are that some portion of your user base will be viewing your website using a monitor with restricted color space; since this is the case, web-safe color design will be critical for you.

Remember: your hex codes must be combinations of FF, CC, 99, 66, 33, or 00 in order to be valid as web-safe colors.

Speaking of color, don't forget your color-blind users. A substantial portion of males have some degree of color blindness, which makes certain color combinations unreadable or indistinguishable; red and black in combination is a classic example (it all looks black). Make certain that you are aware of tone value contrasts as well as hue when designing for color-blind users. Testing your designs in grayscale will give you a much clearer (although not completely accurate) idea of what your design will look like to the color-blind.

Also consider the experience of reading black text on a white screen: don't you find it somewhat exhausting to the eye? I sure do!

Unlike paper, where black on white is highly readable and highly desirable, a CRT monitor emits light; looking at a white screen is, basically, staring into a light bulb! Because it emits light, the contrast on a monitor is 10 times greater than similar contrast on printed media (at least, that's the figure I've heard). Lower contrast colors (black text on a gray background, for instance) make prolonged reading on a monitor screen easier to tolerate. When creating designs where the reading of text is important, don't use white! Use medium-toned, unsaturated background colors with dark, crisp text.

Main Menu