- From: David Best <davebest@cogeco.ca>
- Date: Thu, 23 Oct 2014 10:38:14 -0400
- To: "'Steve Faulkner'" <faulkner.steve@gmail.com>, "'Userite'" <richard@userite.com>
- Cc: "'Oscar Cao'" <oscar.cao@live.com>, "'WAI Interest Group'" <w3c-wai-ig@w3.org>
- Message-ID: <005101cfeece$f9fd1460$edf73d20$@cogeco.ca>
What developers need to consider is that WCAG 1.3.1 Info And Relationships has two components: Page structure and Content Context. That is, the Page structure is defined by the regions (Banner, Navigation, Main, Footer, Etc.), and the Heading hierarchy defines the content context within each region. However, there are lots of other regions (Aside, Section, Article, Complementary, Search, Etc.) that can be defined within these primary regions or outside as a self-contained region. The challenge is to define a consistent page style structure. Too many regions with an inconsistent Heading structure makes the page difficult to navigate and understand content context for screen readers. Keep the primary regions to a minimum (Banner, Main, Footer) for an average size page, and then secondary regions within these (Banner: Navigation, Search; Main: Section, Article, Complementary; Footer: Navigation, Complementary). A larger and more complex page may want to use more primary regions (possibly Navigation as a primary area). However, it is the Heading hierarchy that will determine the screen reader ability to easily understand content context. Some sites use h1 at the start of each primary area, while others use h1 only to start the Main content and h2 to start the other primary areas. The secondary areas will use the next Heading level in sequence. The content within each secondary area will follow the Heading level sequence. If the screen reader user knows the primary region Heading hierarchy structure they can quickly navigate by Heading within each region. That is if the Main content starts with Heading h1 and the Footer starts with Heading h2, then when I navigate by pressing the Heading h1 key I am taken to the start of the Main content, and then navigate using Heading h2 key I can skip through the Main content (bypassing higher level Headings) and eventually land on the Footer Heading h2 element. However, if the Footer region starts with a Heading h1 element, then skipping through the Main content using the Heading h2 key command, I will not get to the Footer as the screen reader will say "no more Heading level 2" when it reaches the last Heading h2 element in the Main content. I can then use the next Landmark navigation key to move the focus to the Footer. Note, the important thing is: 1. Consistent page style structure across the website. 2. Clearly defined regions and subregions within the page structure. 3. If a specific region type (Navigation, Complementary, Article, Etc.) appears multiple times on a page, then it must have a text label to uniquely define it (several different techniques can be used to include text labels). 4. The Heading hierarchy (whatever structure style is used) must be consistent, unique, brief, and sequential. 5. Dynamically content changing page areas must follow the Heading hierarchy style. Note, this may be a challenge depending upon user selected content, but using region Landmarks will help the user understand why a Heading level was skipped (if that is necessary). 6. Content focus order (multiple columns) must follow the Heading hierarchy sequence. Good luck Oscar! David From: Steve Faulkner [mailto:faulkner.steve@gmail.com] Sent: Wednesday, October 22, 2014 9:51 PM To: Userite Cc: Oscar Cao; WAI Interest Group Subject: Re: Skipping of headings one thing authors can do is clearly identify the main content area of a page. HTML5 has an element for it: <main> http://www.w3.org/TR/html5/grouping-content.html#the-main-element -- Regards SteveF HTML 5.1 <http://www.w3.org/html/wg/drafts/html/master/> On 23 October 2014 01:30, Userite <richard@userite.com> wrote: Dear Oscar, Thank you for your reply. To deal with your comments in turn- The content of a web page is *everything* between the <body> tags. W3C describes the content that resides within the main content area as “main content”. This is an important distinction (page content/main content) that you need to be aware of when reading the guidelines. I agree that using H2 heading for additional material might be confusing for blind users, which is why WCAG tells us to use appropriate descriptive text for heading. As I mentioned in my initial reply you could use <h2>Site navigation</h2> for your navigation bar and <h2>Additional links</h2> for your supplementary material. The text of the heading is what a blind person hears, not just “heading level two”. I am sorry I referred to your selection of H5/H6 as “random”. I appreciate that you have thought hard about this approach, but the problem is how will your visitors know that this is the approach you have taken to structure your page? As you know W3C already includes semantic elements such as <main>, <aside>, <section>, <nav>, <summary> and <details> in HTML 5 in order to differentiate different sections of the page. Remember that heading codes are not designed to specifically impart *importance* of content. For some people the most important part of your page might be the additional information or the site navigation bar. Headings are there to give structure and allow users to obtain a quick overview of the page content. Kind Regards Richard From: Oscar Cao <mailto:oscar.cao@live.com> Sent: Tuesday, October 21, 2014 10:48 PM To: Userite <mailto:richard@userite.com> Subject: RE: Skipping of headings Hi Richard I am not isolating the technique and removing the context from the technique. The technique explicitly states "the example code below is not intended to prescribe what level of heading should be used for a particular section of the web page." Looking back at the guidelines. They are constantly referring to the "content" of the page and from my interpretation; that's the content that resides within the main content area. If we were to follow the approach of using a H2 - the blind user would have thought that the content in the third column follows on from the main content. I.e. Just another H2 underneath the main content's H1. But that is not correct as the section/heading does not continue the content which resides in the main content area, they're navigation/asides. And no, it's not random heading levels. I intend to stick to H5/H6 to emphasize the insignificance of the headings compared to the headings within the main content area. It would be good to hear what others have to say and how others have been approaching this issue as I don't see very many single column websites. Regards, Oscar Sent from my Windows Phone _____ From: Userite <mailto:richard@userite.com> Sent: 22/10/2014 8:15 AM To: Oscar Cao <mailto:oscar.cao@live.com> Subject: Re: Skipping of headings Hi Oscar, H42 is an INFORMATIVE technique. If you read it carefully you will see that my suggestion that these extra areas start with headings at level 1 or 2 is correct. What you are suggesting (picking headings at random levels) is a failure (see F43 - http://www.w3.org/TR/WCAG20-TECHS/F43.html ). As I said before, you need to consider the use that headings have. A blind user cannot see that a section is to the left or right of the main content, so suddenly jumping to a level 6 is extremely confusing. The blind user is forced to assume that she has missed out on a lot of content. It is important that you read these informative techniques within the overall context of WCAG. You cannot take an individual technique out of context and use it to justify something that is not in compliance with the actual guidelines (1.3.1) Regards Richard Richard Warren Technical Manager Website Auditing Limited (Userite) http://www.userite.com -------------------------------------------------- From: Oscar Cao <mailto:oscar.cao@live.com> Sent: Tuesday, October 21, 2014 9:35 PM To: Emmanuelle Gutiérrez y Restrepo <mailto:coordina@sidar.org> Cc: 'WAI Interest Group' <mailto:w3c-wai-ig@w3.org> Subject: RE: Skipping of headings Hi Emmanuelle and Richard Have a look at the foreword/notes just before Example 2 in the screen grab of H42 that I sent in my previous email. It states the level of the headings outside is irrelevant to the main content and should be at the level one chooses best fit the purpose. To me, the content within the main content area is the most important & the focus of the page, therefore I give the headings outside the main content area low heading levels. I hope everyone agrees with this approach. Regards, Oscar Sent from my Windows Phone _____ From: Emmanuelle Gutiérrez y Restrepo <mailto:coordina@sidar.org> Sent: 21/10/2014 11:02 PM To: 'Oscar Cao' <mailto:oscar.cao@live.com> ; 'Jonathan Avila' <mailto:jon.avila@ssbbartgroup.com> ; 'Jon Gibbins' <mailto:dotjay@dotjay.co.uk> Cc: 'WAI Interest Group' <mailto:w3c-wai-ig@w3.org> Subject: RE: Skipping of headings Hi Oscar, Yes, you are right because the different blocks of content do not have to maintain an order of priority among them. But they have to keep to the main content. What is odd in the example you provided is that the navigation block is identified with a h5. Regards, Emmanuelle Gutiérrez y Restrepo Patrono y Directora General Fundación Sidar - Acceso Universal Email: coordina@sidar.org Personal: Emmanuelle@sidar.org Web: http://sidar.org De: Oscar Cao [mailto:oscar.cao@live.com] Enviado el: martes, 21 de octubre de 2014 12:23 Para: 'Jonathan Avila'; 'Jon Gibbins' CC: 'WAI Interest Group' Asunto: RE: Skipping of headings Thanks Jonathan. After looking at the second example in the H42 link you mentioned. I’ve gotten my answer – it is perfectly OK to skip headings outside the main content area; attached a screen grab for reference. Regards, Oscar From: Jonathan Avila [mailto:jon.avila@ssbbartgroup.com] Sent: Tuesday, October 21, 2014 11:09 AM To: Jon Gibbins Cc: WAI Interest Group Subject: RE: Skipping of headings Ø The "Organizing a page using headings" technique applies to Level A's SC 1.3.1, Info and Relationships, and Level AAA's SC 2.4.10, Section Headings: Note 2from normative WCAG document SC 2.4.10 also says: This success criterion covers sections within writing, not <http://www.w3.org/TR/2008/REC-WCAG20-20081211/#user-interface-componentdef> user interface components. User Interface components are covered under Success Criterion 4.1.2 <http://www.w3.org/TR/2008/REC-WCAG20-20081211/#ensure-compat-rsv> . Jonathan From: Jon Gibbins [mailto:dotjay@dotjay.co.uk] Sent: Monday, October 20, 2014 10:37 AM To: Jonathan Avila Cc: WAI Interest Group Subject: Re: Skipping of headings The "Organizing a page using headings" technique applies to Level A's SC 1.3.1, Info and Relationships, and Level AAA's SC 2.4.10, Section Headings: http://www.w3.org/TR/WCAG-TECHS/G141.html It says: "To facilitate navigation and understanding of overall document structure, authors should use headings that are properly nested (e.g., h1 followed by h2, h2 followed by h2 or h3, h3 followed by h3 or h4, etc.)." Whether or not skipped heading levels cause problems is down to a user's preferred means of navigation. Personally, I like to see a clearly structured main content, and consistent use of headings in other page areas. In the majority of cases, I don't believe it is difficult to maintain heading structures. Jon On 20 October 2014 14:16, Jonathan Avila <jon.avila@ssbbartgroup.com> wrote: Ø headings outside the “main content area” should be allowed to skip heading levels If you look at H42 (http://www.w3.org/TR/2013/NOTE-WCAG20-TECHS-20130905/H42) which is a sufficient technique for SC 1.3.1 it does not have a test step to verify the order doesn’t skip levels. My understanding is that not skipping levels is considered advisory for Level A and AA. I know many US government agencies require heading levels match the visual levels – matching is different from not skip any heading levels. I’d say matching the visual levels is what is most important as it conveys the same structure as what is presented visually. Jonathan From: Oscar Cao [mailto:oscar.cao@live.com] Sent: Monday, October 20, 2014 7:57 AM To: 'WAI Interest Group' Subject: Skipping of headings Hello All I’m sure there’s been quite a bit of debate on the skipping of headings issue. I totally agree headings that reside within the “main content area” of the page should not have any skipping of headings whatsoever. However, for SEO and various other reasons, headings outside the “main content area” should be allowed to skip heading levels. What I mean by this is, for example: <header role=”banner”> <h2>My website’s name</h2> </header> <div> <nav role=”navigation”> <h5>Left Hand Navigation</h5> <ul>…</ul> </nav> </div> <section role=”main”> <h1>main heading</h1> <p>…</p> <h2>second level heading</h2> <p>…</p> <h3>third level heading</h3> <p>…</p> Etc… </section> <aside class=”side”> <h6>Some heading</6> </aside> <footer role=”contentinfo”> <h6>Footer Links</h6> </footer> What I would like to know is, what is the official WCAG 2.0 stand on this specific scenario. Is this conforming to the WCAG 2.0 guidelines or non-conforming; if it is the latter, what is the correct solution/markup to use? Thanks, Oscar -- Jon http://dotjay.co.uk/ dotjay@dotjay.co.uk Please consider the environment before printing this email Richard Warren Technical Manager Website Auditing Limited (Userite) http://www.userite.com
Received on Thursday, 23 October 2014 14:39:13 UTC