Anne van Kesteren

About the hierarchy thing

Apparently my document outline looks like it is brilliant, not that I really trust some sort of automated service that only looks at headings (Hx) and not at DIV or other elements. O wait, I don't have DIV elements. Andy Budd talks about this as well in Heading for Trouble, but it seems that he and other people who talk about heading hierarchy forget that HTML is really limited and only intended for documents (you know Word, do you?), not really for websites. XHTML 2.0 has some interesting new things, like SECTION, but again, it is intended for documents. Only the NL (navigation list) element seems to be something in the right direction. It also looks like something we could use now, not over 20 years. Something like that might be introduced in the Web Applications Markup Language 1.0 or WAML, HTML elements for a tabbed interface, dropdowns et cetera. I'm getting off...

My point is that all kind of people are now going to focus on the W3C outline checkbox (which would be nonsense), while they could better send some suggestions for better document structure elements to It is about headings, but not as the W3C puts it. Headings are part of the structure, but some parts of the document need something different than the "normal" headings. For example, for a menu in the sidebar you don't want to use the same kind of headings as you use for the document content. Those are headings for links or "subscribe to mailing list", not headings for interesting articles about headings. XHTML 2.0 introduces a LABEL element for that purpose. (Note that XHTML 2.0 can use that element since it doesn't have a forms module.) Even tables have their own kind of headings and HTML forms have headings too to add structure.

Eventually we should move away from the use Hx for everything and use nested lists or WHAT HTML extensions, when the headings are not used for the "real" content of the page.


  1. I think a big problem amongst most Standards-aware bloggers and webdevelopers these days is that they don't know what to follow anymore. People everywhere are criticizing the W3 Specs, but nobody is really giving any usable guidelines on subjects such as these.

    Sending a mail to WHAT WG may seem like an obvious thing to do, but then what? That may give us something more flexible and a few years. It still doesn't give us the guidelines we need. The Outline box from the HTML Validator is at least a more comprehensible, a less contradictory and a less tiresome guideline than going through the horror of the entire HTML and XHTML specs and hoping to find an answer from that.

    Posted by Faruk Ates at

  2. Aha! You put your finger right on the trouble I am having swallowing the whole headings as hierarchy paradigm. I've been getting into a lengthy discussion over, and I've been focused on how making a complete hierarchy dilutes the heading levels of your main content, but now I see that the problem is a fundamental conflict between the nature of a document and web page. The main content of most pages could be considered a document, but then there's all that extraneous navigation. To me, the hierarchy of a document is often useful, whereas I usually don't care much about the hierarchy of the web page that it sits in.

    Posted by Gabe at

  3. The main content of most pages could be considered a document, but then there's all that extraneous navigation, which togeter make up an html document ;-]

    Posted by Mike P. at

  4. Well, duh. But my problem is with doing something like:

    h1. content
    h2. article title
    h3. article subhead
    h3. article subhead
    h1. navigation
    h2. site menu
    h2. external links

    I've spent hours trying to explain that I if I have a page with an article on it, I want that article title to be an h1, and the article subheads to be h2, for many reasons, not the least of which is that search engines will give better results. I'm not optimizing my site for searches on 'navigation' or 'content'.

    My point was that in majority of pages, if you limit H tags to the main content part you get the best of both worlds: a formal hierarchy and heading levels that reflect the importance on the page.

    Posted by Gabe at

  5. I like to think menus will be done by the user agent.

    For e.g. this site navigation bar.

    Your menus on this page simply don't "work" on different devices like a mobile. The UA needs to take care of it.... somehow.

    I really don't think "standards" is the right place to find solutions. UAs could be much better at understanding a outline of a site and assisting navigation than they currently do IMO.

    Links and headers are fine by me.

    Posted by Kai Hendry at

  6. I'm not optimizing my site for searches on 'navigation' or 'content'.

    No, but if your structure does allow for all the extra stuff to go after the content (leaving it first), then you don't really need to explicitly say that the beginning is content. It should be the logical implication for anyone visiting, I think.

    I can definitely see the merit of having "My document title!" and "Navigation" as equal-level headings. The navigation, in most Web documents and applications, is part of UI instead of content, so the two should, I think, be separate from each other.

    Posted by J. King at

  7. Without getting into the discussion: thanks Anne, for being back again, and keeping up people, who don't have the time to follow up the recent developments. It's great to have you and your RSS-Feed ;]

    Posted by ben at

  8. This is the same thing that has been bothering me for a while. I can recall a similar discussion coming up in a previous post.

    Remember that the navigation can also be seen as part of the document. Just like any document can have links to other relevant documents inside of the actual document text, navigation can also help to point the user to other documents on the same site, which may also be relevant.

    If you have a link in the navigation titled "About", it might point to information about the author of the document or the site that the document is hosted on. Both of these are probably metadata-related, but nevertheless relevant to the document.

    However, this is probably a very fine line to cross. I'm now particularly referring to mailing lists, etc.

    Posted by Charl van Niekerk at

  9. Anyway, this does not look to me as a problem of "documents" vs. "websites". You hvae the same problem in documents for print texts too:

    The table of contents, the first-level chapters, the index, the apendix and the glossary usually get the same typographical type of heading, but they are treated different, as the chapters are usually numberd and while the other are not.

    The difference between the heading of chapters and the headings of the other parts is, that the other parts are just additional tools to help you navigate on the text. And this is the same with headings for menus, logos or breadcrums: they are just additional navigational tools.

    the only real interesting question is, how to correctly give headings across different documents which belong together. But Anne cover that topic already...

    On the topic of "what are headings?" and "what is text?" I can only warmthly recommend Ivan Illichs "In the vinyard of the text". The best nonfiction book I've ever read.

    @Anne:I hope I didn't get offtopic to far again... :]

    Posted by ben at

  10. I use headers for my side columns and headers in my main column as well. So far the best I could come up with was merely to duplicate the header that's below the page title and description, which is h3, then class it differently.

    But now I just thought of something everyone here needs to be aware of. When the user turns off styles, your entire page is displayed as one long document. Therefore it would make sense to ensure that the headers flow in the correct order. I'll have to think more about this myself as mine don't!

    Posted by Chris Hester at

  11. Over headings gesproken.

    Als ik het muis beweeg over de koppen van het rechtermenu, verschijnt er een handje. Daaruit zou een gebruiker kunnen afleiden dat het om een link gaat.

    Posted by Mario De Zutter at