WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: The importance of landmarks to screen readers?

for

From: David Engebretson Jr.
Date: Mar 23, 2021 4:57PM


I agree with Glen's comments and would like to put in a cent or two regarding aria-label's in landmark/regions:

If you are using a <nav>, please don't put the word "navigation" in your aria-label. Screen readers will read an aria-label="main site navigation" as
"main site navigation navigation region. The repetition can be redundant and cognitively taxing.

It's a common problem in region naming so I'd suggest that a manual review of how assistive technologies read the landmark/region is super important to reduce the cognitive load on your users.

Thanks!
David


-----Original Message-----
From: WebAIM-Forum < <EMAIL REMOVED> > On Behalf Of glen walker
Sent: Tuesday, March 23, 2021 1:33 PM
To: WebAIM Discussion List < <EMAIL REMOVED> >
Subject: Re: [WebAIM] The importance of landmarks to screen readers?

You often find scanning tools that flag a lack of landmarks as an error.
Or more frequently, they're marked as a "best practice" but many people miss the "best practice" part and think *all* errors found by the tool are required to be fixed.

Nothing in WCAG requires landmarks directly. They can absolutely be helpful for navigating the page (with assistive technology) and aiding in
2.4.1 conformance. They can also be helpful in satisfying 1.3.1 since you can often visually discern a "relationship" among elements that should be programmatically conveyed. But it can be a bit subjective on whether landmarks are really "required".

But does it matter if they are technically needed or not? From a UX perspective, they're super handy so go ahead and implement them. If browsers would implement a native way to navigate by landmarks then more users could benefit from them, especially keyboard users.

And if you are going to implement them, lean towards using native semantic html elements first before relying on ARIA roles. Use <header>, <footer>, <main>, <nav>, <section>, <aside>, etc. And other than <header>, <footer>, or <main>, you should also specify an aria-label for the landmark.