From £99/Month
img
By: Asad Butt
Last Updated: October 16, 2018

Writing HTML Heading Tags Best For Audience, Google And Other Search Engines In 2018 And Beyond

Heading Elements | SEO

HTML Elements are an important part of On-Site SEO. Google algorithms consider HTML Heading Elements along with content to understand the structure, subject matter and the purpose of your content. This article attempts to explain the myths, the basics, and best practices for the use of Heading Tags (H1-H6).

Table Of Contents



What Is A Heading?

<h1> <h2> <h3> <h4> <h5> <h6>

In an HTML document or webpage, as we may say it, a heading is used to introduce the content which follows.

Heading tags have a top-down hierarchy from h1 to h6

HTML defines six levels for headings.

h1 is used to define the most important heading. h6 is used to define the least important headings.


QUOTE: “There are six levels of headings in HTML with H1 as the most important and H6 as the least.” W3C


Whay Are HTML Headings Important?

QUOTE: ‘We do use H tags to understand the structure of the text on a page better,

John Mueller, Google

As the above quote from John Mueller states, HTML heading can affect your page rankings, both directly and indirectly.

Direct: Google uses Headings to understand and make sense of our content. If a good structure is placed, It will help Google to match your content with the search phrases put in Google Search Engine by its visitors. Helping Google is helping yourself, rank in Google.

Non Direct: HTML Heading elements create an experience for your users. Headings introduce your content to your visitors. Headings help visitors locate what they are looking (skimming). Headings help visitors stay on your page (better bounce rate). Well explanatory and honest headings form a good user experience. As Google is shifting towards user experience, this can help your page rank better.

QUOTE: “High-quality websites provide clear and satisfying information for their purpose. YMYL websites demand a high degree of trust and need satisfying website information.”

John Mueller, Google


Headings are important.

  • Use them as necessary.
  • Do complete research and use the right keywords.
  • Do not, Do not, Do not do "keyword stuffing". It's a complete waste of time as of 2018.
  • Keep them relevant to your content.
  • keep them natural where possible.

How Can I View HTML Headings Elements On My Webpage?

By using View HTML Source Code: Using the Google Chrome browser, right-click in an HTML page and select "View Page Source" ( for IE - View Source).

In the window that opens use CTRL + F and type HTML header tag you are looking for "h1" - "h6".

By using Inspect an HTML Element: Using the Google Chrome browser, right click on an element, and choose "Inspect". This will open a side panel and you will be able to view both HTML and the CSS for that element.

By using Tools:

There are many tools in the market but most prominent ones are:

There is very small Title Tag Preview tool which I often use to check how my Title headings will appear in Google Search result: Title Tag Preview Tool

At Quoracreative, we provide an SEO Audit Service where we can analyze and fix your headings (as part of a package) for a fixed price.


What Tools Can We Use To Optimize Heading Elements?

Website Auditor by Link-Assistant

Website Auditor provides In-depth site auditing, On-page analysis & optimization in just one application.

Embedded content: https://www.link-assistant.com/images/news/html-meta-tags-for-seo/screen-02.png


To check on your titles, open your WebSite Auditor's project or create a new one, go to Content Analysis > Page Audit > Content optimization, and analyze the Title section.

Keyword Density Checker by smallseotools

Keyword Density Checker will help you analyze the keyword density of a web page. Enter your text or web page URL, and the tool will analyze the density of the keywords for your text.

This tool is particularly helpful when you want to analyze the appearance of keywords in:

  • Html Headings (H1 - H6)
  • HTML Title
  • General content

keyword density checker quoracreative

Does The Order Of HTML H1-H6 Elements Matter For SEO Purpose?

"Heading hierarchy works the same way on the web as it does in print. Web users are generally in a hurry so they look for headings to see if they want to stop and take the time to read the whole web page. Web users also skim in search of what they specifically are looking for. Having a heading hierarchy will help them find what it is they are looking for".

Heading Hierarchy | webpagemistakes.ca

Embedded content: https://www.youtube.com/watch?v=iR5itZlq8sk

Does the ordering of heading elements matter?


We have six HTML heading elements because they represent six levels of section headings. All heading elements should be used according to the level they were intended for.

Read: The HTML Headings | Mozilla

Following is the pattern I personally use to structure my content and it is recommended by W3C. It does the Job pretty well.

<h1> Types And Correct Use Of Heading Tags for SEO <h1>

  <h2> Types  Heading Tags <h2>
     <p>Here is some text</p>
     <p>Here is some text</p>
     
  <h2>Correct Use of Heading ags</h2>
    <h3>For SEO purpose</h3>
      <p>Here is some text</p>
      <p>Here is some text</p>
      
    <h3>For User Experience</h3>
      <p>Here is some text</p> 
      
      <h4>For User Experience</h3>
         <p>Here is some text</p> 
      
 <h2> Summary <h2>
   <p>Here is some text</p>

"Correct structured data on your pages also makes your page eligible for many special features in Search results, including review stars, fancy decorated results, and more"

Google | Search Engine Optimization (SEO) Starter Guide


As a matter of user experience, adopting good content structure is important and keep in mind the following:

  • Use heading tags for sections and subsection rather than using Bold if possible
  • Use Heading tag H1 tag only once as your content TITLE
  • Feel free to Use H2, H3 tags where necessary.
  • Use__ H2__ tag to highlight subsections for H1 Heading tag
  • Use H3 tag to highlight Subsection of H2 Heading tag
  • Keep things and hierarchy natural.

If you want to learn HTML heading tags read: HTML H1 to H6 Tags

QUOTE: "You can use them all, or none at all. You can use as many as you want. You do not need to use all six HTML elements to structure your pages. Google ESPECIALLY is used to broken HTML on the web."

Shaun Anderson | Hobo-web


How Many Heading Elements Should I Use?


QUOTE: “Yeah I wouldn’t worry about it we handle h1s and h2s very well but don’t make your entire page h1 or h2”

Matt Cutts, Google


You should use as many as necessary. There is no magic number.

If you have a page with thin content (and thin content doesn't necessarily mean a bad thing), you probably will need a few. If you have a page with 2000 words or more, It is better to use more than a few correct HTML headings tags to help your readers find what they are looking for.

You do not need to use all HTML heading tags to structure your content. Heading H1 to H3 can do a good job for you. I rarely use H4.

QUOTE: "You can use as many H1 heading tags as you want on a single webpage":

John Mueller, Google


What Is The Right Amount Of Keywords Can I Use In My Heading Elements?

There is no definite answer to that. There are no official guidelines from Google or any Search Engine.

Headings have an influence on algorithms when they try to make sense of your content. But headings are only one of over 200 factors Google is using. Overstuffing your headings with keywords and then not adding any value in the content is most probably going to get your content marked down.

The simple and right way of doing this is to keep it natural. If your content has a purpose, you will know what it is about. Try to be honest about it.

One thing that you should do though, from SEO perspective is the research for the right "search" terms by using keyword analysis tools to see what are the best terms which not only describe your content best but are being queried on Google.

All human minds are different. All human minds translate their thoughts differently into the language. You need to research the best combination keywords people are searching for, that best relates to your content.

There is a lot of content out there which performs very well without any use of Heading tags. Which suggests, headings are not compulsory.

But there is another dimension to this question.

User Experience

The main target for our content is human beings for the foreseeable future at least. Use of relevant, well explanatory heading tags, in the right order, enhances user experience.

Also, remember that a need for HTML headings vary from content to content

Thin content, will need a very few headings. Detailed content will need to be divided into proper sections and subsections and labeled well for better understanding and user experience.

These days, users decide within seconds if the content is of any use to them by skimming quickly through headings and sub-headings and looking for the right words.

I always use H1, the heading tag for my content. When I divide my content into sections and subsections, I use H2 and H3 accordingly.

Use only one H1 tag for your content but you may use as many H2 and H3 as is necessary. But focus on keeping headings in balance. Use only what is necessary to add to user experience. Never overdo it so you don't get marked down by algorithms.

QUOTE: “…so these heading tags in HTML help us to understand the structure of the page but it’s not that you have any kind of a fantastic ranking bonus by having text in an h2 tags …. sometimes we will see sites trying to abuse that and they put their whole content into an h1 tag and say well this is like really really important text and you should treat it with high value and we do use a to understand that the context of a page better to understand the structure of the text on the page but it’s not the case that you would like automatically rank one or two steps higher just by using a heading so I’d recommend using it to give a semantic structure to the page but I wouldn’t say that this is a requirement for ranking properly in search”

John Mueller, Google


Do Google Algorithms Consider Heading Elements For SEO Purpose?

Embedded content: https://www.youtube.com/watch?time_continue=41&v=Hgy3Oc9zfOw

How many HTML Heading H1 tags should be on each page?

QUOTE: ‘We do use H tags to understand the structure of the text on a page better,

John Mueller, Google


As a matter of fact and experience, You definitely need at least one H1 HTML Heading. The heading is an introduction for your webpage. Webpage without an introduction is like a book without a title.

Not highlighting your content with an H1 heading can make your visitors leave without fully benefiting from it. Always use H1 Heading for your webpage.

Also, if you will not include H1 HTML heading tag in your webpage, you will leave it in the hands of Google to skim your content and bring up one itself using other HTML Elements like Description Meta Tag or even from the content itself. This is not an ideal approach.

And one H1 tag is all you need and all you should use. More is unnecessary and confusing.

Does Placement Of HTML Elements By Location In The Content Has An Effect On SEO?

HTML defines six levels of headings. The heading elements are H1, H2, H3, H4, H5, and H6 with H1 being the highest (or most important) level and H6 the least.

This is how Heading tags should be used. Where you place this heading has no effect on SEO what so ever.

For example, You might have to use H2 heading tags to highlight a paragraph, all the way down to the last one in your content.

Place where they are designed to be placed for. Maintain a natural hierarchy and don't skip levels. Enhance the user experience.

<h1> Types And Correct Use Of Heading Tags for SEO <h1>

<h2> Sub Heading 1 <h2>
 <p>Here is some text</p>
 <p>Here is some text</p>
  <h3>For User Experience</h3>    
<h2> Sub Heading 2 <h2>
  <p>Here is some text</p>
<h2> Sub Heading 3 <h2>
  <p>Here is some text</p>
<h2> Sub Heading 4 <h2>
  <p>Here is some text</p>
<h2> Sub Heading 5 <h2>
  <p>Here is some text</p>
<h2> Sub Heading 6 <h2>
  <p>Here is some text</p>

<h2> Summary <h2>

QUOTE: "We do give it a slight boost if we see a clear heading on a page because we can understand this page is clearly about this topic but it’s not something that I’d say you absolutely need on every page to show up in search in a lot of pages don’t use H headings at all they just mark up the content with CSS”

John Mueller, Google


Should My HTML H1 (Title) Always Match Page URL?

Not really. You can have a different URL and write completely different H1 heading as your Tittle. Google is not bothered if they are different.

Google algorithms are great in figuring out a lot from the title. In fact, your Title H1 tag is more of a value if you compare your URL with it.

I have seen pages rank absolutely well in SERPs which has completely different H1 Heading tag than their URL. Consider Following Example

Untitled

hobo2

One of the reasons why Title Heading H1 relevancy with URL is not necessary is that to keep your content up to date you will need to keep your content relevant to the times. The title is part of the content and you may need to update that as well.

URL's, on the other hand, stay constant. You may create a fresh page and use 301 redirects but it's more of a hassle than just updating your content.

Read more about How To Keep Rankings in Google With 301 Redirects

Consider an example: You have a webpage ranking high on SERPs for few years about SEO tips like says

"10 SEO mistakes to avoid in 2017".

Your research on the topic is exceptional and every year you add or update your page. Most of your tips are evergreen. Maybe you need to add or update a few more in 2018.

What is a better approach? Write a new article which 90% copy of the old article and fight and hope for it to rank in Google?

Or update and request Google to Fetch your content and stay on top of the search results?

H1, H2, H3, H4, H5, H6 HTML Elements Best Practices For 2018

In any web page, a heading tag is an introduction for the piece of content that follows. I keep things simple. It helps both my readers and Search Engines. Help them often, they will you back with good traffic.

Best Practices Are Simple:

  • Make sure you use H1 Heading
  • Always Nest headings by their level.
  • Keep most important heading has at level 1
  • Use headings with an equal or higher to begin a new section.
  • Use headings with a lower level to begin a new subsection.
  • Don't skip heading levels as that can be confusing
  • Always plan out a heading structure before composing a page.

I always use the H1 Heading elements and in fact, spend a quite a bit of time on them. Also, I always use only one H1 element on a page.

I use H2 elements as many times as needed for sections.

I only reach level H3 for any subsections I have in the content.

H1, H2, H3 work for me just great.


Examaple of using H1 - H2 HTML Elemement to organize Sections

page-structure-headings-intro


Examaple of using H1 - H3 HTML Elements to organize Content

page-structure-headings-2

Headings | www.w3.org

QUOTE: “We do give it a slight boost if we see a clear heading on a page because we can understand this page is clearly about this topic”

John Mueller, Google


Important Things To Remember When Using H1, H2, H3, H4, H5, H6 HTML Elements:

  • There is no proven rule for the length of the header tags
  • There is no proven rule for the optimal number of the header tags
  • Always find the right compromise keywords and honest content headers
  • Relevancy is crucial between headers elements and content that follows
  • Use variations for headings elements. Do not stuff your headings with the same keywords.
  • When updating content, consider updating Header H1 and any other Header tags, H2, H3.
  • Do not force things in any way. Keep it natural. Readability is crucial for High Quality content.
  • If content does not allow hierarchy, do not force it. You can do well without it.
  • Research keywords well. Try to find high searched phrases which best describe your content, but use them wisely.
  • Always use header tag H1 (Title) unless you have a good reason not to do so. Use it only once and if possible at the very start of the content.
  • Avoid using BOLD if possible. Use header elements for all headings.
  • Always "Order" header elements properly.
  • Do not confuse both readers and search engines by skipping levels.
  • Use styles (CSS) to overwrite default behaviors for heading elements but always maintain order and level.

Boston Univerity | Heading hierarchy

When using HTML header elements,

For Search Engines:

focus on how to use them to:

  • Explain the purpose of your content
  • Properly structure your content
  • Match user search with content

For User Experience:

focus on how to use them to :

  • tell visitors what is on offer ( Title Tag / H1 element),
  • best inform visitors about Important sections ( H2 element )
  • best inform visitors about Further subsections ( H3 element )

What Are HTML H1 Heading All Time Best Practices?

"Titles are critical to giving users a quick insight into the content of a result and why it’s relevant to their query. It's often the primary piece of information used to decide which result to click on, so it's important to use high-quality titles on your web pages. "

Google | Create good titles and snippets in Search Results


"As explained above, make sure every page on your site has a title specified in the title tag. "

Google | Create good titles and snippets in Search Results


Optimize Title tag H1 properly:

  • To inform users about content
  • To match with searched phrases
  • To help Search Engine understand the purpose of the content
  • To read naturally and effectively communicate the topic of the page's content.

Avoid:

  • The similarity between heading H1 tags for different pages
  • Strictly avoid vague heading H1 tags or with no relation to the content on the page.
  • Listing all keywords you can find as a title tag (Keyword stuffing)

"Google typically displays the first 50–60 characters of a title tag. If you keep your titles under 60 characters, our research suggests that you can expect about 90% of your titles to display properly. There's no exact character limit because characters can vary in width and Google's display titles max out (currently) at 600 pixels."

Title Tag | Moz.com


Published Under: Heading Elements
Disclaimer: “Whilst we have made every effort to ensure that the information we have provided is accurate, it is not and advice. We cannot accept any responsibility or liability for any errors or omissions. Visit third party sites at your own risk. This article does not constitute legal advice.

From £99/Month