This content originally appeared on Go Make Things and was authored by Go Make Things
Today, I wanted to share a post from my friend Ben Myers on [aria-label]
, [aria-labelledby]
, and [aria-describedby]
: what they do, how they’re different, and when to pick one over the other.
ARIA is a set of HTML attributes designed to tweak how a webpage is exposed to assistive technology. It can be… a lot. There are presently 36 aria-* attributes, each with their own specific or general use cases, their own rules for compatible elements and roles, and their own browser/screenreader support tables. On top of that, they can be hard to keep straight—when should you use
aria-valuenow
versusaria-valuetext
, oraria-checked
versusaria-selected
?I’ve written about ARIA before, but this time, I’d like to hone in on three ARIA attributes that, in my experience, are just similar enough to be confusing:
aria-label
,aria-labelledby
, andaria-describedby
.
If, like me, you know accessibility is important but often find the nuances of it confusing and overwhelming, go check out Ben’s post! It’s a very good read!
🔥 Join the Vanilla JS Academy! A new session starts on April 3. Click here to learn more.
This content originally appeared on Go Make Things and was authored by Go Make Things

Go Make Things | Sciencx (2023-03-24T14:30:00+00:00) ARIA labels and descriptions. Retrieved from https://www.scien.cx/2023/03/24/aria-labels-and-descriptions/
Please log in to upload a file.
There are no updates yet.
Click the Upload button above to add an update.