Designing for the Color Blind Audience
Priscilla Rodriguez
RHET 5307Dr. Kuralt
Color blindness is a visual defect that results in the inability to differentiate between colors.
It affects: 8% of Males 0.5% of Females
By understanding what color blindness is and understanding the components of color, Technical Communicators can produce a document that increases its usability amongst the audience.
Understanding
Color Blindness
Understanding
Color’s Components
More accessibility for users, increasing the document’s usability
There are three types of color blindness that are most common.
Deuteronopia/ Deuteronomaly Red/green deficiency
Protonopia/ Protanomaly Red/green deficiency
Tritanopia/ Tritanopia Blue/yellow deficiency
Normal Vision Color Blind Vision
Color Blind Vision
Color Blind Vision
Normal Vision
Normal Vision
Consider the way images look to the color blind user.
Consider the way images look to the color blind user.
People with normal color vision should see this image.
The way users with color blindness would view the image.
For the color blind, the ability to discriminate colors on the color model of Hue- Saturation- Value is reduced.
HUE- perceptual attribute associated with elementary color names
Strip of color with a range of hues. Ex: “red” or “blue”
SATURATION- refers to the amount of white light mixed with the hue.
Strip of color with range of saturation from low to high.
VALUE- refers to the intensity of light present (Value is also referred to as lightness)
Strip of color with range of value from low to high.
Hue ranges from 0-360. Saturation and Value range from 0-100. The lower the saturation of a color, the more "grayness” present and the more faded the color will appear.
HSV color space as a conical object
Choosing color effectively to increase usability Maximize the contrast between foreground and background colors Choose colors that contrast in hue Avoid using colors of similar lightness adjacent to one another
To maximize contrast, always use dark types on light or white backgrounds, exaggerate lightness differences between foreground and background colors.
Choosing color effectively to increase usability
Choose dark colors with hues from the bottom half of the hue circle.
For most people with color deficiencies, the lightness of colors in the bottom half of the hue circle tends to be reduced.
Choosing color effectively to increase usability
Avoid contrasting hues form adjacent parts of the hue circle
Color deficiencies make it difficult to tell the difference between colors of similar contrast.
Designing for the Color Impaired
For the color blind audience, meaning should be independent from color
All information using color as a distinction should be evident without it Accessibility is not just a legal requirement but also about doing the
right thing.
U.S. Rehabilitation Act states:
“Color coding shall not be used as the only means of conveying information, indicating an action, prompting a response, or distinguishing a visualelement.” 1194.25(g).
Effective illustrations clarify relationships.
This Pie Chart lacks other visual cues to assist the color impaired audience to view the information presented.
Relying only on color affects the usability of documentation.
Consider the view of the color impaired.
Tritanopia: inability to discern blue and yellow
Protanopia: inability to see the color red or to distinguish red or bluish-green
Deuteroanopia: inability to see the color green or to distinguish green and purplish-red
For the color blind audience, Technical Communicators can design manual tabs, pie charts, and other document elements, that make meaning independent of color.
This Pie Chart adds textual cues to assist the color impaired audience.
This creates better usability and accessibility of the information presented.
Using evaluation tools can help the technical writer better understand the difficulties the color blind audience faces.
These websites allow Technical Communicators to simulate their designs as a color impaired user:
http://aspnetresources.com/tools/colorBlindness
http://www.vischeck.com/
http://www.colblindor.com/coblis-color-blindness-simulator/
http://colororacle.cartography.ch/
Using Evaluation Tools
People with normal color vision should see this image.
The way users with color blindness would view the image.
This chart is has been corrected by using diagonal lines.
By using the vischeck simulator, there is no problem interpreting this chart.
Notice how the addition of diagonal lines creates better usability.
Usability and accessibility is a common goal to improve user experience.
Choose color schemes that can be easily identified by people with all types of color vision, in consideration with the actual lighting conditions and usage environment.
Clearly state color names where users are expected to use color names in communication.
Use a combination of different shapes, positions, line types and coloring patterns, to ensure that information is conveyed to all users including those who cannot distinguish differences in color.
Still, Brian. “What’s Accessible for Some Is Better for All.” Intercom January 2011: 28-29. Print.
Roberts, Linda. “Don’t Turn a (Color) Blind Eye.” Intercom January 2011: 30. Print.
Smith, Kel. “Universal Design for Digital Media.” Intercom January 2011: 6-8. Print.
Mackiewicz, Jo. “Color: The Newest Tool for Technical Communicators- Redux.” Technical Communication Volume 56.1 (2009): 33-13. Print.
Arditi, Aries. “Effective Color Contrast/ Designing for People with Partial Sight and Color Deficiencies" Lighthouse International, 2005. Web. 10 Feb. 2011. <http://www.lighthouse.org/accessibility/design/accessible-print-design/effective-color-contrast>.