Home/Technical SEO/The Complete SEO Anatomy of HTML H1 to H6 Heading Tags

HTML heading tags — better known as

,

,

,

,

, and

tags — make it easier for people and search engines to understand quickly what a website is about. In addition, they can also indirectly influence how high your pages rank in the SERPs.

And because they're so important to search engine optimization and user experience, it's crucial to know what they are, why they're relevant, and how to best use them.

So, if this topic sounds like bohemian villages to you, you can find answers to the most common questions about HTML heading tags in this post.

Heading-Tags oder Header-Tags?

Let's start with the terminology to avoid confusion about what the h tags should be called.

1. Heading-Tagis the most common and most appropriate term for h tags, that tooGoogle uses in its policies.
2. Header-Tagsometimes becomes synonymous withHeading-Tagused, and alsoBing uses itin its guidelines. However, this term can cause confusion because its singular form has a different meaning: the
   tag.

With theHeader-Tagis the

Was sind Heading-Tags?

Heading tags define the main heading of a page (

) and the subheadings (

to

) of the different content areas.

From the perspective of both humans and search engines, these tags serve as summary text that conveys the essence of the content to readers and crawlers by succinctly stating the main point.

TheWorld Wide Web Consortiumdefines six levels of section headings in HTML, where

is the most important and

is the least important:

At SE Ranking we publish our content with WordPress. But whether you're creating content in Google Docs, WordPress, or another service, headline options are always available:

If we nowone of our previously published postslook closer, you'll see that we've highlighted the first two headings here:

Of course, you might think that I simply increased the font size, emphasized the text, or changed its color. That may be the case, but it's a bit more complicated than that.

Namely, if we look at the source code of the page, we see that these h tags are marked with

and

tags, respectively:

Here you can also see the basic rule behind working with HTML tags: Heading tags come in pairs, so a trailing tag with an extra slash before “h” is required.

This is a headline

This is what it looks like! Now that we know what HTML heading tags are, let's focus on the 'why'.

What is an H1 tag?

It's the main headline that summarizes the gist of the content in one sentence. Search engines comb through pages and use h1 as a strong indicator of a page's topic. At the same time, the tag is also part of the central text content.

H1 is a general element of a website layout. Your site's users expect to see it at the top of pages they visit. It helps users quickly decide if a page is relevant. Depending on what they see, they'll either continue reading and possibly convert, or they'll leave the page. So your task isHigh converting headlinesby following copywriting best practices and understanding how headlines work.

At this point I want you into the concept ofuser intentintroduce.

User intent or search intent is an important concept in SEO. You should build each page with its H1 based on such intentions. In short, user intent is why searchers come to your site and what information they are looking for there. For your H1, this means two things: the HTML tag needs to match user intent and be relevant to the main content of your page.

User intent can generally be divided into commercial and informational intent. For example, a page about your company's services has a commercial intent, and an H1 tag like "online marketing services" fits that.

Formulations such as “What is” and “How” in your H1, on the other hand, indicate informative content. In the first case, the content should provide a definition and additional information about the concept. In the second case, users expect a guide with a series of steps or tips on how to solve a specific problem.

H1 vs. Title-Tag

The H1 tag is an HTML element for the first level heading within website text. Visible to both website users and search bots, it is needed not only to provide information about the content of the page, but also to give it structure and improve the layout.

TheTitle-Tagis also an HTML element that is not visible on the page itself (but is visible if you examine the HTML code or hover over the page tab). It appears in the SERPs to help users find the right result for their search query. This part of the HTML code is mainly required for search engines.

In summary, the title tag is designed to entice users to click to the page from the SERPs, while the

tag serves as the main headline for the page when readers land on it. Both tags are therefore needed so that users and search bots understand what a website is about and how relevant it is to a search query.

The rule of thumb for creating these tags is: Use focus keywords in different variations that properly describe your article's main topic or page content.

Let's see an example:

H1: Google's Featured Snippets: The Biggest Piece of the SERP Pie?

Title: Featured Snippets: Variants, Benefits, and Ways to Optimize Them

To make this task easier, you can use ourKeyword-Recherche-Tooluse. Go to the moduleKeyword-Research, enter a core keyword (the most general and shortest phrase that correctly describes your site) and choose the country that interests you.

Look under the “Similar” and “Related” tabs here to find the two most relevant search terms with the highest search volume (among the high search volume search terms, choose those with lower difficulty levels). However, do not choose one-word search terms, as these usually have a vague search intent.

The two keywords in the screenshot below seem like good choices for our Featured Snippets blog article.

In this module, you can also look at the top 10 organic results for these searches to get an idea about their h1 HTML tags.

Tip: Take a look at the titles first.

Why you should use headings

Heading tags offer two major benefits to websites: clarity and hierarchy. They fulfill two main tasks: They ensure a positive user experience when visiting a website and help the search bots to better understand your content.

The reasons you should use headings fall into two main categories. Let's take a closer look at each of them.

Heading tags improve the user experience

Heading tags improve the readability of your content and make it easier for users to digest.43% of people saythat they scan content to see if it contains the information they are looking for. It is therefore important to give them directions. Appropriate headings allow people to take a quick look at the content to see if it matches what they're looking for.

Alternatively, headings can help readers stay organized in case they get interrupted. This can result in people staying on your page longer.

At this point, proper, honest, and well-crafted heading tags can clearly convey the structure of the content to readers, and hopefully encourage them to read on or even take action.

So ask yourself this: If you publish a post that looks like a solid wall of text, would anyone read your content?

Of course not. They would bounce off your side like a rubber ball.

Finally, the structure of the HTML headings is crucial for visually impaired people to be able to read digital content. Because the H tags are spelled out in HTML, screen readers can interpret the structure of any web page and read it aloud to disabled users. In addition, screen readers offer shortcuts that allow users to easily switch between headings, making navigation easier.

Heading tags help search engines understand your page

Well-formulated headings make it easier for search engines to understand the main topic and structure of a page. Bing has confirmed this. While Google isn't as transparent, they officially state that headings are important for users to navigate the site. During a Google Webmaster Hangout sessionconfirmed John Muellerthat Google uses H-Tags to better understand the structure of the text on a page and that this is one of the ranking factors used by Google.

H tags help crawlers understand what category the page fits into and what search queries it might be able to answer. In this way, it helps Google determine the relevance and semantic structure of a webpage. All in all, headlines are part of page content and as we know, content is the cornerstone of SEO.

That is, a clear and correct page structure can help Google recognize when a page should be displayed in response to a search query. This also makes the page eligible for Featured Snippets.

Featured snippets, or zero-position results, are quick answers that Google shows to user searches. Since you need to rank on page one to be a candidate for a Google snippet, HTML headings can be very helpful here. The display of Featured Snippets depends on Google's ability to determine which page best answers a question and what exactly a given piece of text is about. Structuring your content helps Google in this task.

For example, “best video editor” is a question best answered in a list-style blog post. Such pages are usually structured with an

tag followed by a list of articles enclosed in an

tag. You can also add an

tag after the

tag and then add a list of items with the

tag.

And you can see on the page itself that the heading “Best Free Video Editors for Desktop” is actually in

and the list of programs is embedded in

.

So, not only does heading tags affect search engine optimization, but using HTML H tags also helps to create quality content with good readability. And remember: the better the text is from the user's point of view, the better it is for search engine optimization.

And isn't that the real goal?

Best practices for using heading tags

Now that we know the "what" and "why" of heading tags, let's look at the "how."

So far we've found that search engines make it easier for people to search and find the right content online. That means you can't afford not to optimize your HTML H tags if you want a shot at high SEO rankings.

Here are some SEO best practices for creating effective HTML headings in your content.

Focus on the

tag

First, I want to stress that while you can still rank organically without H-Tags, that would be a huge missed opportunity resulting in an incomplete SEO profile.

Since the

tag serves to clearly describe the content of a page, it should:

• Focus on the same user intent as the main content
• written concisely, naturally and organically
• Be placed at the top of the page
• be different from the meta title tag and be unique across the site
• Include a focus keyword
• don't use inline styles
• only be used once per page

As for the length of the HTML H1 tag, Google doesn't give any recommendations, just saying that you can “avoid very long headlines" should. Here I would suggest keeping the length under 60-70 characters as that is the limit for meta title tags which have a similar purpose as the H1 HTML tag. The fact that Google ran an experiment replacing title tags with H1 tags supports this suggestion.

Now you might be wondering: can I have two or more H1 tags?

Although the use of more than one

tag is officialposes no problem, there are two ways Google can handle this scenario. The search giant will either:

• give more weight to the first

  tag (Bing has confirmedthat it does);

or:

• give equal weight to each

  tag on a page, reducing the overall value of the tags.

Although HTML5 allows more than one

heading tag, Internet browsers have not adopted this recommendation andthe support was therefore discontinued, I recommend using only a single

tag for SEO purposes.

In addition, it often happens that content creators simply repeat the title tag where the

tag should actually be - this is a great opportunity. So make sure that you use both tags and that they are different from each other.

Proper use of the

through

tags

The use of the

to

heading tags depends solely on the complexity of the content.

Your h2-h6 headings need to serve as an outline for a website. Similar to an outline for a paper, you should put your main points in the h2 tags, sub-points of content in the h3 tags, and so on. If a page has a table of contents, it should consist of the page's headings (starting with H2).

It is common to use

and

tags, while

is rarely used, let alone

and

tags.

Anyway, here are the best practices for using

through

heading tags correctly:

• Use as many

  tags as you need to denote different areas of content on a page. It is common to use an

  tag every 200-500 words to allow the text to "breathe".

I want to emphasize that the

through

tags are great for structuring long content like case studies or “how-tos”. To make a website's topic extra clear to both humans and search engines, you should use search terms in your headlines to increase your chances of coming up in searches. However, including keywords in it is not an absolute must - here's why:

Since Google theHummingbird search algorithm introduced, crawlers are able to capture the full semantic meaning of a text as well as user intent.

Therefore, the value of a page for Internet surfers is no longer measured solely by the keywords used (Keyword-Stuffingnever been a good idea). Google also considers synonyms, contextual definitions and the use of language to understand the content.

Overall, a page's placement in the SERPs is now heavily dependent on a combination of relevance, quality, structure, and user experience. HTML headings help both groups – both users and search engines.

Verify your headlines

Let's say you've inspected and optimized all the h-tags on your page (doing this manually usually takes a lot of time). Now how can you check that all the work was not in vain?

Inspect an HTML element

In Google Chrome and Safari browsers, right-click an item and choose Inspect or Inspect Item, respectively.

Google Chrome

Safari

A window will open showing you both HTML and CSS information for the selected element. Just see if it has an tag around it somewhere.

Google Chrome

Safari

Analysis of the source code

If you're using Google Chrome and Safari browsers, right-click an HTML page and choose View Page Source.

Google Chrome

Safari

In the window or panel that opens, enter the H tag you are looking for with CTRL+F or ⌘ Cmd+F. If he's not there, you know what to do - back to the beginning.

Validation of headings in WordPress

Because most websites nowadaysUse WordPress, it is likely that you too use it for your publications.

To make sure your H tags are placed as intended, all you have to do is click the three dots menu in the top right corner and switch from the visual editor to the code editor to view the HTML code of the page ( see below):

Conduct a thorough SEO audit

Checking your website's headers retrospectively seems like an impossible, never-ending task - especially if your website has been around for a while and contains dozens or even hundreds of pages. Luckily, there are a number of tools that can do this job automatically.

At SE Ranking we have developed two specialized tools that scan and analyze your entire website or a specific website:Website-AuditandOnPage Tool.

Let's take a look at what the two tools can do to help you optimize your HTML H tags.

Website-Audit

To quickly check your entire site's headings, you can use our site audit tool to create a list of your pages with the h1 and h2 tags. The tool automatically flags problems with your HTML headings and gives you tips on how to fix them. By the way: You are welcome to use the toolTry it for freeto try all the features.

The length of the

and

tags is limited to 100 characters by default. However, the tool allows for customization, so you can easily change it up if you're getting good results with longer or shorter headlines. That way, if your tags go over or under the 100 character limit, it won't count as an error during validation.

OnPage-SEO-Check

An alternative solution is to check a specific website and create a meaningful analysis of all the headlines. You can do this with the in-house on-page SEO check from SE Ranking. As the name suggests, it can verify a specific website based on the target search query and provide deep insights through comprehensive SERP analysis. Also, this tool not only checks the h1 and h2 tags like site audit, but also all the h tags on your page.

Under the OnPage SEO Audit tab, you will find a separate “Text Content” section that deals with the analysis of text content, including SEO HTML headings.

In addition, you go to the competitive comparison and there you will find the Content tab. Here you can check all the headlines your biggest SERP competitors are using.

Final Thoughts

Proper use of HTML heading tags helps improve your readers' experience by increasing the readability and accessibility of your content. It can even affect your SEO, as these HTML elements provide important information to search engines.

So, be sure to add HTML heading tags to your content. Just remember to follow best practices for maximum effect.

I hope this post serves as a reference for you as you implement heading tags and follow SEO best practices. Let me know if I forgot something or if you've had a different experience with H-Tags!