Title: 7.5. Web design and colour vision deficiency
Course: EN_Colour theory > Section: 7. Colour as a design element for E-Designers

Web design and colour vision deficiency

Approximately one in 100,000 people can only see in shades of grey, which is generally understood to mean they are "colour blind". These people are also often hypersensitive to brightness. Colloquially, red-green vision deficiency and red-green blindness are referred to as colour blindness.

There are different forms of colour vision deficiencies:

- lack of red - green differentiation
- missing blue - yellow differentiation

Red-green visual impairment can vary in severity: Green cones degenerate (green vision deficiency) or are completely absent (green blindness).

What does colour vision deficiency mean for web design?

The different perception of colours is not the actual problem. But, it becomes usability-unfriendly and difficult for people with colour vision deficiencies when the different kind of impairments are not considered.

- when a certain meaning is associated with a colour
- when combinations of certain hues and shades make it hard to distinguish between colors.

Examples:
(a) Diagrams
They often consist of two parts, the graphic representation and the associated legend, which lists the designations and explanations of the graphic. The graph itself often has no labelling, but the individual bars are assigned according to their colour to the points marked with the corresponding colour in the legend.
Thus, if a visitor with colour vision impairment cannot distinguish the colours of the bars in a diagram, he or she will also not be able to assign the bars to the respective point in the legend. This makes such a diagram unusable for a person with colour vision deficiency.

b) Maps
Where areas are marked in colour and then listed in a legend: this is problematic for people with colour vision impairment if the legend functions exclusively via colouring.

Possible solutions:

- Here it helps to provide the colour coding with a second, colour-independent coding scheme. For example, areas can be provided with hatching - crosswise, lengthwise, diagonally, with thick or thin strokes, etc.
- Or colours are used that all those affected, regardless of which of the colour vision deficiencies they have, can tell apart, e.g. different shades of yellow and brown. Red, green and blue should be avoided.

People with colour vision deficiencies are usually used to distinguishing objects by their patterning, texture or other criteria, such as their light-dark contrast, rather than by their colouring.

Try it out, how pepole with colour vision deficiency perceiving things on the web.

8_The three most common types of color blindness.h5p

MORE ABOUT COLOUR VISION DEFICIENCY

- Adobe about the importance for designers
- With this tool, you can filter web pages and perceive them through the eyes of someone with colour vision impairment.
- Wikipedia (engl)