Skip to content
Learn Measure Blog Case studies About
On this page
  • How the Lighthouse button name audit fails
  • How to add accessible names to buttons
  • Resources

Buttons do not have an accessible name

May 2, 2019 — Updated Mar 20, 2020
Available in: Español, 日本語, 한국어, Português, Русский, 中文, English
Appears in: Accessibility audits
On this page
  • How the Lighthouse button name audit fails
  • How to add accessible names to buttons
  • Resources

When a button doesn't have an accessible name, screen readers and other assistive technologies announce it as button, which provides no information to users about what the button does.

How the Lighthouse button name audit fails #

Lighthouse flags buttons that don't have text content or an aria-label property:

Lighthouse audit showing buttons do not have an accessible name
The Lighthouse Accessibility score is a weighted average of all the accessibility audits. See the Lighthouse accessibility scoring post for more information.

How to add accessible names to buttons #

For buttons with visible labels, add text content to the button element. Make the label a clear call to action. For example:

<button>Book room</button>

For buttons without visible labels, like icon buttons, use the aria-label attribute to clearly describe the action to anyone using an assistive technology, for example:

This sample app relies on Google's Material icon font, which uses ligatures to convert the buttons' inner text to icon glyphs. Assistive technologies will refer to the aria-label rather than the icon glyphs when announcing the buttons.

See also Label buttons and links.

Resources #

  • Source code for Buttons do not have an accessible name audit
  • Buttons must have discernible text (Deque University)
Last updated: Mar 20, 2020 — Improve article
Return to all articles
Share
subscribe

Contribute

  • File a bug
  • View source

Related content

  • developer.chrome.com
  • Chrome updates
  • Web Fundamentals
  • Case studies
  • Podcasts
  • Shows

Connect

  • Twitter
  • YouTube
  • Google Developers
  • Chrome
  • Firebase
  • Google Cloud Platform
  • All products
  • Terms & Privacy
  • Community Guidelines

Except as otherwise noted, the content of this page is licensed under the Creative Commons Attribution 4.0 License, and code samples are licensed under the Apache 2.0 License. For details, see the Google Developers Site Policies.