E-mail List Archives
Thread: what to do when <section> flags as accessibility error
Number of posts in this thread: 11 (In chronological order)
From: Angela French
Date: Fri, Dec 02 2016 12:24PM
Subject: what to do when <section> flags as accessibility error
No previous message | Next message →
Hello,
We are piloting the use of Siteimprove. One of its features is site-wide accessibility scanning and reporting. It is indeed helping us find things we had overlooked.
On our site (example page<http://www.sbctc.edu/starting-your-career/right-career-for-you.aspx>;) it is flagging the use of the html5 <section> tag. We have used this tag to delineate everything in-between (excluding) the top global navigation elements and the footer.
The error reads:
"The page contains an HTML5 <section> or a WAI-ARIA landmark of the type 'region'. These types of landmarks are very general and should be named to help users identify the purpose of the landmark"
It says the fix is to : "Use either the WAI-ARIA attribute 'aria-label' or 'aria-labelledby' to name the landmark in a way that clearly explains the purpose of the landmark to all users."
Looking back, the use of the <section> tag seems superfluous as there is only one. But doesn't the use of an h1 heading as the first thing within the section content function similarly to providing some sort of ARIA attribute such as 'aria-label' or 'aria-labelledby'?
I am looking for a solution that would be easy to implement site-wide. Removing the <section> element altogether would be a major pain.
Thank you, as always, for your opinions.
Angela French
Internet/Intranet Specialist
Washington State Board for Community and Technical Colleges
360-704-4316
= EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
www.sbctc.edu<;http://www.sbctc.edu/>;
From: Moore,Michael (Accessibility) (HHSC)
Date: Fri, Dec 02 2016 12:27PM
Subject: Re: what to do when <section> flags as accessibility error
← Previous message | Next message →
I would mark it as noise and move on...
Mike Moore
Accessibility Coordinator
Texas Health and Human Services Commission
Civil Rights Office
(512) 438-3431 (Office)
From: Angela French
Date: Fri, Dec 02 2016 12:28PM
Subject: Re: what to do when <section> flags as accessibility error
← Previous message | Next message →
Is there any impact to screen reader users by not being labeled? It is flagged as a level A error.
Angela French
From: Beranek, Nicholas
Date: Fri, Dec 02 2016 12:34PM
Subject: Re: what to do when <section> flags as accessibility error
← Previous message | Next message →
I agree with Mike. If you don't have multiple regions or landmarks of the same name on the page, then there is little value in adding an aria-label/labelledby to provide an accessible name. I would just add a heading to the region (if necessary) and move on.
Is it calling out SC 1.3.1 Info and Relationships and/or SC 2.4.1 Bypass Blocks? I assume it's referencing the following sufficient technique for each: https://www.w3.org/TR/2016/NOTE-WCAG20-TECHS-20161007/ARIA11
One concern: The <section> maps to the region role, but regions are not considered landmarks per the WAI-ARIA spec. I would check other issues to ensure it's not calling out false positives or ones that are just plain wrong.
Nick
From: Jonathan Avila
Date: Fri, Dec 02 2016 12:35PM
Subject: Re: what to do when <section> flags as accessibility error
← Previous message | Next message →
> Is there any impact to screen reader users by not being labeled? It is flagged as a level A error.
The ARIA 1.1 spec indicates that all regions must have an accessible name. Section directly maps to the region role.
Jonathan
Jonathan Avila
Chief Accessibility Officer
SSB BART GroupÂÂ
= EMAIL ADDRESS REMOVED =
703.637.8957 (Office)
Visit us online: Website | Twitter | Facebook | LinkedIn | Blog
Don't miss Trends in Accessibility & Electronic Documents on Wed 12/7!
The information contained in this transmission may be attorney privileged and/or confidential information intended for the use of the individual or entity named above. If the reader of this message is not the intended recipient, you are hereby notified that any use, dissemination, distribution or copying of this communication is strictly prohibited.
From: Beranek, Nicholas
Date: Fri, Dec 02 2016 12:46PM
Subject: Re: what to do when <section> flags as accessibility error
← Previous message | Next message →
A-ha, that's a change from ARIA 1.0. Thanks for bringing this up, Jon!
Reference: https://www.w3.org/TR/wai-aria-1.1/#region
Nick
From: Moore,Michael (Accessibility) (HHSC)
Date: Fri, Dec 02 2016 12:47PM
Subject: Re: what to do when <section> flags as accessibility error
← Previous message | Next message →
> Is there any impact to screen reader users by not being labeled? It is flagged as a level A error.
The ARIA 1.1 spec indicates that all regions must have an accessible name. Section directly maps to the region role.
Jonathan
But in all practicality it's not going to make a bit of difference to your users as long as have an h1 at the start of your content. You could possibly give that element a role="main" to make it clearer that this is where the main content is and preserve any impact to your css or js that may depend upon the existence of that section tag.
I would save any additional work for a major redesign when you would want to put in some really meaningful semantic html 5 region navigation across the site.
I think that as accessibility experts we often get a little too caught up in our role as standards auditors. Concentrating on the issues that pose real world problems for users is much more important. If yours is a very large site "fixing" what in my opinion is an inconsequential error could cost hundreds of man hours and really make it difficult for you to push for the more important changes on the site.
Mike Moore
Accessibility Coordinator
Texas Health and Human Services Commission
Civil Rights Office
(512) 438-3431 (Office)
From: Steve Faulkner
Date: Fri, Dec 02 2016 2:18PM
Subject: Re: what to do when <section> flags as accessibility error
← Previous message | Next message →
Hi Angela,
The use of the section element in the context used is absolutely fine,
though superfluous. In screen readers that convey the region role, you
should find that they will only convey the role if the element has an
explicitly associated accessible name. This is to avoid unnecessary
verbosity. WCAG does not say that a <section> element must have an
accessible name and ARIA does not dictate HTML semantics.
--
Regards
SteveF
Current Standards Work @W3C
<http://www.paciellogroup.com/blog/2015/03/current-standards-work-at-w3c/>;
On 2 December 2016 at 19:24, Angela French < = EMAIL ADDRESS REMOVED = > wrote:
> Hello,
> We are piloting the use of Siteimprove. One of its features is site-wide
> accessibility scanning and reporting. It is indeed helping us find things
> we had overlooked.
>
> On our site (example page<http://www.sbctc.edu/starting-your-career/right-
> career-for-you.aspx>) it is flagging the use of the html5 <section>
> tag. We have used this tag to delineate everything in-between (excluding)
> the top global navigation elements and the footer.
>
> The error reads:
>
> "The page contains an HTML5 <section> or a WAI-ARIA landmark of the type
> 'region'. These types of landmarks are very general and should be named to
> help users identify the purpose of the landmark"
>
> It says the fix is to : "Use either the WAI-ARIA attribute 'aria-label' or
> 'aria-labelledby' to name the landmark in a way that clearly explains the
> purpose of the landmark to all users."
>
> Looking back, the use of the <section> tag seems superfluous as there is
> only one. But doesn't the use of an h1 heading as the first thing within
> the section content function similarly to providing some sort of ARIA
> attribute such as 'aria-label' or 'aria-labelledby'?
>
> I am looking for a solution that would be easy to implement site-wide.
> Removing the <section> element altogether would be a major pain.
>
> Thank you, as always, for your opinions.
>
>
>
> Angela French
> Internet/Intranet Specialist
> Washington State Board for Community and Technical Colleges
> 360-704-4316
> = EMAIL ADDRESS REMOVED = <mailto: = EMAIL ADDRESS REMOVED = >
> www.sbctc.edu<;http://www.sbctc.edu/>;
>
> > > > >
From: Tomlins Diane
Date: Fri, Dec 02 2016 2:58PM
Subject: Re: what to do when <section> flags as accessibility error
← Previous message | Next message →
I've had the exact experience/issue using the SiteImprove Accessbility feature, it marks <section> use as a failure. Granted, our developers may have gotten a little <section> happy instead of using <div>s, but using NVDA with our sites, I have not found any issues with them either. We use a CMS and responsive layout, so that also complicates things that the automated tool just cannot discern.
I will say that having gone through SiteImprove's Accessibility tool, it goes through every SC and flags all kinds of stuff as errors/failures so on a large site, what appears to be massive amounts of errors, really is not. It certainly does not, and probably cannot, take into account that there can be more than one method to meet a SC and still have a functionally accessible site.
Diane R Tomlins
HCA IT&S | Digital Media
From: JP Jamous
Date: Sat, Dec 03 2016 12:17PM
Subject: Re: what to do when <section> flags as accessibility error
← Previous message | Next message →
Angela,
You can ignore such a flag even if it flags it as an error. Remember that an automated tool is only helpful in scanning large segments of markup quickly. However, a manual evaluation is always necessary. Otherwise, we can all go home and let those systems handle the markup when developers push them out to QA or Prod.
We do have many regions on our site and yes we use aria-label to give a description of those regions. That assists screen reader users in identifying the purpose of that region as they are scanning the page with quick navigation keys or pulling up a list of regions to choose one.
You may ignore this one for sure if the H1 is providing the description. Just remember that screen readers will not give that section a name if the user is navigating with quick navigation keys or through pulling up the list of regions on the page. That makes your UX bad. Personally, I'd like those regions with a description because I navigate pages fast.
I visited your page below and as I hit the letter R with JAWS it mentioned 2 regions on the page. I had to down-arrow to find out what links those regions contained. I couldn't tell your site navigation bar from that section you are talking about until I read the links. That way, you made it easy for sighted users to visually identify your site navigation region, but harder for me as a user.
This will be up to your department and how accessible you want your pages to be. It can be a pain, but it can also chase some customers away such as JP. Unless there is something on your site that I want badly, I would navigate away from this site. If you did not take the time to make your layout structured properly for screen reader users, busy people will tend to ignore your site.
That goes for sighted folks too. I was one told by a customer that if he cannot identify what he should click on the home page in 10 seconds, that's a waste of his time and would not want to be on that company's site at all. That was a Chief Operating Officer. I also heard it from senior customers, where they get frustrated and move away if the site is too busy. If the site is too busy with regions without a description, as a blind user and someone who has a very busy schedule, I am navigating from your site as well.
Just keep those UX tips in mind.
From: Jonathan Avila
Date: Sun, Dec 04 2016 2:58PM
Subject: Re: what to do when <section> flags as accessibility error
← Previous message | No next message
> I think that as accessibility experts we often get a little too caught up in our role as standards auditors. Concentrating on the issues that pose real world problems for users is much more important. If yours is a very large site "fixing" what in my opinion is an inconsequential error could cost hundreds of man hours and really make it difficult for you to push for the more important changes on the site.
I totally agree that we must prioritize issues. As for causing hundreds of hours -- I'm not sure -- I'd imagine that a piece of JavaScript could be written that would use aria-labelledby to associate the heading with its containing section. Generally I am of the mindset that only landmarks that could be confusing without an accessible name would be a violation. For example
* A page where there are two navigation regions
* A page where one section ends and other begins but there is no heading and adding an accessible name would cause the region to show up to screen readers thus communicating a visual section of the page.
That is the fact that adding an accessible name causes the region to appear to screen readers may be necessary in specific situations where this information is communicated visually such as change in background color. Dialogs can also be created with regions and I'd argue when you have a dialog it should always have an accessible name.
Jonathan
Jonathan Avila
Chief Accessibility Officer
SSB BART GroupÂÂ
= EMAIL ADDRESS REMOVED =
703.637.8957 (Office)
Visit us online: Website | Twitter | Facebook | LinkedIn | Blog
Don't miss Trends in Accessibility & Electronic Documents on Wed 12/7!
The information contained in this transmission may be attorney privileged and/or confidential information intended for the use of the individual or entity named above. If the reader of this message is not the intended recipient, you are hereby notified that any use, dissemination, distribution or copying of this communication is strictly prohibited.