Accessible names for buttons (button-accessible-name)

Buttons must have non-empty accessible names, using visible text, aria-label, or aria-labelledby attributes.

Note: Elements with role="button" must be given an accessible name using aria-label, aria-labelledby, or visible text content. If the element is empty and lacks these attributes, assistive technologies will announce nothing.

Role button with no name:

This <span role="button"> element has an empty ("") accessible name. It contains no text content and does not have a aria-label or aria-labelledby.


Note: Possible to implement because it can be programmatically detected when an element with role="button" has no text content and lacks aria-label or aria-labelledby.

axe detected: 4.1.2  |  QualWeb detected: 4.1.2