This is the continuation of a series. View previous.
Greyscale is only one method of removing colour from an image, and as it turns out, it’s an unrealistic way of doing it. The term colour-blind is misleading - almost no one sees in literal black and white (although that’s tempting to disbelieve at times when debating).
‘Colour deficiency’ is a more descriptive label. There are two main categories of deficiencies (and a handful of rarities and sub-types):
- Anomalous Trichromacy
- The least severe, those afflicted are still able to sense most or all colour, but ability to distinguish between them is reduced.
- Less common, but more severe, dichromats have problems with reds and greens, leaving them swimming in a world of blue and yellowy brown.
Referring back to part one, you will recall that value indicates how much light a colour reflects. Blues are darker than yellows, for example (view sample images). In most cases of colourblindness, the values don’t seem to shift too radically.
Except when it comes to warm colours. Those afflcited with Protanopia (a variation of Dichromacy) see even the brightest reds as dark brown or black. This can very well mean that the viewer of a brightly-lit red stoplight would fail to notice it’s even on.
So let’s apply this to our work then. In part one we discussed the legibility of text, and how value affects the perception of individual colours. Let’s extend that and look at how using value effectively can increase contrast of text and background colour, keeping in mind that there will be some who won’t be able to view our work with a set of eyes similar to ours.
We can start with the basic principles: black on white offers the most contrast, so blue or purple on white is a step down. However, blue and purple both have darker values than, say, orange or yellow, so they offer an intermediate point between full contrast and little to none.
Conversely, black text on a yellow or orange background is only a step down from black text on white. Black on blue can be quite near impossible to read.
This applies to saturated colours. The following figure shows instances of orange text on white and black text on purple that actually offer enough contrast for most users:
Of course, the preceding examples have assumed full colour capabilities. But they’ve also carefully managed to avoid colour combinations that present major problems. The most common trouble spots are red and green, so what of them?
There are two directions these could go. The colourblind viewer might see these with a brightness shift, or without a brightness shift. Both instances can potentially occur, and the results may be different depending on which type of colour deficiency the viewer suffers:
It’s tempting to think that, because you’re designing for a screen, the light emitted will be enough to prevent the dark variants from occuring. That is to say, even if a viewer can’t see the hue, they can still see light, and so would be more inclined to see variant A over variant B. That’s not the case however. Consider the red stop light example from earlier. Red is dark for some, whether it’s flat colour on a printed surface, or bright red light.
So the only hard and fast rule here is that there are no hard and fast rules. You can’t reliably predict what the end user will view when using problem colours like red or green.
The safest way to ensure your message gets across is, unsurprisingly, by following the WCAG guideline on the matter:
Ensure that text and graphics are understandable when viewed without color.
If color alone is used to convey information, people who cannot differentiate between certain colors and users with devices that have non-color or non-visual displays will not receive the information. When foreground and background colors are too close to the same hue, they may not provide sufficient contrast when viewed using monochrome displays or by people with different types of color deficits.
There is one small grey area, ironically. If you use a blue link within a field of black text, you are excluding almost nobody. The types of vision that can’t see blue are incredibly rare, and those afflicted have trouble viewing a computer monitor anyway.