Accessible names for buttons (button-accessible-name)

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

Note: A <button> element with no inner text and no name-providing attributes (like aria-label) will have an empty accessible name and will not be announced correctly by screen readers.

Button with no accessible name:

This <button> element has an empty ("") accessible name because it has no content and no attribute that can provide an accessible name.


Note: Possible to implement because it can be programmatically detected when a <button> has no text and lacks attributes like aria-label, aria-labelledby, or title.

axe detected: 4.1.2  |  QualWeb detected: 4.1.2