The Archive of Random Material Just a collection of summarized resources I find useful

Labelling Elements using aria-label

By
Read original article

The aria-label element should be used judiciously. When defined on an HTML element, it’s supposed to set that element’s accessibility name which is read by screen readers. While useful, there are some things to be aware of:

  • aria-label is not allowed to be used by every element (see specification)
  • Behaviour between browsers and assistive tools differ
  • Text in aria-label cannot be searched the same way visible text can

Generally speaking, HTML provides better ways to set an element’s accessible name:

  • The element’s text content (as with <button>)
  • An image’s alt text
  • Table caption content
  • Form labels

Therefore, use of aria-label should be an exception only when there is no other reasonable way to make something accessible.