aria-labelledby

Identifies the element (or elements) that labels the current element. aria-labelledby (property)

Links about aria-labelledby

1. aria-label, aria-labelledby, and aria-describedby: What’s the Difference?

   posted on December 7, 2020

   Diving deep into three attributes that bring clarity to elements in assistive technologies.

   

2. The difference between aria-label and aria-labelledby - Tink - Léonie Watson

   posted on August 24, 2020

   

3. Short note on aria-label, aria-labelledby, and aria-describedby

   posted on July 18, 2018

   Be careful when you use the aria-label, aria-labelledby, and aria-describedby attributes, because they do not work consistently with all HTML elements. This is a short note on when (and when not) to u

   Tags:

   • accessibility
   

4. Using the aria-labelledby attribute

   posted on March 18, 2019 by MDN

   The aria-labelledby attribute establishes relationships between objects and their label(s), and its value should be one or more element IDs, which refer to elements that have the text needed for labeling. List multiple element IDs in a space delimited fashion. This idea is similar to how the “for” a…

   

This might be interesting as well

Accessible SVGs | CSS-Tricks

posted on August 28, 2016 by Heather Migliorisi

Scalable Vector Graphic (SVG) is emerging as the preferred graphic format to use on the web today. Are you abandoning the icon font or replacing old pg,

Tags:

• accessibility

Code sample

<svg viewBox="0 0 100 100" aria-labelledby="title_id" role="img">
  <title id="title_id">Navigation</title>
  <path … />
</svg>