WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Heading order


From: Sailesh Panchang
Date: Sep 30, 2015 8:38AM

I too was confused. Surely an h3 can logically follow an h4. Now if
the h4 is styled to look more important such that the h3 appears to
be a subheading under the h4 and that makes sense semantically, that
is a problem.
Next, if there is an h3 after an h1 heading at start of main content I
am surely impacted as a screen reader user ... I arrow up to check if
there is some content that the SR is not announcing as a heading.
Sometimes it is an image with text that looks like a heading. This is
a problem and needs an h2 around it. And maybe made into text (1.4.5)
Sometimes it is text styled like a heading but not marked up as one
... surely needs a h-tag and is 1.3.1 issue.
Sometimes it is normal text that could have been a heading (h2)
semantically. Not a problem against any SC.
Sometimes there is just normal text: no problem against any SC.
Sometimes, there is no content between h1 and h3: Again not a problem
against any SC unfortunately as using h2 after h1 and h3 after h2 is
regarded as a best practice.

On 9/30/15, John Hicks < <EMAIL REMOVED> > wrote:
> Hello
> I am not sure I agree with this (actually not sure if I understand the
> example given or its explanation).
> Going from H4 to H3 is in itself fine, so long as the H4 is the last
> "sub-item" of a *preceeding* H3 ... (was that what you meant?)
> jumping from Hx to Hx+2 (or more) would seem to be the problem that is most
> easily defined, yet if we were following what was in the visual we could
> sometimes justify that even. But semantically it is clearly (locally)
> wrong.
> I'd say it is an accessibility problem by virtue of the use that Jaws and
> Voiceover (via the rotor) make of Hx tags. Definitely it is in terms of
> 1.3.1 and 2.4.10 ...
> I am sure another point of view is possible... even likely!
> best,
> John
> 2015-09-29 19:32 GMT+02:00 Jonathan Avila < <EMAIL REMOVED> >:
>> > We have encountered several instances of improper heading order (e.g. an
>> <h4> above an <h3>), but we can't seem to find a firm agreement as to a)
>> whether
>> The deciding factor is whether the missing or incorrect order correctly
>> communicates information and relationships that are communicated visually.
>> So, an h2 used with a navigation bar used before the main h1 of a page
>> would not in my opinion fail WCAG. However, if an h4 was used before an
>> h3
>> but visually communicated that it was a lesser importance or lower in the
>> structure than that would be a failure.
>> Best Regards,
>> Jonathan
>> --
>> Jonathan Avila
>> Chief Accessibility Officer
>> SSB BART Group
>> Phone 703.637.8957
>> Follow us: Facebook | Twitter | LinkedIn | Blog | Newsletter
>> -----Original Message-----
>> From: WebAIM-Forum [mailto: <EMAIL REMOVED> ] On
>> Behalf Of Schafer, Carmen
>> Sent: Tuesday, September 29, 2015 1:13 PM
>> Subject: [WebAIM] Heading order
>> Dear Colleagues:
>> We perform accessibility testing on a variety of websites and
>> applications, and hope to get some feedback on how others handle a common
>> accessibility concern, improper heading order.
>> We have encountered several instances of improper heading order (e.g. an
>> <h4> above an <h3>), but we can't seem to find a firm agreement as to a)
>> whether improper heading order should be cited as an accessibility concern
>> or usability/design concern or b) which, if any, of the WCAG 2.0 Success
>> Criteria covers improper heading order. We have read articles and attended
>> webinars with conflicting information, but we know it can be an issue,
>> particularly for screen reader users who navigate by headings.
>> Would anyone be willing to weigh in and possibly give us a definitive
>> answer so we make sure we have the fullest possible understanding of this
>> issue and pass it on to developers and others.
>> Thank you for your time and assistance.
>> Carmen Schafer
>> User Support Analyst, ACT Center
>> Division of IT, University of Missouri
>> >> >> at http://webaim.org/discussion/archives
>> >> >> >> >> >>
> > > > >