Level A
For user interface components with labels that include text or images of text, the name contains the text that is presented visually.>
Explanation
The accessible name of an element must contain a match for the visible label text. This means that speech recognition users can use the visible label text to refer to an element, and the speech recognition software (which uses the accessible name) will know which element they’re referring to.
Roles
- Content
- QA
Requirements
- The visible label for a form field is provided by an associated
<label>element and its accessible name is provided using the aria-label attribute, and the visible label and accessible name contain the same text; - The visible label for a link is provided by the content of the
<a href>element, and its accessible name is provided by the aria-label attribute, and both the link text and accessible name share the same text.
Common mistakes
- An element’s accessible name does not match its visible text label;
- An elements accessible name contains the same words as its visible text label, but the words are in a different order.