[ARIA] Group different DOM element in screen reader by using aria-labelledby

Labeling inputs, elements, and widgets add context and clarity for assistive technology such as screen readers. When there are already one or more other elements that themselves can be used to provide labeling text to another element an aria-labelledby attribute can be added to that element.

Some examples of appropriate use cases for using an aria-labelledby are:

• Combine multiple labels together
• Associate headings with regions
• Label for a widget

 

<div aria-labelledby="noMoviesText addLink">
  <span id="noMoviesText">
    No Movies in your Wish List!
    <Link id="addLink" to="/browse">
      Add some!
    </Link>
  </span>
</div>