Powered by
Names, roles & states
An ARIA Label Is on an Element That Can't Have One
Some elements aren't allowed a hidden label, so screen readers may skip it — and people miss the words you meant them to hear.
aria-prohibited-attrWCAG 2.0Introduced in WCAG 2.0.Level AA — the minimum. Missing it blocks people outright.
- Status
- SeriousSerious — Significant friction, or information that is lost.CurrentScanners run this rule today.
- Owner
- DesignDevTest
- Audit
- Automated+ManualA scanner finds it; a person confirms the fix.
Why it matters
Attributes like aria-label give an element a name for screen readers. Plain div and span elements, and things marked role="none", aren't allowed a name.
Screen readers handle this differently. Some read the label, some ignore it, and some read the content instead. So people who can't see the screen may miss key information, like a rating or an error.
Who it affects
| Who | What they experience | Impact |
|---|---|---|
| Screen reader users | They hear the raw content, like "star star star star", or nothing, instead of "4 out of 5 stars". | High impact |
| Low-vision users (magnification) | Affected only if they also use a screen reader, as many do. | Partial impact |
Business & product impact
| Area | Why | Impact |
|---|---|---|
| Legal | This relates to WCAG 4.1.2 at Level A, the minimum. Complaints under Australia's Disability Discrimination Act point to WCAG, and EN 301 549 includes it. | High impact |
| Conversion | Missing ratings, prices or error words can stop people choosing or finishing a form. | Moderate impact |
| SEO | No real search benefit — don't sell it as one. | Low impact |
| Brand trust | It shows the team tried, but the result still fails real users. | Low impact |
| Cost to fix | Usually a small fix. Fix it once in the shared component. | High impact |
Fixing it in code
A star rating
Don't
<span aria-label="4 out of 5 stars">★★★★☆</span>A screen reader says: “Black star, black star, black star, black star, white star”
Do
<span role="img" aria-label="4 out of 5 stars">★★★★☆</span>A screen reader says: “4 out of 5 stars, image”
Giving it a role like img makes a label allowed.
An error message
Don't
<div class="error" aria-label="Error">Check the date</div>A screen reader says: “Check the date”
Do
<div class="error"><span class="visually-hidden">Error: </span>Check the date</div>A screen reader says: “Error: Check the date”
Hidden text inside the element is read by every screen reader.
Designer's handoff note
When meaning comes from icons or colour alone, write the words a screen reader should say — for example, "4 out of 5 stars".
Mark these in your handoff so developers know what text to add.
Quick test
Tool
NVDA (opens in a new tab) (free for Windows)
Checklist
- Pass
- You hear the meaning, like "4 out of 5 stars".
- Fail
- You hear symbols, nothing, or words without the meaning.
Check these at the same time
- An ARIA attribute is used where it isn't allowed
aria-allowed-attr
What a green scan still misses
A scanner finds the label in the wrong place. It can't tell whether your fix says the right thing — for that, listen.
Reference
- Rule ID
aria-prohibited-attr- Raised by
- axe-core: “Elements must only use permitted ARIA attributes”
- WCAG
- 4.1.2 Name, Role, Value (opens in a new tab) · Level A · since WCAG 2.0
- Other standards
- EN 301 549 9.4.1.2 · RGAA 7.1.1
- Last reviewed
- 14 October 2026