Accessible Name Mismatches Visible Label Check
Description
The “Accessible Name Mismatches Visible Label Check” evaluates whether there is any interactive element that does not contain the visible label text in its accessible name.
Example outcome
I identified 1 interactive element which does not have its visible label text in its accessible name.
Impact
- Visual Impairments: Hear an element labeled differently than what they visually see, leading to confusion or incorrect assumptions.
- Motor Impairments: Commands like “Click ‘Save’” won’t work if the accessible name is “Submit Form” while the button says “Save.”
- Cognitive Disabilities: Inconsistent labels increase cognitive load, making interaction less predictable and more error-prone.
Fixes
To address interactive elements whose accessible names don’t match the visible label:
- Locate the incorrect interactive element.
- Change its accessible name to match totally or contain the visible label.