WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: guidance on headings hierarchy

for

From: Isabel Holdsworth
Date: May 22, 2019 4:38AM

Yes, <h2> headings would be ideal in a sidebar. But if it's
encapsulated in its own region, it's not the end of the world if the
headings are at level 3.

Cheers, Isabel

On 21/05/2019, Guy Hickling < <EMAIL REMOVED> > wrote:
> Catherine,
>
> Besides the logo, you were asking about the rest of the heading structure
> as well, which raises the issue of the headings in the column sidebar.
>
> To take the simplest case, suppose your sidebar was on the right side of
> the page (and we will assume the markup for it therefore follows the main
> content markup in the HTML source, as would usually be the case barring
> floats and suchlike). To use h3 elements would be telling screen reader
> users that they were logical subheadings under the last h2 heading, which
> is not normally the case for sidebar headings. Often a sidebar is repeated,
> unchanged, on most pages of a website. In which case any headings it has
> are clearly not logical subheadings of whatever just happens by chance to
> be the last h2 on any particular page!
>
> So, in our hypothetical righthand sidebar we could not use <h3> (or
> anything lower). Equally we could not use h1 elements since there should
> only be one <h1> on a page. The only choice then is to use h2, and use CSS
> to achieve the font-size wanted for them.
>
> Now put the sidebar back where you have it on the left side of the page.
> That should not change the heading elements, so still use h2. It seems
> counter-intuitive to use h2 headings before the h1, but that is the same
> problem as with sites that have a carousel or hero image at the top, with
> the main page h1 heading below that. The carousel headings should all be h2
> even though they come before the h1 heading. I guess screen reader users
> are well used to that structure (though one screen reader, NVDA I think,
> gets that wrong when displaying a list of the headings). So I would argue
> the headings in your sidebar should both be changed from h3 to h2.
>
> Regards,
> Guy Hickling
> > > > >