Level AAWCAG 2.2
3.2.4 Consistent Identification
Components that have the same functionality are identified consistently.
Why it matters
Cognitive impairment
If the same feature uses different icons or labels, users cannot recognize it as the same feature.
Screen readers
Inconsistent accessible names make users think the same feature is something different.
Older users
Consistent UI patterns lower the learning cost and reduce operational errors.
All users
Consistent UI increases predictability and enables efficient operation.
Live demo
Consistent icons and labels for the same function
Function: Search
Page A
Search
Page B
Find
Function: Save
Page A
Download
Page B
Save item
Problem: If the same function uses different icons or labels, users may not realize it is the same action. This is especially hard for users with cognitive disabilities and screen reader users.
Components with the same function should use consistent icons and labels across the site. Keep the identification method consistent both visually and programmatically.
Persona perspective
Watanabe (60) — Mild cognitive impairment
On one page a magnifier icon says 'Search', on another a binoculars icon says 'Find'. They do the same thing, but I can't tell, and I feel anxious every time: 'what does this button do?'