Open main menu
Home
Random
Recent changes
Special pages
Community portal
Preferences
About Wikipedia
Disclaimers
Incubator escapee wiki
Search
User menu
Talk
Dark mode
Contributions
Create account
Log in
Editing
Color blindness
(section)
Warning:
You are not logged in. Your IP address will be publicly visible if you make any edits. If you
log in
or
create an account
, your edits will be attributed to your username, along with other benefits.
Anti-spam check. Do
not
fill this in!
===Digital design=== {{See also|Color coding in data visualization}} [[File:Safe Chart Colors-F99-FEC-ADD.jpg|thumb|alt=snippet of colored cells in a table (foreground), surrounded in background showing how the image appears in color-blindness simulations.|Testing the colors of a web chart, ''(center)'', to ensure that no information is lost to the various forms of color blindness]] [[Color code]]s are useful tools for designers to convey information. The interpretation of this information requires users to perform a variety of [[#Color tasks|color tasks]], usually comparative but also sometimes connotative or denotative. However, these tasks are often problematic for the color blind when design of the color code has not followed best practices for accessibility.<ref>{{Cite journal |last=Hovis |first=Jeffery K. |date=July 2002 |title=Diagnosis of Defective Colour Vision, 2nd Ed. |journal=Optometry and Vision Science |language=en-US |volume=79 |issue=7 |pages=406 |doi=10.1097/00006324-200207000-00005 |issn=1538-9235 |doi-access=free }}</ref> For example, one of the most ubiquitous [[#Color tasks|connotative]] color codes is the "red means bad and green means good" or similar systems, based on the classic [[#Signal lights|signal light colors]]. However, this color coding will almost always be [[#Confusion colors|undifferentiable]] to [[#Deutan|deutans]] or [[#Protan|protans]], and can instead be supplemented with a parallel connotative system ([[Check mark|symbols]], [[smiley]]s, etc.). Good practices to ensure design is accessible to the color blind include: * When possible (e.g. in simple video games or apps), allowing the user to choose their own colors is the '''most''' inclusive design practice. * Using other signals that are parallel to the color coding, such as patterns, shapes, size or order.<ref>{{cite book|last1=Caprette|first1=Heather|title=Best Practices in Accessible Online Design|publisher=Pressbooks @ MSL|chapter=14 Avoiding the Use of Color Alone to Convey Meaning and Algorithms That Help|chapter-url=https://pressbooks.ulib.csuohio.edu/accessibility/chapter/chapter-2-3-avoiding-the-use-of-color-alone-to-convey-meaning-and-algorithms-that-help/|access-date=12 August 2022|archive-date=12 August 2022|archive-url=https://web.archive.org/web/20220812064823/https://pressbooks.ulib.csuohio.edu/accessibility/chapter/chapter-2-3-avoiding-the-use-of-color-alone-to-convey-meaning-and-algorithms-that-help/|url-status=live}}</ref> This not only helps the color blind, but also aids understanding by normally sighted people by providing them with multiple reinforcing cues. * Using brightness contrast (different shades) in addition to color contrast (different hues) * To achieve good contrast, conventional wisdom suggests [[Color coding in data visualization#Grayscale, an important tool for visualization of data|converting a (digital) design to grayscale]] to ensure there is sufficient brightness contrast between colors. However, this does not account for the [[Luminous efficiency function#Color blindness|different perceptions of brightness to different varieties of color blindness]], especially [[#Protan|protan]] CVD, [[#Tritan|tritan]] CVD and [[#Monochromacy|monochromacy]]. * Viewing the design through a '''CVD Simulator''' to ensure the information carried by color is still sufficiently conveyed. At a minimum, the design should be tested for [[#Deutan|deutan]] CVD, the most common kind of color blindness. * Maximizing the area of colors (e.g. increase size, thickness or boldness of colored element) makes the color easier to identify. [[Color coding in data visualization#Symbol size affects color salience|Color contrast improves as the angle the color subtends on the retina increases]]. This applies to all types of color vision. * Maximizing brightness (value) and saturation (chroma) of the colors to maximize color contrast. * Converting connotative tasks to comparative tasks by including a [[Chart#Features|legend]], even when the meaning is considered obvious (e.g. [[Red#Warning and danger|red means danger]]). * Avoiding denotative color tasks ([[Color term|color naming]]) when possible. Some denotative tasks can be converted to comparative tasks by depicting the actual color whenever the color name is mentioned; for example, colored typography in "{{font color|purple|'''purple'''}}", {{color box|Purple|purple}} or "purple ({{Color sample|purple}})". * For denotative tasks ([[Color term|color naming]]), using the most common shades of colors. For example, green and yellow are colors of confusion in red–green CVD, but it is not common to mix forest green ({{Color sample|green}}) with bright yellow ({{Color sample|yellow}}). Mistakes by the color blind increase drastically when uncommon shades are used, e.g. neon green ({{Color sample|#0F5}}) with dark yellow ({{Color sample|#882}}). * For denotative tasks, using colors that are classically associated with a color name. For example, using "firetruck" red ({{Color sample|red}}) instead of [[Burgundy (color)|burgundy]] ({{Color sample|#802}}) to represent the word "[[red]]".
Edit summary
(Briefly describe your changes)
By publishing changes, you agree to the
Terms of Use
, and you irrevocably agree to release your contribution under the
CC BY-SA 4.0 License
and the
GFDL
. You agree that a hyperlink or URL is sufficient attribution under the Creative Commons license.
Cancel
Editing help
(opens in new window)