button-name · WCAG 4.1.2 Name, Role, Value · Level AHow to fix the “button-name” accessibility issue
The axe-core button-name rule fails when a <button> (or element with role="button") has no accessible name — usually an icon-only button. Screen readers announce “button” with no purpose. WCAG 2.2 (4.1.2, Level A) requires every control to expose its name.
What axe-core checks
axe-core fails any button whose computed accessible name is empty: no text content, no aria-label/aria-labelledby, and no title.
Which standard this maps to
| WCAG 2.2 | 4.1.2 Name, Role, Value (Level A) |
| EN 301 549 | 9.4.1.2 |
| BFSG / EAA | BFSG § 12 via EN 301 549 · EAA Annex I |
| Category | Forms & Labels |
Why it matters
Icon buttons — hamburger menu, close (×), add-to-cart, quantity steppers — are everywhere in modern shops. An unnamed button is a dead control for keyboard and screen-reader users, and a clear Level A failure in a BFSG review.
Common causes
- Icon-only buttons (menu, close, search) with no label
- Buttons containing only an inline
<svg>with no title - A
<div role="button">with no name - CSS-only "buttons" that are actually empty elements
How to fix it
Give the button visible text, or an aria-label when it must stay icon-only. Hide the decorative icon from the accessibility tree with aria-hidden="true".
<!-- Fails -->
<button><svg>…</svg></button>
<!-- Passes -->
<button aria-label="Close dialog"><svg aria-hidden="true">…</svg></button>FAQ
Prefer visible text; it helps everyone. Use aria-label only when the button is intentionally icon-only.
axe accepts title as a fallback, but title is unreliable on touch and is not announced consistently — use a label.
Find every issue like this on your site
Run a free WCAG 2.2 AA scan — real axe-core engine, no signup. Or get a timestamped evidence report for €29.