Avoiding colour to alert users to meaning
Accessibility
Alerting your users is important and we have many ways to do this. The best way is almost always text/language.
Reason
Some methods used can stop users from being able to get clear information. This can be because they cannot perceive colour, for example.
Best practice
If you want to alert folks to something, the best way to do this is always through clear, concise language. This is the base method because, as long as the language is succinct and the font is clear they will be able to access the text by reading it visually or by using assistive technology.
You can employ other methods. You can read about the alerts block in cuTheme, for example. They look like this:
Here is some information
Oops! An Error!
Danger, Will Robinson!
You did it – Well done!
Note that although they are different colours, it is not the colour alone which signals the meaning. The language is the main way to signify the meaning of the alert. In addition, there is an icon which adds meaning.
Example of less accessible practices
Relying on colour alone can leave people guessing. If you are unable to perceive colour because of “colour blindness” or are accessing the content via a screen reader, the presence of colour is either moot or misleading. For example,
Should you invest in a vacation timeshare in Ottawa for February?
We think this colour answers the question for you!
…especially when the text is also ambiguous.
Additional benefits
- Usability: For anyone, the use of colour could be misleading. Culturally, colours have different meanings in different societies or age groups. Avoiding reliance on colour as a visual signal makes content less ambiguous.
- SEO: The more you place the meaning of your content into text, the easier it is for search engines to index your page. Search engines don’t index based on colour.
- Marketing: The easier it is for people to understand content the easier it is to find information. Generally, this help promote Carleton as a place where information in easy to find and accessible.
What WCAG says
(Be sure to learn more about errors and alerts.)
From WCAG:
Their success criteria is: “Color is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element.”