WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: ARIA to distinguish sections with same HTML tag


From: Graham Armfield
Date: Jan 19, 2020 12:31PM

Another use case that favours aria-labelledby is if your content is ever
likely to be presented in an alternate language.

When content is translated it is sadly common for ARIA and alt attributes
to get missed.

Graham Armfield
Coolfields Consulting

On Sat, 18 Jan 2020, 16:26 glen walker, < <EMAIL REMOVED> > wrote:

> From a computer science perspective, using an indirect reference
> (aria-labelledby) is better than a literal reference (aria-label),
> especially for maintenance reasons.
> If I had a literal string that I used several times in my program, while I
> could have that string repeated every time, if I decide to change the value
> of that string, I would have to change every occurrence in the code.
> Instead, I would declare one variable with the value of that string then
> use that variable throughout my code. If I decide to change the value of
> that string, I change it once in the variable and don't have to touch the
> rest of the code.
> So my preference is to use aria-labelledby (like a variable, indirect
> reference) whenever possible, but it's only useful if the literal string is
> referred to more than once on the page. So if there's a heading or a
> paragraph or a span that contains the string and I want to use that string
> to label a landmark or add more context to a link, I will always use
> aria-labelledby. Then later, if someone decides to change the heading,
> paragraph, or span, the landmark or link that refers to it will
> automatically be updated.
> If the string only appears once, then I would use aria-label.
> So in your two examples, the first I would use aria-label because "Blog"
> doesn't appear anywhere else on the page but the second I would use
> aria-labelledby (rather than repeating "Blog Navigation" in an
> aria-label). Exactly as you have it coded.
> > > > >