Intent
The intent of this Success Criterion (SC) is to help ensure that people with disabilities who rely on visual labels can also use those labels programmatically. Controls are often labeled with visible text. Controls also have a programmatic label, known as its Accessible Name. Users have a much better experience if the visible text labels of controls match their accessible names.
Speech input users can navigate by speaking the visible text labels of menus, links and buttons that appear on the screen. It’s confusing to speech input users when they say a visible text label they see, but the speech input does not work because the accessible name that is enabled as a speech input command does not match the visible label.
In addition, when the accessible name is different from the visible label, it essentially becomes an unknown hidden command for speech input users that can be accidentally activated without the user knowing what has happened.
Text-to-speech users will also have a better experience if the text they hear matches the text they see on the screen.
This issue is even more important for speech input and text-to-speech users who also have cognitive challenges. It’s an extra cognitive load for a speech input user to remember and say a speech command that is different from the visible label they see on a control. It’s also an extra cognitive load for a text-to-speech user to absorb and understand speech output that does not match the visible label.
Benefits
- Speech input users can directly activate controls on a page with fewer surprising changes of focus.
- Text-to-speech users will have a better experience because the labels that they hear match the visible text labels that they see on the screen.
Examples
- Accessible name matches visible label: The accessible name and visible label of a control match.
- Accessible name starts with visible label: The acessible name of a "Buy Now" button begins with the same text as the visible label.
Related Resources
Resources are for information purposes only, no endorsement implied.
Techniques
Each numbered item in this section represents a technique or combination of techniques that the WCAG Working Group deems sufficient for meeting this Success Criterion. However, it is not necessary to use these particular techniques. For information on using other techniques, see Understanding Techniques for WCAG Success Criteria, particularly the "Other Techniques" section.
Sufficient Techniques
- Ensure that visible labels match their accessible names
Advisory Techniques
Although not required for conformance, the following additional techniques should be considered in order to make content more accessible. Not all techniques can be used or would be effective in all situations.
If an icon has no accompanying text, consider using its hover text as its accessible name
Failures
The following are common mistakes that are considered failures of this Success Criterion by the WCAG Working Group.
- Accessible name does not contain the visible label text
- Accessible name contains the visible label text, but the words of the visible label are not in the same order as they are in the visible label text
- Accessible name contains the visible label text, but one or more other words is interspersed in the label
- Accessible name contains the visible label text, but one or more other words comes before the visible label text
Key Terms
text that has been rendered in a non-text form (e.g., an image) in order to achieve a particular visual effect
This does not include text that is part of a picture that contains significant other visual content.
A person's name on a nametag in a photograph.
text or other component with a text alternative that is presented to a user to identify a component within Web content
A label is presented to all users whereas the name may be hidden and only exposed by assistive technology. In many (but not all) cases the name and the label are the same.
The term label is not limited to the label element in HTML.
text by which software can identify a component within Web content to the user
The name may be hidden and only exposed by assistive technology, whereas a label is presented to all users. In many (but not all) cases, the label and the name are the same.
This is unrelated to the name attribute in HTML.
sequence of characters that can be programmatically determined, where the sequence is expressing something in human language
a part of the content that is perceived by users as a single control for a distinct function
Multiple user interface components may be implemented as a single programmatic element. Components here is not tied to programming techniques, but rather to what the user perceives as separate controls.
User interface components include form elements and links as well as components generated by scripts.
What is meant by "component" or "user interface component" here is also sometimes called "user interface element".
An applet has a "control" that can be used to move through content by line or page or random access. Since each of these would need to have a name and be settable independently, they would each be a "user interface component."