Critical
4.1.2 Name, Role, Value · Level A
Give buttons a discernible name (WCAG 4.1.2)
Every button must have text or an accessible label so assistive tech can announce what it does.
Why it matters
An icon-only button with no label is announced as just "button" — the user has no idea whether it saves, deletes, or closes.
How to fix it
Add visible text, or an aria-label for icon-only buttons. Make sure the label says what the button does.
<!-- Fails -->
<button><svg>…</svg></button>
<!-- Passes -->
<button aria-label="Close dialog"><svg>…</svg></button>
Related guides
- Fix low colour contrast (WCAG 1.4.3) 1.4.3 Contrast (Minimum)
- Add text alternatives to images (WCAG 1.1.1) 1.1.1 Non-text Content
- Give links a discernible name (WCAG 2.4.4) 2.4.4 Link Purpose / 4.1.2 Name, Role, Value
- Label every form field (WCAG 1.3.1 / 4.1.2) 1.3.1 Info and Relationships / 4.1.2 Name, Role, Value
These guides cover automated checks (~30–40% of WCAG criteria). A full audit also needs manual review.