The HTML h1 to h6 heading tags

What are the HTML heading tags (h1, h2, h3, h4, h5, h6)?

In a web page, the headings introducing the content in the HTML language are identified by the <h1> <h2> <h3> <h4> <h5> and <h6> heading tags (h for "heading"). These heading tags have two main purposes:

  • to inform the visitor with visible and summarized texts about the content of the following paragraphs. So they help readers better understand what they are about to read.
  • to indicate to search engines (Google, Bing...) the most important information included on your page (Google's algorithm would give more importance to keywords and phrases that are contained in the titles (heading tags) than to the rest of the content)

In addition, concerning the writing of the heading tags in a web page, the HTML standard request the following:

  • each HTML document can contain one or more h1 to h6 heading tags,
  • each h1 to h6 heading tag necessarily requires a <hn> opening tag and a </hn> closing tag
  • there are 6 possible levels of heading tags : h1, h2, h3, h4, h5 and h6. h1 is a first-level heading, h2 is a a second level heading, h3, a third level heading etc...

How to use of the HTML heading elements <h1> <h2>...<h6>.

Authorized practices for h1, h2, h3… heading tags :

Here are a few examples of how to use the HTML heading elements h1, h2, h3, h4, h5, h6. In these examples, the heading tags are properly structured and will be well interpreted by the search engines.

1st Example: A perfectly structured HTML heading tags h1 to h6.

<body>
<h1>Optimize the title tag for SEO</h1>
Here is the content of the paragraph...
<h2>Which are the essential html tags for SEO?</h2>
Here is the content of the paragraph...
<h3>What is the title tag tag?</h3>
Here is the content of the paragraph...
<h4>What are the rules for writing the html tags </h4>
Here is the content of the paragraph...
<h5>What errors should be avoided ?</h5>
Here is the content of the paragraph...
<h6>Is the meta keyword tag important ?</h6>
Here is the content of the paragraph...
</body>

The page contains a main title (h1 and less important sub titles like h2, h3, h4, h5 and h6). This use is only possible if you have content that can be prioritized in this way (title, sub title, sub-sub title...).

If the content of the page can't be structured in this way, do not force things, as this may affect the readability of your content.

If the content of your web page does not allow a hierarchical use of h1, h2, h3, h4, h5, h6 titles, then you can choose the following example.

Example 2: A unique H1 heading tag and several equally important subtitles (html h2 heading tags)

<body>
<h1>SEO optimize the meta description tag </h1>
Here is the content of the paragraph...
<h2>Which tags are essential for SEO?</h2>
Here is the content of the paragraph...
<h2>What is the meta description tag?</h2>
Ici le contenu du paragraphe...
<h2>hat are the rules for writing the html tags </h2>
Here is the content of the paragraph...
<h2>What errors should be avoided ?</h2>
Here is the content of the paragraph...
<h2>Is the meta keyword tag important ?</h2>
Here is the content of the paragraph...
</body>

In this case, there is a main title (h1 tag) and 5 equally important subtitles (h2 tags). On the one hand, this pattern indicates to search engines that the 5 sub-titles are equally important and on the other hand it helps maintain a good readability of your content.

The penalized practice:

Here is an example of using h1 to h6 heading tags in a way that might penalize your site SEO. In this case, we go from h1 directly to h3 then h2 and h3 and again. This order is not logical (we can't open a sub-sub chapter before opening the parent subchapter)

<body>
<h1>Optimizing the meta description tag for the SEO</h1>
Here is the content of the paragraph...
<h3> Which are the essential tags for SEO?</h3>
Here is the content of the paragraph...
<h2> What is the meta description tag ?</h2>
Here is the content of the paragraph...
<h3> Which are the rules for writing the meta tag < tag/h3>
</body>

Note that the level of importance of the opening tag must be strictly the same as the closing tag. Here is an example of valid title :

<h1>The Laponya bears</h1>

The next heading tags are not valid and may even deconstruct the whole layout of the HTML document:

<h1>The Laponya bears</h2>

Are the h1 to h6 heading tags important for SEO?

From the SEO point of view, after the title tag, the h1 to h6 heading tags are probably the most important elements from the entire contents of a web page. When properly prepared, h1 to h6 heading elements introduce the content that follows. They provide the most relevant terms to identify the contents of the content that follows.

The relation between the h1 to h6 tags

For the search engines (google, yahoo, bing), the H1 to H6 heading tags are not equally important.

From the SEO point of view, the h1 heading tag is the most important from all the other html heading tags. The more the heading tags level increases (h2, h3, h4, h5 and h6), the less important will be considered its content by the search engines.

The content of a h1 heading tag will therefore be more important than the content of a h2 heading tag, which will be more important than a h3 tag and so on until the h6 tag. Thus, the SEO optimization efforts must be focused especially on the h1 heading tag, then on the h2 tags, etc.

The h1 to h6 tags and the other HTML tags

For the search engines, after the TITLE tag of a web page (title of the browser window), the h1 to h6 tags (titles and sub-titles of the text on the page) are probably the most important HTML tags. They are therefore essential in optimizing a web page for better SEO visibility.

Here is an example of poorly optimized h1 to h6 heading tags:

<h1>The Sport</h1>
...
<h2>Which sports ?</h2>
...
<h3>Where ?</h3>
...

We must carefully choose the keywords by which the users can find a web page.

<h1>The importance of sports</h1>
...
<h2>Which sports to choose ?</h2>
...
<h3>Where can we practice sports ?</h3>
...

What are the Search engine optimization rules for the html h1 to h6 heading tags ?

In short : find the right compromise between SEO and visitors :

For a better SEO, a HTML heading tag should contain strategic keywords that you want to position yourself by in the Search result pages (SERP).

But do not favor the optimization to the loss of the users. What is the value of a good SEO optimized page if users do not understand it and leave it as soon as they arrive on it?

You need to find the best compromise between a heading tag intended for users and a heading tag for the search engines. The exercise is difficult. It takes a fine editor to place the right keywords in the heading tags.

For example, the title, « Discover the rules of optimization for the HTML heading elements h1 to h6 » may be suitable both for users and search engines. Whereas if we want a heading tag suitable for the search engines, the following title would be better : « How to optimize the h1, h2, h3, h4, h5 and h6 tags»

What is the best length for the HTML h1 to h6 heading elements?

There is no rule for the length of the heading tags. They can be both short or (a bit) long. We should nevertheless monitor the density of the keywords in titles as this is an important criterion. This can justify the most recurrent use of short or medium length heading tags.

In the following example, "Everyting you need to remember on the SEO rules and the related elements" the "SEO" keyword density is diluted by the total number of words. We would thus prefer the following heading tag, "SEO, principles and definitions"

The free Yakaferci tool for analyzing the h1...h6 heading tags of your web pages


Analyze your pages heading tags with our free SEO Page Analyzer:
ANALYZE


To start a Yakaferci analysis, simply enter the link to your page in the area above and click the Analyze button. You can then access the different pages of the report, particularly those on PageRank.

View more...

Other Yakaferci articles in the SEO section may also be helpful.