WebAIM - Web Accessibility In Mind

E-mail List Archives

Re: Heading order/nesting - was RE: H1 header in iframe


From: Tim Harshbarger
Date: Aug 26, 2010 10:33AM

Frankly, headings make great semantic sense when we are talking about
things like documents or books, they make little sense when we are
discussing user interfaces.

Is the title element like a book title and h1 like a chapter heading?
In that case, there should be as many h1 elements as there are chapters.
If the h1 is like a book title, then there is only likely to be one book
on the "page."

But the book and document metaphor don't really work for most web pages.

Most of the time, I think we use heading elements to mark sections of a
page. In that context, I think the purpose of the heading element is
far less certain. Does h1 mark the main focus of the page? Possibly
what the page developer thinks is the main focus, but not necessarily
where the user will focus. Should the h1 element mark the beginning of
a major section? Or do h2s mark up major sections like the navigation.

I think I could intellectually justify about any approach. I think that
is part of the reason why this tends to be an area that draws some

I think ARIA landmarks provide a much more semantically unambiguous
method for allowing the user to identify sections of the user interface.
Better yet, use both landmarks and heading elements together--that will
provide users with a bit of the familiar as well as expose them to
something that might be new to them that will be more advantageous.

In that situation, I would probably integrate my heading structure into
the landmark structure. That might even mean I would end up with more
than one h1 or possibly even no h1 elements. I suppose as long as the
users find the approach effective, I'll manage to survive the guilt of
misusing document-based markup correctly. I prefer to write valid and
semantically correct mark-up, but I am quite willing to abandon the
practice if it looks like it will benefit the users.