1.3.3 Sensory Characteristics
Level: A | Principle: Perceivable | Since: WCAG 2.0 | Automation: Manual
What This Means
Instructions and information provided to users must not rely solely on sensory characteristics like shape, color, size, visual location, orientation, or sound. When you say "click the round green button" or "see the sidebar on the right," you are excluding users who cannot perceive those characteristics.
Instructions must include additional non-sensory cues such as text labels, names, or roles that are programmatically determinable. You can still use sensory references, but they must not be the only way to identify or understand content.
Who This Affects
- Blind and low-vision users — they cannot identify elements by shape, color, size, or visual position
- Color-blind users — they cannot distinguish elements described only by color
- Deaf and hard-of-hearing users — they cannot perceive instructions that rely solely on sound cues
- Screen reader users — screen readers do not convey shape, position, or visual formatting
Common Pitfalls
1. Instructions that rely on shape
<!-- Bad: relies on shape to identify the control -->
<p>Click the round button to submit your form.</p>
<button style="border-radius: 50%;">Submit</button>
<button style="border-radius: 0;">Cancel</button>
2. Instructions that rely on visual location
<!-- Bad: relies on position to identify content -->
<p>Important warnings are listed in the right-hand column.</p>
3. Instructions that rely on color alone
<!-- Bad: color is the only identifier -->
<p>Required fields are marked in red.</p>
<label style="color: red;">Email</label>
<label>Nickname</label>
4. Instructions that rely on sound
<!-- Bad: relies on an audio cue with no visual/text equivalent -->
<p>When you hear a beep, the upload is complete.</p>
5. Using icons without text labels
<!-- Bad: instruction references an icon shape -->
<p>Click the gear icon to open settings.</p>
<button><svg><!-- gear icon --></svg></button>
How to Fix
Combine sensory and non-sensory cues
<!-- Good: uses both label text and visual description -->
<p>Click the "Submit" button to send your form.</p>
<button>Submit</button>
Add text labels alongside color indicators
<!-- Good: color plus text/icon indicator -->
<p>Required fields are marked with an asterisk (*).</p>
<label>Email *<span class="sr-only">(required)</span></label>
<input type="email" required>
Reference content by name, not location
<!-- Good: references section by name -->
<p>Important warnings are listed in the "Safety Alerts" section.</p>
<section aria-labelledby="safety-heading">
<h2 id="safety-heading">Safety Alerts</h2>
<!-- warnings here -->
</section>
Provide multiple cues for sound-based feedback
<!-- Good: both sound and visual feedback -->
<p>When the upload is complete, a confirmation message will appear and a chime will play.</p>
<div role="status" aria-live="polite" id="upload-status"></div>
Label icon buttons with text
<!-- Good: icon has a visible or accessible text label -->
<button aria-label="Settings">
<svg aria-hidden="true"><!-- gear icon --></svg>
<span>Settings</span>
</button>
How to Test
- Read through all instructional text on the page, looking for references to shape, color, size, visual location, or sound (words like "round button," "red text," "right sidebar," "above," "below," "beep").
- For each sensory reference found, verify it also includes a non-sensory identifier such as a text label, name, or heading (e.g., "the Submit button" instead of "the green button").
- Check that error states are not communicated solely by color (e.g., red text without an error message).
- Open a screen reader and try to follow all on-page instructions. If any instruction requires seeing the page to act on it, it fails.
- Pass: Every instruction or reference includes a non-sensory identifier (label name, heading text) in addition to any sensory cues.
- Fail: Any instruction relies solely on shape, color, size, position, or sound to identify content or convey information.
axe-core Rules
No automated axe-core rules. This criterion requires manual testing.