1. Perceivable
1.4 Distinguishable (Level A)
Contents
Guideline 1.4 Distinguishable
Make it easier for users to see and hear content including separating foreground from background.
Success Criterion 1.4.1 Use of Colour
Level A
Colour is not used as the only visual means of conveying information, indicating an action, prompting a response, or distinguishing a visual element.
Note: This success criterion addresses colour perception specifically. Other forms of perception are covered in Guideline 1.3, including programmatic access to colour and other visual-presentation coding.
Use of Colour Explained
Most estimates suggest that about 8% of males and 0.5% of females have some form of colour-blindness, ranging from an inability to see colour at all to minor deficiencies seeing specific colours.
Use of colour becomes a barrier for some people when it is used on its own in a meaningful way. For example, “click the green button to start and the red button to stop” is going to be problematic for people who may have trouble seeing greens or reds (the majority of colour-blind individuals) not to mention problematic for people who are blind. A solution in a case like this might be to add the word “Start” to the green button and “Stop” to the red button. Or, in the instructions, suggest using the first/left/top button to start and using the second/right/bottom button to stop.
A common issue in web content occurs when error feedback messages are presented in red or success feedback is presented in green, without some other indicator of what the text represents. A simple fix might be to include a checkmark icon with the success feedback (with alt text of course), and an X icon with an error message. Or, just include the word “Error” with an error message and “Feedback” or “Warning,” and so on with other forms of feedback.
Whenever colour is used in a meaningful way, some other element with equivalent meaning is required. Text as an alternative to colour is often a good choice.
Key Point: Forms of Colour-Blindness
- Protanopia: Insensitivity to red light, confusing greens, reds, and yellows
- Deutanopia: Insensitivity to green light, confusing greens, reds, and yellows
- Tritanopia: Insensitivity to blue light, confusing greens and blues
- Achromatopsia: Insensitivity to all colours, sees only black, greys, and white
Try This: Colour-Blindness
To experience colour-blindness, try the colour-blindness simulator.
Suggested Reading:
Success Criterion 1.4.2 Audio Control
Level A
If any audio on a web page plays automatically for more than three (3) seconds, either a mechanism is available to pause or stop the audio, or a mechanism is available to control audio volume independently from the overall system-volume level.
Note: Since any content that does not meet this success criterion can interfere with a user’s ability to use the whole page, all content on the web page (whether or not it is used to meet other success criteria) must meet this success criterion. See: Conformance Requirement 5: Non-Interference.
Audio Control Explained
When audio begins playing automatically when a web page loads, it can make it difficult for screen reader users to navigate. Since they rely on the output from their screen reader, other sounds playing at the same time can make it difficult to comprehend either audio stream. Even if there is a way to stop the automatically played audio, finding the stop control can be difficult if one has to distinguish between the audio and the screen reader output in order to find the control.
Though automatically playing audio when a web page loads is discouraged, in cases where it is necessary you must include a way to control the audio volume independent of the system’s audio controls, which also moderates the volume of the screen reader output. Users should be able to reduce the automatically playing audio volume or turn it off without affecting the volume of the screen reader.
Web content developers should avoid using the HTML autoplay attribute.
Try This: ChromeVox and YouTube Autoplay
Turn on ChromeVox. Then view this embedded YouTube video with your monitor turned off. Try to find the stop button using only your keyboard.
Video: Accessible Employment Standard for Small Businesses by ONgov
Suggested Reading:
