multiple <h1> on one page

Question

My personal belief is that only one <h1> tag should be allowed on each page.

However is this completely accurate, and if so, what are the actual reasons? Other than saying 'it is best practice', and 'in my opinion', I'd like to have a more convincing reason.

Comments

It's completely inaccurate.  Look at Garbee's answer.

---

Its not so much best practice or just because but mainly for just SEO. You can have your whole page full of h1 tags if you want but it wouldn't look right so people just don't do it.

When designing a page you want to present things in order to the viewer. You want to let them know what is the most important thing on the page to the least important thing. Which is why search engines look for the h1 tag.

Sometimes I feel like I am designing for the subconscious mind more than the actual person. There are tons of books out there that talk about the structure of a page and why people do grids, fonts, and placement of images. This is just one of those things.

Answer 1

It depends on how you structure the page.  The WhatWG entry [1] for headings has a great example to show how you can either use many h1 elements or just one.

Forget SEO/screen readers in relation to H1 since they follow the spec. If your page is to spec then the software will do just fine navigating your page.

UPDATE: I linked to a video from Google's Webmaster Help Youtube account [2] that explains H1 usage.  It is a few years old, but still shows the point that you can use multiple H1's to a page.  Now with outlines built into the HTML spec and it stating you can use sections/articles and have an H1 within each of those I bet the engine has been updated to account for the new standard.  So once again, go to spec and you are fine so you can use multiple H1 tags depending on how your page is structured.

[1] http://developers.whatwg.org/sections.html#the-h1,-h2,-h3,-h4,-h5,-and-h6-elements

[2] http://youtu.be/GIn5qJKU8VM

Answer 2

In an acronym: SEO. Search engines will assume that the H1 tag is the main title.

But I would guess the same would be true for sharing through FB and other such things, re-using content for mobile platforms, screen readers, etc, etc. It's "best practice" because it aids interpretation of a page by readers who are not human.

In my opinion, anyway. :-P

Comments

If it was the case, then the search engines are misusing the tag as we have <title> for that purpose.

Answer 3

You have to factor in a few things when you ponder doing things like adding multiple H1 tags to your document.

Also, bare in mind that just because you can get away with doing something through validation or otherwise, that doesn't always justify the means.

There are elements which you should absolutely, under no circumstances, have multiple instances of (ex: Html, Head, Body, etc.)

However, on the other hand, there are elements such as H1, Header, Footer, etc. - That you can technically add as many of to your document as you wish. But, will this leave your page as legible or understandable as possible for the next developer who comes along to tinker with your code?

Also, as others have mentioned, you should factor in SEO value and the potential Page Rank penalties from Google (and other search engines) for misused key-ranking-elements, as well as screen-readers for the visually disabled.

Usually, I think if it's just a demo or a sample you have in a sandbox - Do whatever you want. But if you're building something that people will see and use outside of yourself - It's almost always best to go the Semantics Route.

Answer 4

It's recommended have an only h1 tag for reasons for SEO, the h1 it's for Google it's the main title of the page.