Can we get a consensus on H1 tags?

[ColourOfSpring]

The H1 tag.....something I thought was so simple and elegant, and yet dig a bit deeper, and you get all kinds of uses and opinions about it. HTML5's <article> tags now shoe-horn in the argument that multiple H1s could be used on the very same document page (H1's nested into each <article> on the same page), but STILL my own opinion is to keep things super-simple - each page should have one H1, as each page really can only have one title to it, and H1 is surely a visual representation of "here is the title of this page". So even if it's the home page of a blog with a bunch of articles on the home page, the title of that page would be along the lines of "My Blog", and the articles below would be 2nd tier to that title - so they would be H2. Of course, when you click on an article, the article has its own page and the H1 will be the article title - and so on. Simple. Elegant. Easy for search engine spiders to understand.

However, I've seen a number of (in my mind) mis-uses of H1:-

- H1 tags wrapped around a logo image on each and every page
- H1 tags wrapped around the actual generic title of a site (i.e. same H1 tag on each and every page
- H1s wrapped around navigation headline titles (e.g. wrapped around "Menu")
- multiple H1s on all kinds of things - even including footer headings such as "Copyright"(!)

Interesting discussion here >> [webdesign.tutsplus.com...]

Bing seems to agree with the one H1 for each page here >> [bing.com...]

Matt Cutts says you can use multiple H1s here (perhaps alluding to <article> tags?) but in keeping with his reputation, doesn't give specific examples of where it would be useful >> [youtube.com...]

How do you use H1s?

[edited by: goodroi at 11:13 am (utc) on Jun 4, 2014]
[edit reason] Fixed URL [/edit]

[EditorialGuy]

I use H1s for main headlines at the top of the page.

That's it.

However, it's easy to imagine situations where multiple H1s on a page would be fine: e.g., on a blog page that has several different posts, with each post being a freestanding entity rather than part of the same document.

[ColourOfSpring]

Yeah I could possibly see that situation occurring (in fact, this is the only example that ever crops up for multiple H1s), but still for me - if I had for example 3 articles on a page, all equal importance...and all about blue widgets, I'd have an H1 labeled "articles about blue widgets" (or similar wording, and the HTML title being similar) and the article titles having H2s. These articles would be snippets anyway, leading to their own respective pages, with their own unique titles. From an SEO perspective, I just like to have each page dedicated to one specific thing, even if that specific thing is "a collection of blue widget articles".

[rainborick]

Let me start by saying that EditorialGuy is correct that the <h1> is best used once as the on-page title. It's visual location on the page (or its position within the mark-up) really doesn't matter much, but the "one and done" principle is what you should hold on to.

The main reason this issue is at all fuzzy is that there is a difference between the correct usage of <h1> and how the search engines treat them. In the early days of the web, people were making pages without any real regard for proper mark-up. Sometimes it was because they lacked the skills and sometimes it was due to primitive tools, but they used the various <h> tags simply to control font size. And since those days, the search engines have been very tolerant of multiple <h1> tags even though they could potentially be seen as SPAMmy.

People have done some experiments over the years on how multiple <h1>s affect rankings, but I wouldn't bother researching them since the search engines change so often. The upshot of them all is that you wouldn't get penalized for it, but you don't get the full benefits of a single <h1> either. And with the advent of HTML 5 where multiple <h1>s are actually "legal", you can imagine that they will be adjusting their methods further. So the best practice is to keep it simple and just use one <h1> per page.

[lucy24]

Heh. I've always had the opposite problem. I think of each directory as a subject-- making it an <h1> --and then pages within that directory start out at <h2> because they're subsidiary, like chapters and sections, down to <h3> if it's a sub-subdirectory. I've had to force myself to move up from h4 to h3 and h2 at page-top. ("But it can't be <h1>! It isn't the single most important statement on the entire site!")

[netmeg]

I only have one H1 per page, ever, and it's usually the same (or close to) my page title.

[FranticFish]

Absolute non-answer by Matt Cutts there. If (as according to HTML5) you can have one <h1> per <section> / <article> / <nav> / <aside> then the overall amount per page SHOULD MAKE NO DIFFERENCE.

Either the HTML5 standard, properly followed, is correct - or it's not. If the markup is correct, it's correct - no matter how much of it there is!

For now, I'll stick with one per page. Even when you have a page that has a lot of different content types and subjects covered, if you can't find an <h1> to sum up everything on the page, then I think you have other problems besides.

[FranticFish]

For the record, I have to say I disagree with the HTML5 spec anyway. Let's say you have a bunch of topics on one page, and each one wants an <h1> - then what do you use to describe the page? An <h0>?

If a page is a collection of articles, products, whatever - then the group description for that is your <title> / <h1> - surely?

[EditorialGuy]

Focus on what makes sense structurally, instead of what you might or might not be able to get away with, and you're unlikely to have anything to worry about.

[EditorialGuy]

Something else to think about:

The HTML 5 spec and the Google Search algorithm are two different things. Just because something is acceptable under HTML 5 doesn't mean it's a good idea from a search point of view.

Let's say you've got five different H1 headlines on a page. That may be allowed by the HTML 5 spec, but it isn't going to help Google figure out what the page is about. As far as the algorithm is concerned, those five different H1 headlines are sending mixed messages.

[JD_Toims]

Let's say you've got five different H1 headlines on a page. That may be allowed by the HTML 5 spec, but it isn't going to help Google figure out what the page is about. As far as the algorithm is concerned, those five different H1 headlines are sending mixed messages.

Please provide a source since MC says it's not a problem.

https://www.youtube.com/watch?v=GIn5qJKU8VM [youtube.com]
https://www.youtube.com/watch?v=iR5itZlq8sk [youtube.com]

[EditorialGuy]

Please provide a source since MC says it's not a problem.

Having more than one H1 on a page may not be a "problem" (as being something Google can't figure out or will punish), but it does send mixed messages. As Matt says, you don't want to overdo it.

Also, as I mentioned earlier, there are times when multiple H1s aren't unreasonable, although they probably aren't helpful in SEO terms: e.g., on a blog page with multiple posts.

Again, focus on what makes sense structurally. Does it make sense to have a H1 headlines about dancing gophers, shimmying cockatiels, and bouncing hedgehogs if the page is primarily about dancing gophers? I'd say "It may not hurt you but isn't likely to help you," but if you think it's a great idea, by all means go ahead.

[FranticFish]

MC says it's not a problem

I personally think that's a little too much of a generalisation based on what he actually says.

He says (I quote) "it's not so bad" and "it's OK to have a little bit of <h1> here and maybe there's two <section>s on the page so there's a little bit of <h1> here".

But if the HTML5 markup is correct then there should be NO LIMIT on the number of <h1> tags. If the document has ten <sections> then each one should be able to have an <h1>.

My reading of it is that Google has a certain amount of leeway for badly coded pages (reference that second video of JD_Toims) and that any 'allowance' they have for multiple <h1> tags in HTML5 is part of that - not specific provision for HTML5 markup.

you don't want to overdo it

I'd stay away altogether.

[ColourOfSpring]

But if the HTML5 markup is correct then there should be NO LIMIT on the number of <h1> tags. If the document has ten <sections> then each one should be able to have an <h1>.

Technically, yes. But what's the reward for doing this? Users won't see a difference, unless the purpose is to equally highlight each article and your CSS treats H1 as the biggest and boldest (then again, you can control H2 on this page to be as bold as H1). From an SEO perspective, each result in a SERP shows one title, one description. I strongly believe that search engines like to treat each page as specialising on one "thing" - even if that "thing" is a collection of "things" on the very same page (therefore, surely have a single umbrella title for all of those "things"). A typical search is looking for a specific thing. I'm not sure how a search engine spider will treat a page with 3 or 4 H1s, all titles relating to different things (even if they're related somehow). I'd prefer to 2nd tier (H2) those on such a page, because each article will have its own dedicated page anyway (with its own H1). For me, one H1 per page is best for SEO, and I don't see an advantage or reward to having multiple H1s from a user, browser or search engine perspective - but technically it's not wrong if done correctly.

[stephenward]

The best bet is using h1 tag for the main page

[piatkow]

My rule of thumb is that an h1 is the heading wherever you would throw a new page in a print document and if it needs a new page in print then it should be on a new web page.

[netmeg]

Please provide a source since MC says it's not a problem.

Regardless of what Matt says or doesn't say, do I want to trust Google to figure out what I'm trying to do when I can give even the tiniest signal of my intent?

No, I don't. Google may or may not pick up on it, but I'll have at least done my part to make it clear.

[deeper]

I remember John Müller saying several times that Google doesn't expect the webmasters to have a certain h1-structure, even not the one recommended by W3C. He said, the needs of all webmasters in terms of design, usabiliy and content are very different, reflected by one or three h1s, may be on several places of a page.
Google will try to figure out, what makes the most sense for them.

So the comment of netmag hits the point in my eyes: Having several h1s is basically o.k. and you won't be punished, but if you want to be sure having the optimum... make it as clear and logical as possible.

[JD_Toims]

So the comment of netmag hits the point in my eyes: Having several h1s is basically o.k. and you won't be punished, but if you want to be sure having the optimum... make it as clear and logical as possible.

And sometimes, that's multiple h1's -- A simple example I can think of is:

Title: Do It Yourself Hardware & Tools
H1: Lumber
H1: Screws, Nails, Fasteners
H1: Hand Tools
H1: Power Tools

Those don't send a "mixed message" when combined, what they send to a phrase-based algo is a picture that reflects and reinforces the title of the page. It would actually be wrong to use h1-h4 for those to try to "send the right message" to an algo -- Sometimes it's like everyone is so stuck in 2005 they think the algo is still about keywords and keyword density rather than co-occurrence of phrases -- There's a big difference in the two and how things can/do work together.

[netmeg]

See now I would structure that with an H1 for the Do It Yourself Hardware & Tools, and all the others would be H2s.

But that's why there's chocolate and vanilla. If your other signals are good, it's not going to make a lot of difference to G.

(Attn: Deeper - it's netMEG)

[bumpski]

I've had a theory that inconsistency of use of h tags across pages of a domain may be one of many Panda scraper detections. So another thought is to be consistent site wide with your structure. I have no proof of this though. (I've seen some comments that authorities and mega sites can get away with anything when it comes to h tag structure, but SMALL sites ....?)

I also had always assumed the introduction of the <span> tag was intended to eliminate the many other HTML markup tags, moving all the "styling" into CSS, but frankly I do think ones ranking may drop if this is done.

I notice many sites using <span> wrapped by <h1> and wonder if Google may frown upon this as well.

But for now I've stuck with the single h1 per page, jumping down to h3, unless the article is very long.

Pagination (perhaps with proper markup) might be another situation where multiple h1's per article would seem OK. Frankly I really dislike paginated articles.

The thread below mentions the NY Times and the ?pagewanted=all query string.
[webmasterworld.com...]

The New York Times returns an entire article instead of a partial article when it receives this query string.

Since Feb. 2011, Googlebot has been randomly tacking this string on to queries to my sites. I have verified that these requests come from legitimate Google IP addresses. As mentioned in the thread above I don't think there are inbound links to my sites with this query string. The requests for various pages are just too random.

Thought this might be a useful tidbit of information regarding pagination.
You may want to emulate the Times.

Certainly the Times can get away with anything, but Google clearly tries to find "de-paginated" versions of articles for indexing, so one might unintentionally have multiple H1's on a page from Google's perspective.

[JD_Toims]

But that's why there's chocolate and vanilla. If your other signals are good, it's not going to make a lot of difference to G.

Exactly.

Can we get a consensus on H1 tags?

The answer I think we will always arrive at is a great big NO!

[ColourOfSpring]

Title: Do It Yourself Hardware & Tools
H1: Lumber
H1: Screws, Nails, Fasteners
H1: Hand Tools
H1: Power Tools

....

See now I would structure that with an H1 for the Do It Yourself Hardware & Tools, and all the others would be H2s.

Netmeg, so would I. Also, JD_Toims, I get what you're saying - the H1s in total can give Google an overall picture. I guess there could be a "picture" built up of the page (by Google) by all of its respective titles, be they H1, H2, H-whatever - so both answers are right in a sense.

[deeper]

@JD_Toims:
Hm, I'd do it like netmeg (Attn: netmeg - it's deeper, not Deeper :)) and use 4 H2s, but I suppose it's the same for Google and not worth disputing.

Personally I prefer doing it like W3C says and being consistent. So every page has one H1 and some H2s und H3s. H1 and title tag differ, but are similar.

Just my opinion, not being a profi.

[EditorialGuy]

One thing to remember is that Google is just one search engine--albeit the dominant one. I'd rather follow deeper's example and rely on best practices than on what Google might be willing to tolerate.

[JD_Toims]

Personally I prefer doing it like W3C says and being consistent. So every page has one H1 and some H2s und H3s. H1 and title tag differ, but are similar.

I'd rather follow deeper's example and rely on best practices...

But that's not what the W3C says -- It says, unless there's an explicit <section> an H2 is a subtopic/subsection to an H1. An H3 should be a subtopic/subsection to an H2. If they're "all on the same level" they should all be the same Hn.

Emphasis Added

The first element of heading content in an element of sectioning content represents the heading for that section. Subsequent headings of equal or higher rank start new (implied) sections, headings of lower rank start implied subsections that are part of the previous one. In both cases, the element represents the heading of the implied section.

For example, the following is correct:

<body>
<h4>Apples</h4>
<p>Apples are fruit.</p>
<section>
<h2>Taste</h2>
<p>They taste lovely.</p>
<h6>Sweet</h6>
<p>Red apples are sweeter than green ones.</p>
<h1>Color</h1>
<p>Apples come in various colors.</p>
</section>
</body>

However, the same document would be more clearly expressed as:

<body>
<h1>Apples</h1>
<p>Apples are fruit.</p>
<section>
<h2>Taste</h2>
<p>They taste lovely.</p>
<section>
<h3>Sweet</h3>
<p>Red apples are sweeter than green ones.</p>
</section>
</section>
<section>
<h2>Color</h2>
<p>Apples come in various colors.</p>
</section>
</body>

Both of the documents above are semantically identical and would produce the same outline in compliant user agents.

This third example is also semantically identical, and might be easier to maintain (e.g. if sections are often moved around in editing):

<body>
<h1>Apples</h1>
<p>Apples are fruit.</p>
<section>
<h1>Taste</h1>
<p>They taste lovely.</p>
<section>
<h1>Sweet</h1>
<p>Red apples are sweeter than green ones.</p>
</section>
</section>
<section>
<h1>Color</h1>
<p>Apples come in various colors.</p>
</section>
</body>

Source: http://www.w3.org/html/wg/drafts/html/master/sections.html#headings-and-sections

Headings of different numbers are used to implicitly section content, not designate or derive level of importance.

To be semantically correct, a higher number H [meaning lower rank] should be used when the content is a subsection of the preceding Hn -- Higher number [meaning lower rank] H elements are not technically used to indicate the heading is "not as important" as the preceding heading -- They should technically be used to indicate the content is a subsection to the preceding lower number [higher rank] Hn.

When content has it's own heading and is not a subsection to the preceding Hn it should have the same [or lower number, meaning higher rank] Hn as the preceding Hn.

---

Netmeg's example is absolutely correct semantically. It's simply coded in a different style than my example.

Based on deeper's [notice the small d ;) lol] post I can't tell if they are meaning they use a semantically correct approach or not, because IDK if the H2's are subsections of the H1 and H3's are a subsection to the H2's and sub-subsections of the H1 or not -- It could be they are trying to designate the relative importance of the info following each rather than the <section> the info it "goes with" as a subsection of the preceding Hn.

---

My example was *not* about what Google does or does not tolerate. It's semantically correct according to the W3C docs and happens to be fine to do according to Google -- Go figure.

[JD_Toims]

Just to illustrate why there's no "consensus" for an answer to this question, both the following are semantically correct and the same, not according to Google, but according to "best practices" and the W3C documentation.

Title: Do It Yourself Hardware & Tools
H1: Do It Yourself Hardware & Tools
H2: Lumber
H2: Screws, Nails, Fasteners
H2: Hand Tools
H2: Power Tools

Title: Do It Yourself Hardware & Tools
H1: Do It Yourself Hardware & Tools
<section>
H1: Lumber
</section>
<section>
H1: Screws, Nails, Fasteners
</section>
<section>
H1: Hand Tools
</section>
<section>
H1: Power Tools
</section>

---

There's nothing "editorial" about the answer to this question, because the answer is not opinion based, but rather factual and verifiable via the documentation provided by the W3C.

Semantic correctness [best practice], based on the W3C documentation compliant user-agents will follow, explicitly indicates there are multiple ways to code semantically equivalent pages, so much of how a page should be coded comes down to the coder's preference and maintainability of the page they're coding.

Saying one of the examples in this post is a "best practice" and the other is not a "best practice" is absolutely false based on the docs compliant user-agents follow.