Skip to main content
WCAGrules
Quick navigation

Include the visible label in the accessible name

G208 says the text a reader can see on a control has to appear, in its entirety, inside the name assistive technology receives. Not a paraphrase, not a synonym. The same string, present. Where extra context is genuinely needed, W3C recommends the visible text should come first, and marks that as a recommendation rather than a requirement. This is a sufficient technique for 2.5.3 Label in Name at Level A, one of two W3C documents for that rule. The test allows no tolerance, checking that the accessible name contains the same letters in the same order as the visible label. W3C also offers better advice than most implementations follow. If a control needs more context, put it in the accessible description through aria-describedby, and leave the name alone.

How we find it in an audit

Our reviewers compare each control's visible text against its accessible name, one by one, using an accessibility inspector. Then we try the visible words as voice commands and see whether the control responds. Buttons whose designers wrote a more descriptive aria-label are the usual finding, which is a well-meant change that breaks the control for voice users.

How affected users experience it

Voice control users say what they see. 'Click Search' works only if a control answers to the name Search, and an aria-label reading 'Submit query' means nothing on the page answers to it. For someone who cannot use a mouse or keyboard, a control that will not respond to its own visible name is a control they cannot operate at all. Nothing on screen explains why.

Passes vs. fails

Passes: targets big enough to hit. Fails: tiny, touching controls.

Passes

<button aria-label="Search this site">Search</button>. The name starts with the visible word, so 'Click Search' just works.

Fails

<button aria-label="Submit query">Search</button>. Saying 'Click Search' does nothing, because no control answers to that name.

How this gets tested

The W3C publishes test rules that define what a checker looks for here.

Other ways to satisfy this rule

5 guides on this site are filed under 2.5.3 Label in Name. W3C lists this one as sufficient for that rule on its own. Implement it correctly, in a way your readers' software actually supports, and the rule is met.

This guide is our interpretation of W3C technique G208: Including the text of the visible label as part of the accessible name. W3C publishes its techniques as guidance rather than as the standard, and says so on every one of them. The success criterion is what conformance is measured against, and a technique is one documented way to meet it.

Go somewhere useful

Find tools, resources and your workspace.

29 destinations