Sensory characteristics can be very useful in helping people to process information and follow instructions, however, they are problematic for people who have sensory impairments. This page is about criterion 1.3.3, which states:
Instructions provided for understanding and operating content do not rely solely on sensory characteristics of components such as shape, colour, size, visual location, orientation, or sound.
What are sensory characteristics?
Sensory relates to our senses. If any instructions rely on any one of our senses to understand and follow them, then a person with an impairment of that sense would be excluded. When we are talking about digital content, this usually refers to sight and sound.
Some examples of instructions that rely on sensory characteristics are:
- Click the green triangle to begin.
- Select a t-shirt size by clicking the small, medium or large circle.
- To get more information, click on the button in the top right corner of each image.
- The test finishes when the clock chimes.
What should I do?
Should you never use sensory characteristics then? No, because they can be helpful to some people. It is good to use them, where it might be useful to people who find reading and processing instructions difficult. However, the key word in the criterion is solely. You must also provide the same information in text.
There are different ways of providing sensory information in text and you will need to consider which is best in each situation. Here are some examples:
Use alt text for images
For buttons that include colour and shape, they might be an image. If so, you can add alt text to the image.
<img src="Images/play-button.png" alt="Play">
<img src="Images/stop-button.png" alt="Stop">
If you are using images as buttons though, make sure your images have sufficient resolution that they are still clear if the user is zoomed in.
Another way of meeting this criterion is to simply provide the information in multiple ways. As well as using sensory characteristics, provide the same information in text. In the following example, the button does not actually do anything. It is just to demonstrate the point.
<button type="button"><img src="Images/play-button.png" alt="">Play</button>
You may have noticed that in this example, the image has been marked as decorative, with
alt="". This is because the word Play is already there, so it is redundant information.
The basic rule is that if you need to see or hear something to be able to follow an instruction or operate your content, then that same information must be provided in a form that can accessed in a different way. For visual things, this means making the information available to a screen reader. For auditory things, you would need to provide a visual cue as well. That visual cue would need to be available to screen readers too, so that a deafblind person does not miss it.