[html5] Understanding <nav> and <h1>

BlueBoden admin at blueboden.com
Wed Jan 20 09:42:12 PST 2010

Hallo Nathan..

You are wrong in thinking that it hurts your placement in the SERPs, using 
Headings above navigation menus can be considered "correct", it is certainly 
not invalid.
The Title of the navigation is to be considered a header, which also helps 
screen-readers to navigate your site. Basically users using screen-readers 
jump between headings on your page, until they find something of interest, 
its therefor important to think about your headers.

What happens in the case of screen readers, is that when the user navigates 
to a heading, (considered section on the page), it basically reads up loud 
the "heading title", immediately followed by the content. In the case of 
navigation, usually either an Unordered or Ordered list, (If the webdesigner 
was usability-aware), screen readers will read up loud something like "List 
of X Links".

It would make more sense to use H1s to indicate the navigation section, but 
only if the navigation isn't in direct relation with the content. It is also 
valid to have multiple H1s. It may seam "spammy" at first sight, but 
headings for navigation has actually become an industry best-practice, due 
to added usability.

If you are interested in SEO, then this wouldn't be the first thing to look 
into. You should focus more on your content, keyword density, and consider 
making use of breadcrumb links, which in many cases has a direct masurable 
effect on your placement, or you can include an "see also" section in your 
content, a combination will likely be most useful for your users.


From: "Nathan Ziarek" <nziarek at gmail.com>
Sent: Wednesday, January 20, 2010 4:29 PM
To: <help at lists.whatwg.org>
Subject: [html5] Understanding <nav> and <h1>

> I'm in the process of reformatting our navigation and thought I'd
> include the <nav> element as a small start to implementing HTML5.
> Currently the HTML looks like this:
> <h2>Menu Title</h2>
> <ul><li><a>Menu Link</a></li>...</ul>
> etc.
> I've always disliked this set up as I believe that the heading
> elements should be used exclusively for the content of the page, not
> the chrome / utilities. My goal was to remove the <h2>'s altogether
> and simply wrap the entire menu in <nav> as a short-term clean up.
> Looking at the spec, I noticed that it uses <h1> within the nav as the
> menu headings 
> (http://www.whatwg.org/specs/web-apps/current-work/#the-nav-element).
> Since HTML5 allows for breaking up the page into more logical areas,
> this makes sense to me, as the menu heading is the "top-level" item
> within the <nav> element.
> My question, given the maturity of the spec, and with full
> consideration for SEO, is this the smart choice?
> Without the <nav> element, I believe multiple <h2>s in the navigation
> hurt the semantic organization of the document (and hence SEO). With
> the <nav> element, however, I think we actually come out ahead, but
> I'm not sure of the state of crawlers and HTML5 (nor am I sure there
> is definitive proof one way or the other).
> Appreciate your thoughts,
> Nathan
> _______________________________________________
> Help mailing list
> Help at lists.whatwg.org
> http://lists.whatwg.org/listinfo.cgi/help-whatwg.org 

More information about the Help mailing list