2.5.3 Label in Name

About

For user interface components with labels that include text or images of text, the name contains the text that is presented visually.

All visible text labels must match their programmatic names to facilitate users using speech-to-text technologies to interact with the content based on an intuitive visual label.

WHO BENEFITS WITH 2.5.3 LABEL IN NAME?

  • People who rely on speech recognition software are the primary beneficiaries of this WCAG 2.1 requirement.
  • People who use screen reading software also benefit specifically when the visual labels are programmatically associated.
  • People who have cognitive challenges benefit with the labels in name

Label:

The label identifies the control to all users. It is generally the visible text. Examples of labels are the label element on a form control or the text of a link.

Name:

The name is what assistive technology uses to identify the control to the user. This means it can be programmatically determined and why it is often referred to as the accessible name. The accessible name is not related to the name attribute on input elements.

A control may have both an accessible name and a label. The name may be the same as the label or the name may not be detectable on the page unless you are using an assistive technology.

Example:

Before Rectification

Before Rectification

When a speech-input user speaks a command “Click Buy”, the speech input does not activate the button control because the programmatic name that is enabled as a speech-input command does not match with the visible text label.

After Rectification

After Rectification

The programmatic names are exactly the same as the visual text labels of the buttons, so that the speech-input user can activate the control by speaking the visual text label.