It is common belief that using multiple
h1 tags in one HTML page will spoil its
ranking. This is most likely rather SEO gossip than a law carved in stone
by Google and other search engines. History has proven that all simple
recipes for search engine optimization were either useless from the beginning
or quickly became useless, when they was widely adopted. Do you remember,
when everybody prayed filling the meta tag
keywords and entire days were
wasted and countless brain cells were burnt filling it in the smartest and
most accurate manner? A positively fruitless, futile attempt as we know today.
There is a lot of misinformation about the HTML heading elements circulating the internet. Let's shed some light on the matter.
Headings In the HTML Standard
What does the current HTML standard say about headings?
The h1–h6 elements are headings.
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.
Sections may contain headings of any rank, and authors are strongly encouraged to use headings of the appropriate rank for the section's nesting level.
Does the standard say anything about multiple
h1 elements being bad? No!
h1 element is just a headline element that happens to be the top-level one.
Traditional Semantics Of Headlines
One thing that I learned first in university about writing scientific documents was "you cannot say A without saying B". Look at the following document outline:
- On-Page SEO
- Off-Page SEO
- Social Media
This is considered a blunder in the academic world. Headlines and sections
are used for sectioning, that is dividing, a text, and that necessarily
requires at least two headlines/sections for each nesting level. If there
is a section 3.1
Social Media there must be a section 3.2.
H1 Versus Title
Does that mean that it is wrong to have only one h1 element in a page? No, not quite. Other document formats like DocBook or TeX structure with specific elements (for example part, chapter, section, and so on). And the document front matter, especially the title is usually rendered, when displaying the document.
The situation for HTML is different. The document front matter (that is
head element) is normally not rendered. And since the
title is part of the head, it is usually not prominent in the visual
representation of the document. For graphical browsers, the title used to
be displayed in the window title bar but with the advent of tabbed browsing,
the title is now displayed in the tab and only partly visible because of the
inherent space limitations.
It is therefore common practice to mirror the document title inside the
body with an
h1 element, and because a document can only
have one title, it is often wrong to use multiple
in one document. This is essentially a trade-off between consistency and
the shortcomings of the medium.
Structuring HTML5 Documents With
HTML5 has introduced the
(and others) that does a much
better job structuring documents hierarchical. Take a look at the following
example of a semantically correct HTML5 document that will probably make
many a self-ordained SEO expert copiously vomit:
<!DOCTYPE html> <html> <head> <title>Acme Corp.</title> </head> <body> <h1>Acme Corp.</h1> <section> <h1>Mission</h1> <p>Free the <h1>!</p> </section> <section> <h1>Staff</h1> <section> <h1>Tom</h1> </section> <section> <h1>Dick</h1> </section> <section> <h1>Harry</h1> </section> </section> </body> </html>
OMG! What a mess! Isn't it? But it is
blessed as correct and even recommended by
the W3C, scroll down to the last code example in that section of the HTML standard! The reason
to only use
h1 elements is quite simple: You can freely move
sections around in your document hierarchy without having to change the
rank of your heading elements.
And now look at the above example in your browser. Current versions of Firefox, Google (!) Chrome, and Safari all render the document as expected, neatly structured. Do you really think that Google would penalize more than one h1 per page if the company's own browser accepts it?
h1 Is More Important Than h2?
This misapprehension is probably on of the main reasons behind the one-h1-per-page tale. The rank – i. e. the digit 1-6 in the name of heading elements – denotes the nesting level but not the importance of the element's content. This can be easily seen:
One of the examples is titled "Calculating elapsed time" and the
title is contained in an
h3 element whereas the containing section is called
Examples (contained in an
h2). Guess which keywords have more relevance
for search engines! It is probably not "Examples".
h1 element per page" is
mostly an urban legend. Use
section elements for
structuring documents, and – emancipate yourself from mental slavery! –
use heading elements according to your individual requirements and preferences!
Unfortunately you will never be able read this advice because this page contains only
h1 elements and all search engines have exiled it to the world wide nirvana.
blog comments powered by Disqus