View source for H1-H6 headings

<seo title="H1-H6 headings" metadescription="Why should you use H1-H6 headings and what has to be considered when choosing headings?" />

== Why you should use headings on your website ==

[[File:H1-H6-headings.png|thumb|450px|right|alt=H1-H6 headings|'''Figure:''' H1-H6 headings - Author: Seobility - License: [[Creative Commons License BY-SA 4.0|CC BY-SA 4.0]]|link=https://www.seobility.net/en/wiki/images/7/7d/H1-H6-headings.png]]

Headings are an important element of any website, as they structure content and text in a meaningful and hierarchical way. Thereby they significantly improve the readability of content for visitors of a site. When users visit a web page, they often scan the text on this page using headings to get an idea of the content and relevance of the page. 

This works similarly with search engines. The headings of a page are an important means for Google to get an overview of the page content and the weighting of individual subtopics. Thus headings substantially contribute to search engines' better understanding of complex documents. Furthermore, Google attaches a higher weighting to keywords in the headings of a web document. Therefore, the use of important keywords in headings is an important ranking factor for SEO you should definitely deal with when designing and optimizing your website. 

In the following sections, we will explain to you how to define headings in HTML and what you should consider when choosing headings for SEO and users.

== How to define headings in HTML ==

In the HTML code of a website, headings are defined by special HTML tags, with six hierarchies of headings existing, namely H1-H6. The H stands for "heading" and the number expresses the importance of a heading, whereby the relevance decreases from H1 to H6. These HTML heading tags look like this:

<pre><h1> H1 heading </h1>

<h2> H2 heading </h2>

<h3> H3 heading </h3>

<h4> H4 heading </h4>

<h5> H5 heading </h5>

<h6> H6 heading </h6></pre>

== Example ==

To make the whole thing clearer, we have a small example here:

Imagine a web page that contains text about different types of shoes. The H1 heading of this page, in this case, would be "shoes". Then, a division by seasons can be made, resulting in the two H2 heading tags "Shoes for summer" and "Shoes for winter". Then these two areas can be further divided so that you will find H3 heading tags like "Sandals", "Flip-Flops" or "Ballerinas" in the section about shoes for summer.

== What to consider when choosing headings for SEO and users ==

Below you will find some points you should consider when choosing headings for SEO and for optimizing user experience.

=== H1 heading ===

The H1 heading is the most important heading on a web page. Therefore, it should <strong>summarize the entire content of a page</strong> and contain the most important SEO keywords right at the beginning. In addition, it has to arouse users’ interest in the content of a website.

Furthermore, each web page should contain <strong>only one H1 heading</strong>, since Google uses it to identify the topic of a page. Therefore, there should be as little room for interpretation as possible here. It can also happen that Google uses the H1 heading as a description of a page in search results. Therefore, you should only use multiple H1 heading tags if this is absolutely necessary due to very extensive content. But even then, you should not exaggerate. In most cases, one H1 heading should be sufficient.

Furthermore, your H1 heading should <strong>neither be too short nor too long</strong>. You can use a maximum length of 80 characters as a guideline for your SEO. Otherwise, there is a danger that Google will interpret your heading as keyword stuffing which would be bad for your SEO.

<strong>Frequently made mistakes</strong> in the design of H1 heading tags also include overly general wording (e.g. Welcome) or using the same heading for multiple pages (e.g. company name).

=== General aspects when choosing headings for SEO and for users ===

Basically, headings should <strong>always match the content of a page</strong> and, if possible, <strong>contain the most important keywords for your SEO</strong>. However, these keywords should always reflect the actual content of a paragraph. Otherwise, you will get headings constructed for SEO that do not provide any value to users. Google recognizes this kind of keyword stuffing for SEO and punishes it. In addition, your heading tags will inevitably contain SEO keywords if your web page is logically structured and contains [[Content is King|high-quality content]].

Furthermore, when selecting HTML heading tags, ensure that they <strong>structure your text logically</strong> and summarize the central theme of your page. In addition, heading tags should have high information content so that users know what a page is about without having to read every paragraph completely. Basically, you can imagine your own website as a Word document. Just like this document, you have to divide your page into paragraphs by meaningful HTML headings and thus structure it logically and hierarchically.

Another thing you should consider for SEO is to <strong>adhere to the correct, hierarchically descending order of HTML heading tags</strong>, i.e. first comes H1, then H2, then H3, etc. No hierarchy level may be omitted (e.g. H4 may not follow H2, omitting H3). Also, you should always choose the number of heading tags in appropriate relation to the total amount of text. While too many headings are no longer of value to users, too few headings can make a text confusing and difficult to grasp. 

In addition, <strong>no heading (except for H1) should occur only once on an HTML page</strong>, because otherwise it could also be omitted. Here, the comparison with a Word document is helpful again, where for example point 3.1 must never be without point 3.2.

Another important aspect, which is often ignored, is the fact that <strong>heading tags should only be used for semantic marking of text</strong> in HTML and not for optical adjustment of the font size, etc. The layout and size of headings can be adapted via CSS later on. Heading tags should therefore not be used for navigation elements such as menus or links or for surrounding layout (e.g. contact form, blogroll etc.), but should always refer to the specific content of a page.

== Related links ==

* https://www.hobo-web.co.uk/headers/

== Similar articles ==

* [[Meta Title]]
* [[Strong and Bold Tags]]

[[Category:Search Engine Optimization]]
[[Category:Web Development]]