Don’t use presentation that relies solely on colour.
Users with visual impairments, including difficulties perceiving colour, may need help where colours on your website present information.
You can solve this by using other identifiers such as labels, shapes and patterns, issue.
How to Pass ‘Use of Colour’
- Ensure no instructions rely on colour alone
- Ensure that no information (like charts and graphs) relies on colour alone
‘Use of Colour’ Tips
Check for issues by viewing your website in black and white. Are there any instructions you can’t follow or is there information you can’t understand?
Making your website accessible to colour blind users is simple. The main area to focus on is giving instructions. Saying things like ‘Click the green button’ or ‘Required fields are red’ is useless to users who can’t see green or red. Reinforce these instructions with at least one more identifying remark.
A common failure is link text. Marking this out with a change of colour alone isn’t good enough, use an underline, bolding or a symbol too.
Another point is to make sure that important graphics are not dependent on colours alone. For example, your users might not understand a pie chart where only colours separate the segments. In this case, you should add clear labelling and patterns to the segments.
There’s an overlap here with 1.3.3 – Sensory Characteristics. Instructions should always be clear and give your users the detail they need.
A lot of people like to remove the “default” underline from links. While they may then color the links differently from surrounding text, would this be considered relying on color alone to convey meaning?
At a high level yes. The hover effect on a link can reduce some of this issue though. If the link text was clear it was a link, the underline wouldn’t be needed either.