2 March 2020 | Ted Page
Don’t rely on tools alone
When choosing accessible text and background colour combinations, it is important not to rely solely on tools (automated or otherwise) to tell you if you have sufficient contrast. Human judgment should always play a part in the process.
To illustrate why this is so, both of the panels below have contrast ratios of 4.5:1 between their respective text and background colours (the recommended minimum, as specified in WCAG SC 1.4.3). They have the same contrast ratios because they use exactly the same colours, but with one reversed with respect to the other.
However, despite having the same contrast ratios, to most people’s eyes the text in the left-hand panel has subjectively better contrast with its background than does the text in the right-hand panel.
Why the anomaly?
The reason for this anomaly is that large areas of dark background colour tend to make lighter coloured text or other thin foreground shapes look lighter than they actually are. Hence the perception of poorer contrast in the right-hand panel above.
How much more contrast?
How much you will need to adjust the contrast will vary from case to case. In the example below, the left-hand panel still has the original contrast ratio of 4.5:1 whilst the right-hand panel now has a contrast ratio of 9.0:1.
No doubt this is somewhat subjective, but in this case, all else being equal (leading, kerning, measure, font weight or the amount of text on the page, etc) doubling the contrast ratio for the right-hand panel is required to achieve similar results in each panel in terms of readability.
General readability problems with reversed out text
It is important to bear in mind that some people will find light text on a dark background difficult or even painful to read. See for example, Roger Johansson’s article Light text on dark background vs. readability, or Joe Dolson’s On the readability of inverted color schemes.
Creating accessible backgrounds in InDesign
The good news for PDF producers is that a properly built PDF will allow the user to customise both text and background colours to any desired combination. Please note, however, that this doesn’t happen automatically in InDesign-generated PDFs (or at all in Microsoft Word-originated documents): you have to know how to create customisable backgrounds in InDesign. Doing so is covered in detail in our Accessible PDFs from InDesign course.
Conclusion
Whilst tools for measuring colour contrast will generally stand you in good stead when measuring dark text on a light background, there is no substitute for human judgment when using reversed out text. You also need to ensure that your text and background colours are fully customisable for those who may struggle with inverted colour schemes.