E-mail List Archives
Thread: landmarks/regions
Number of posts in this thread: 10 (In chronological order)
From: Schulz, Leslie
Date: Tue, Oct 05 2021 2:46PM
Subject: landmarks/regions
No previous message | Next message →
I have been doing some work with landmarks/regions, and I was puzzled to find that screen readers are ignoring these HTML5 semantic tags:
Header
Footer
Article (with or without role="article")
Section (with or without role="region")
They only pull up
Header with role="banner"
Footer with role="contentinfo"
These 3 work as regions, with or without a role, if the actual html tag is used.
<main>
OR <div role="main"
<nav>
OR <div role="navigation"
<aside>
OR <div role="complementary"
The nav and the aside do require an accessible name, but they still are announced by screen readers as regions.
I used JAWS and accessed the region list at Insert + F3.
I used NVDA and accessed the region list at Insert + F7.
Windows 10.
Chrome-Version 94.0.4606.61 (Official Build) (64-bit)
Question: If you have done user testing or are a native screen reader user, how much do people rely on regions?
As a tester, do you regularly check for regions?
Do you have any insights about regions that you would like to share?
Thanks,
Leslie
Leslie Schulz, MSEd, CPACC
Web Accessibility Specialist, Learning Team
Content and Learning | Higher Ed & Skills
Quality Learning for All
Cengage Group
PHONE: 214.212.7379 Central Time
EMAIL: = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
WEB: cengage.com<http://www.cengage.com/>;
From: David Engebretson Jr.
Date: Tue, Oct 05 2021 3:01PM
Subject: Re: landmarks/regions
← Previous message | Next message →
Try using the shortcut to jump to regions:
* 'r' for JAWS
* 'd' for NVDA
Then those region names will be announced.
I test for them, and use them, all of the time.
Thanks!
David
-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Schulz, Leslie via WebAIM-Forum
Sent: Tuesday, October 05, 2021 1:46 PM
To: = EMAIL ADDRESS REMOVED =
Cc: Schulz, Leslie < = EMAIL ADDRESS REMOVED = >
Subject: [WebAIM] landmarks/regions
I have been doing some work with landmarks/regions, and I was puzzled to find that screen readers are ignoring these HTML5 semantic tags:
Header
Footer
Article (with or without role="article") Section (with or without role="region")
They only pull up
Header with role="banner"
Footer with role="contentinfo"
These 3 work as regions, with or without a role, if the actual html tag is used.
<main>
OR <div role="main"
<nav>
OR <div role="navigation"
<aside>
OR <div role="complementary"
The nav and the aside do require an accessible name, but they still are announced by screen readers as regions.
I used JAWS and accessed the region list at Insert + F3.
I used NVDA and accessed the region list at Insert + F7.
Windows 10.
Chrome-Version 94.0.4606.61 (Official Build) (64-bit)
Question: If you have done user testing or are a native screen reader user, how much do people rely on regions?
As a tester, do you regularly check for regions?
Do you have any insights about regions that you would like to share?
Thanks,
Leslie
Leslie Schulz, MSEd, CPACC
Web Accessibility Specialist, Learning Team Content and Learning | Higher Ed & Skills Quality Learning for All Cengage Group
PHONE: 214.212.7379 Central Time
EMAIL: = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
WEB: cengage.com<http://www.cengage.com/>;
From: Steve Green
Date: Tue, Oct 05 2021 10:01PM
Subject: Re: landmarks/regions
← Previous message | Next message →
I have just done a quick test with JAWS 2019, JAWS 2021 and NVDA 2021. I don't get the same results as you, but I get different results with each screen reader when testing the same page. All the landmarks are in the accessibility tree, so it seems that the screen readers are choosing to ignore some of them.
There are a lot of permutations of html element, "role" attribute and presence or absence of an accessible name, so quite a bit of testing will be required to work out what is happening unless the screen reader vendors have published anything in the release notes.
We always test for the use of landmarks when doing a WCAG audit, but we don't use a screen reader to do so - we use a bookmarklet and manual code inspection.
Steve Green
Managing Director
Test Partners Ltd
-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of Schulz, Leslie via WebAIM-Forum
Sent: 05 October 2021 21:46
To: = EMAIL ADDRESS REMOVED =
Cc: Schulz, Leslie < = EMAIL ADDRESS REMOVED = >
Subject: [WebAIM] landmarks/regions
I have been doing some work with landmarks/regions, and I was puzzled to find that screen readers are ignoring these HTML5 semantic tags:
Header
Footer
Article (with or without role="article") Section (with or without role="region")
They only pull up
Header with role="banner"
Footer with role="contentinfo"
These 3 work as regions, with or without a role, if the actual html tag is used.
<main>
OR <div role="main"
<nav>
OR <div role="navigation"
<aside>
OR <div role="complementary"
The nav and the aside do require an accessible name, but they still are announced by screen readers as regions.
I used JAWS and accessed the region list at Insert + F3.
I used NVDA and accessed the region list at Insert + F7.
Windows 10.
Chrome-Version 94.0.4606.61 (Official Build) (64-bit)
Question: If you have done user testing or are a native screen reader user, how much do people rely on regions?
As a tester, do you regularly check for regions?
Do you have any insights about regions that you would like to share?
Thanks,
Leslie
Leslie Schulz, MSEd, CPACC
Web Accessibility Specialist, Learning Team Content and Learning | Higher Ed & Skills Quality Learning for All Cengage Group
PHONE: 214.212.7379 Central Time
EMAIL: = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
WEB: cengage.com<http://www.cengage.com/>;
From: Glen Walker
Date: Tue, Oct 05 2021 11:39PM
Subject: Re: landmarks/regions
← Previous message | Next message →
I think both jaws and nvda have landmark settings. I'm not at my computer so can't verify but I recall seeing an option for which landmarks are surfaced and the default was not "all of them", which seemed strange.
Sent from my iPhone
From: Jonathan Cohn
Date: Wed, Oct 06 2021 12:54PM
Subject: Re: landmarks/regions
← Previous message | Next message →
Hello,
First I believe in the original post there was mention of "article" as a region, but it is not considered a region.
Secondly, in JAWS 2021 and possibly late JAWS 2020, there is a "HTML Verbosity" setting that allows one to control how much of the start/end group/article/region /list are spoken. I can't remember directly but there might be separate settings for Braille and html verbosity.
In NVDA some of this can be controlled in the object verbosity areas.
VoiceOver on Macintosh has one universal global verbosity area except for table and graphic verbosity settings in the web area. Generally, on the Mac one can set just an overall level, but there is an "additional speech verbosity options disclosure triangle" where one can adjust order and of various components, though I have sometimes found options here don't actually work at that granular a level.
Best wishes,
Jonathan Cohn
> On Oct 6, 2021, at 01:39, Glen Walker < = EMAIL ADDRESS REMOVED = > wrote:
>
> I think both jaws and nvda have landmark settings. I'm not at my computer so can't verify but I recall seeing an option for which landmarks are surfaced and the default was not "all of them", which seemed strange.
>
> Sent from my iPhone
> > > >
From: Schulz, Leslie
Date: Fri, Oct 08 2021 12:19PM
Subject: Re: landmarks/regions
← Previous message | Next message →
David Engebretson Jr. < = EMAIL ADDRESS REMOVED = >
Thank you for your mention of short cuts for landmarks, but they work for the same elements that I mentioned in my original email.
However, Jonathan Cohn < = EMAIL ADDRESS REMOVED = > talked about settings for verbosity in the screen readers themselves, and I need to look into that.
As for articles, mentioned by someone else, I did not find the article tag to be a landmark.
What surprised me the most is that headers and footers were not automatically landmarks. I taught web design and always emphasized the html5 semantic tags, so I thought it was interesting that they are just not as important as I thought they were.
Thank you for everyone for the comments. I will look into verbosity settings.
Leslie
-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of = EMAIL ADDRESS REMOVED =
Sent: Thursday, October 7, 2021 1:00 PM
To: = EMAIL ADDRESS REMOVED =
Subject: [EXTERNAL] WebAIM-Forum Digest, Vol 199, Issue 6
Send WebAIM-Forum mailing list submissions to
= EMAIL ADDRESS REMOVED =
To subscribe or unsubscribe via the World Wide Web, visit
https://urldefense.com/v3/__https://list.webaim.org/cgi-bin/mailman/listinfo/webaim-forum__;!!MXVguWEtGgZw!ZOj98JY0SBKBn3BcEdAe-Thv3kepV-W25xvehZUTK0jP_aCoRPEBaz0q6hEXCmedxSJJ$
or, via email, send a message with subject or body 'help' to
= EMAIL ADDRESS REMOVED =
You can reach the person managing the list at
= EMAIL ADDRESS REMOVED =
When replying, please edit your Subject line so it is more specific than "Re: Contents of WebAIM-Forum digest..."
From: glen walker
Date: Sat, Oct 09 2021 3:14PM
Subject: Re: landmarks/regions
← Previous message | Next message →
>
> What surprised me the most is that headers and footers were not
> automatically landmarks.
>
Just to clarify, the header and footer elements are absolutely (*) landmark
roles by default. Now, whether the verbosity setting on your screen reader
is set to announce them is another issue but any tool you use to highlight
all the landmarks will show the header and footer elements.
(*) Ok, maybe not "absolutely" because if a header or footer is a child of
an article, aside, main, nav or section element, then the header or footer
does not have a role (https://w3c.github.io/html-aria/#el-header). I don't
see that structure very often, though. Most scanning tools don't honor the
spec even though the accessibility tree is correct (at least in Chrome and
Firefox). That is, scanning tools will complain that there are two heading
landmarks if you have something like this:
<header>stuff</header>
<article><header>more stuff</header></article>
Even though the second header is marked as "role: HeaderAsNonLandmark" in
the a11y tree.
Keep preaching semantic html.
From: David Engebretson Jr.
Date: Sat, Oct 09 2021 4:20PM
Subject: Re: landmarks/regions
← Previous message | Next message →
What, in your opinion, is the best resource to learn from to preach semantic HTML?
I was just looking at https://www.w3schools.com/html/html5_semantic_elements.asp and was a little underwhelmed because the DOM seems to output things that aren't important to me. Note that I don't think everything I say or do while preaching semantics is totally correct I just have some ideas for our developers that I think could (and should to avoid irony) be used at w3Schools. Here is my screen reader (latest JAWS 2021) speech output:
HTML Semantic Elements heading level 1
Link â® Previous
Link Next â¯
* why can't the above links just be semantic buttons?
separator
* why is a separator exposed to screen reader users?
Semantic elements = elements with a meaning.
* I like this definition...
Anyhow, I'm super interested in all of your opinions and resources regarding preaching semantic HTML,
David
-----Original Message-----
From: WebAIM-Forum < = EMAIL ADDRESS REMOVED = > On Behalf Of glen walker
Sent: Saturday, October 09, 2021 2:14 PM
To: WebAIM Discussion List < = EMAIL ADDRESS REMOVED = >
Subject: Re: [WebAIM] [EXTERNAL] landmarks/regions
>
> What surprised me the most is that headers and footers were not
> automatically landmarks.
>
Just to clarify, the header and footer elements are absolutely (*) landmark roles by default. Now, whether the verbosity setting on your screen reader is set to announce them is another issue but any tool you use to highlight all the landmarks will show the header and footer elements.
(*) Ok, maybe not "absolutely" because if a header or footer is a child of an article, aside, main, nav or section element, then the header or footer does not have a role (https://w3c.github.io/html-aria/#el-header). I don't see that structure very often, though. Most scanning tools don't honor the spec even though the accessibility tree is correct (at least in Chrome and Firefox). That is, scanning tools will complain that there are two heading landmarks if you have something like this:
<header>stuff</header>
<article><header>more stuff</header></article>
Even though the second header is marked as "role: HeaderAsNonLandmark" in the a11y tree.
Keep preaching semantic html.
From: Jon Gunderson
Date: Wed, Oct 13 2021 4:22PM
Subject: Re: landmarks/regions
← Previous message | Next message →
The header and footer elements only generate landmarks when they are in a
certain contexts of a web page (e,g, scoped to body element), see ARIA
Authoring Practices for more information on using HTML elements to create
landmarks:
Guidance URL:
https://w3c.github.io/aria-practices/#aria_landmark
Example URL:
https://w3c.github.io/aria-practices/examples/landmarks/index.html
Another document that defines the roles of the the W3C ARIA in HTML
document has specifications for the HEADER and FOOTER elements:
https://www.w3.org/TR/html-aria/
Hope this helps,
Jon
On Sat, Oct 9, 2021 at 4:14 PM glen walker < = EMAIL ADDRESS REMOVED = > wrote:
> >
> > What surprised me the most is that headers and footers were not
> > automatically landmarks.
> >
>
> Just to clarify, the header and footer elements are absolutely (*) landmark
> roles by default. Now, whether the verbosity setting on your screen reader
> is set to announce them is another issue but any tool you use to highlight
> all the landmarks will show the header and footer elements.
>
> (*) Ok, maybe not "absolutely" because if a header or footer is a child of
> an article, aside, main, nav or section element, then the header or footer
> does not have a role (https://w3c.github.io/html-aria/#el-header). I
> don't
> see that structure very often, though. Most scanning tools don't honor the
> spec even though the accessibility tree is correct (at least in Chrome and
> Firefox). That is, scanning tools will complain that there are two heading
> landmarks if you have something like this:
>
> <header>stuff</header>
> <article><header>more stuff</header></article>
>
> Even though the second header is marked as "role: HeaderAsNonLandmark" in
> the a11y tree.
>
> Keep preaching semantic html.
> > > > >
From: glen walker
Date: Wed, Oct 13 2021 4:50PM
Subject: Re: landmarks/regions
← Previous message | No next message
Correct, Jon. You basically re-worded what I said last week (the
asterisk'ed section) but hopefully made it clearer.
On Wed, Oct 13, 2021 at 4:23 PM Jon Gunderson < = EMAIL ADDRESS REMOVED = >
wrote:
> The header and footer elements only generate landmarks when they are in a
> certain contexts of a web page (e,g, scoped to body element), see ARIA
> Authoring Practices for more information on using HTML elements to create
> landmarks:
>
> Guidance URL:
> https://w3c.github.io/aria-practices/#aria_landmark
>
> Example URL:
> https://w3c.github.io/aria-practices/examples/landmarks/index.html
>
> Another document that defines the roles of the the W3C ARIA in HTML
> document has specifications for the HEADER and FOOTER elements:
> https://www.w3.org/TR/html-aria/
>
> Hope this helps,
> Jon
>
>
>
> On Sat, Oct 9, 2021 at 4:14 PM glen walker < = EMAIL ADDRESS REMOVED = > wrote:
>
> > >
> > > What surprised me the most is that headers and footers were not
> > > automatically landmarks.
> > >
> >
> > Just to clarify, the header and footer elements are absolutely (*)
> landmark
> > roles by default. Now, whether the verbosity setting on your screen
> reader
> > is set to announce them is another issue but any tool you use to
> highlight
> > all the landmarks will show the header and footer elements.
> >
> > (*) Ok, maybe not "absolutely" because if a header or footer is a child
> of
> > an article, aside, main, nav or section element, then the header or
> footer
> > does not have a role (https://w3c.github.io/html-aria/#el-header). I
> > don't
> > see that structure very often, though. Most scanning tools don't honor
> the
> > spec even though the accessibility tree is correct (at least in Chrome
> and
> > Firefox). That is, scanning tools will complain that there are two
> heading
> > landmarks if you have something like this:
> >
> > <header>stuff</header>
> > <article><header>more stuff</header></article>
> >
> > Even though the second header is marked as "role: HeaderAsNonLandmark" in
> > the a11y tree.
> >
> > Keep preaching semantic html.
>
>