Introduction

The purpose of this document is to introduce the reader to the main forms of colour-blindness, give an indication of what colours are seen for those types and suggest solutions to the presentation of links in order not to alienate colour-blind users.

Types of Colour-Blindness

There are 3 main types of colour blindness:

Protanomaly – affects approximately 1 percent of the male population.

'Red-weakness' requiring more than a normal amount of red in a red-green mixture to match a yellow.

Deuteranomaly – affects approximately 1.1 percent of the male population.

'Green-weakness' requiring more than a normal amount of green in a red-green mixture to match a yellow.

Tritanomaly (most common) – affects approximately 0.001 percent of the male population.

'Blue-weakness' requiring more than a normal amount of blue in a blue-green mixture to match a given blue-green.

Less than one percent of women suffer from any form of colour blindness.

To understand colour blindness better, it is helpful to be familiar with the ways in which colours differ from each other. One standard way to discuss colour is to divide it into hue, saturation and brightness (HSB).

Hue

Hue is the element that distinguishes one colour of the rainbow from another. It is the quality that infuses an object with "orangeness" or "redness" or "blueness". In terms of people with colour blindness, red and green hues are not differentiated as well as they should be.

Saturation

Saturation, the second element ofhe HSB colour model, is the "pureness" of the colour. High saturation equates to intense, "colourful" colour. A colour is desaturated by adding varying amounts ofhe its opposite or complementary colour. Adding some blue-green desaturates Red. As colours become more desaturated, they tend toward a neutral grey. Less saturated colours are harder for the colour-blind 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 colour is accomplished by diluting it with white, which makeshe colour become lighter or pastel, or with black, which makeshe colour become darker or more subdued. Colours with similar brightness are harder for the colour-blind to distinguish.

Table shows a webpage (www.theaa.com) as a normal sited person would see it and as the 3 main types of colour-blind people would see it.

Original Page

As a Protanomaly user would see it.

As aritanomaly user would see it.

As a Deuteranomaly user would see it.

The Colours that people see

When considering colours and the colour-blind it is useful to be aware of what they see compared with what a non colour-blind person sees.

The colour wheels¹ below can be used to give an indication of how normal colours are perceived by a colour-blind person.

Normal.

Deuteranopia.

Protanopia.

Another useful feature is to compare the full normal spectrum with those, which the colour-blind see.

The colour spectrum as perceived by individuals with normal color vision, protanopia, deuteranopia andritanopia².

Design Recommendations

View page design (with links) using a colour-blind filter plugin.

Avoid the use of

[Red, green, brown, grey, purple] next to, on top of, changing to [red, green, brown, grey, purple]

Use strong, bright contrast between foreground and background colours. Even totally colour-blind readers can differentiate similar colours, which contrast bright with dark.

Ultimately underlining links is the best way to distinguish a text link for both colour-blind and non-colour-blind users.

Links and References

Vischeck – has facility to allow the viewing of pages and graphics as a colour-blind person would see them.  Also a free PhotoShop plugin is available for download that will allow the viewing of images inthe various colour-blindness types.

http://vischeck.com/

Colour transformations – lists the colours that colour-blind users see for each of the colour blindypes for the 216 colour palette.

http://innovate.bt.com/people/rigdence/colours/colours1.html

MSDN article – “Can Colour Blind Users see your site?”

http://msdn.microsoft.com/workshop/design/colour/
hess10092000.asp

Accesible Web design – RNID recommendations.

http://www.rnib.org.uk/digital/hints.htm

MSDN article – “Can they Read it” describes the various ways that colour can come into play in application design, and how developers can ensure that people with various types of vision impairment can use their applications.

http://msdn.microsoft.com/library/default.asp?URL=/library/
periodic/period98/msdn_lowney7_4.htm

BT labs – article “Safeweb colours for colour-deficient vision.” Includes downloadable palettes for use with PhotoShop and PaintShop Pro

http://www.labs.bt.com/people/rigdence/colours/index.html

Usability Interface – Accommodating Colour blindness.

http://www.InternetTG.org/newsletter/mar99/
accessibility_color_challenged.html

Designing for the Colour-Challenged: A Challenge.

http://www.InternetTG.org/newsletter/mar99/
accessibility_color_challenged.html

¹ Colour wheels obtained from http://members.aol.com/nocolourvsn/colour2.htm

² Colour spectrums obtained from http://www.InternetTG.org/newsletter/mar99/
accessibility_color_challenged.html