by Paul Hoffman, Cognetics Corporation
There are two major types of color blindness. The most prevalent causes are confusion between red and green. This type affects approximately eight to ten percent of the male population. In another type, an additional one to two Percent of men suffer from a deficiency in perceiving blue/yellow differences. Less than one percent of women suffer from any form of color blindness. To understand color blindness better, it is helpful to be familiar with the ways in which colors differ from each other. One standard way to discuss color is to divide it into hue, saturation and brightness (HSB).
Hue
Hue is the element that distinguishes one color of the rainbow from another. It is the quality that infuses an object with “orangeness” or “redness” or “blueness”. In terms of people with color blindness, red and green hues are not differentiated as well as they should be.
Saturation
Saturation, the second element of the HSB color model, is the “pureness” of the color. High saturation equates to intense, “colorful” color. A color is desaturated by adding varying amounts of the its opposite or complementary color. Adding some blue-green desaturates Red. As colors become more desaturated, they tend toward a neutral grey. Less saturated colors are harder for the colorblind to distinguish.
Brightness
The third element, brightness, is sometimes called “lightness” or “value.” (The highest value equals white; the lowest value equals black.) Changing the brightness or value of a color is accomplished by diluting it with white, which makes the color become lighter or pastel, or with black, which makes the color become darker or more subdued. Colors with similar brightness are harder for the color-blind to distinguish.
If the designer wishes the interface to be equally effective to individuals both with and without color blindness, color-cueing should take into account potential red/green and blue/yellow confusion.
What can be done to avoid confusion?
Always provide an additional cue; don’t rely on color alone. For example, the standard default web browser of a link is underlined blue lettering. Interestingly, this particular color coding would stand up quite well, even without the additional cue of the underline, since blue is the universally recognizable color.
A second way to counteract color deficiency confusions is to make sure that colors have a high degree of contrast with each other. Color should differ strongly in brightness. A very light green and a very dark red will be easier to distinguish than a red and green that are similar in brightness. Remember that the more similar two colors are in brightness or in saturation, the harder they will be to distinguish.
In general, when colors need to be distinct and recognizably different, select the light colors from orange, yellow, green or blue-green; select the darker colors from blue, violet, purple or red. (The colorblind already see blue, violet, purple and red as darker than normal.) Also, don’t pair colors similar in hue, in saturation, or in brightness.
Related Links
http://www.lighthouse.org/accessibility/effective-color-contrast/
