Missing Name or Role
Every control a keyboard user can reach has to announce two things to a screen reader: what it is (its role — button, link, checkbox) and what it is for (its name — "Search", "Close", "Accept terms"). A control missing either one is announced as an unlabelled blank, and the user has no way to know what activating it would do.
This check finds tabbable elements with no accessible name, no role, or neither.
What the tool checks
Every element that can be reached with the Tab key must have:
- an accessible name, and
- a role.
The tool reads both from the browser's own accessibility tree — the same description of the page that a screen reader receives. That means the result reflects what a real assistive technology user would actually hear, not what the markup claims.
Why reading from the browser matters
The accessibility tree is what the browser has worked out after it has:
- processed the HTML and applied the styles,
- run the page's scripts,
- resolved the ARIA attributes,
- and merged in content from web components and embedded frames.
Three consequences follow, and they are the reason this check is reliable:
The name is the final name. A control's accessible name can come from a label, an aria-label, referenced text elsewhere on the page, image alternative text, or its own visible content — with precedence rules between them. The browser resolves all of that and reports one final value. There is no second-guessing: the reported name is the announced name.
The role is the resolved role. It may be implicit, coming from the element type itself (a <button> is a button), or explicit, set with an ARIA attribute (role="dialog", role="tab"). Either way, what the tool sees is the role assistive technologies will use.
Web components and embedded frames are included. Content inside shadow DOM and inside iframes is already folded into a single flattened structure, exactly as a screen reader would encounter it. Nothing has to be stitched together separately, and nothing in those contexts gets missed.
When it reports an issue
A tabbable element is announced:
- without a role
- without an accessible name
- without either
What the report says
Title: The element 'affected element name' is announced without an accessible name
(or: without a role, or: without an accessible name or role)
WCAG checkpoint: 4.1.2 - Name, Role, Value
How to verify it by hand
- Turn on a screen reader.
- Tab through the page.
- Listen to each stop. You should hear both what the control is and what it does — "Search, button", not just "button" or an unnamed pause.
WCAG reference
Success Criterion 4.1.2 Name, Role, Value (Level A)
