What are H tags for and how should you use them?

What are H tags for?

The ‘H’ stands for heading and they are vital HTML elements that help search engines understand the structure of a webpage. They are an important part of SEO. H tags are applied to headings and subheadings, and the most important ones will include your keywords.

There are different types of H tag, ranging from H1 to H6. In your website’s code, they’ll look similar to this: <h1>The Heading Text</h1>

View more examples

 

Why H tags are important

H tags provide pages with a structure that make it easier for both users and search engines to read your website’s content. Using them correctly provides a better user experience and can positively impact your search rankings.

H tags and SEO go hand-in-hand. Headings with H tags give search engines a better understanding of a page’s content. They help to demonstrate which parts of your content are most important, supporting content relevance, topical authority, and clarity. Search engines prioritise well-structured, high-quality content that aligns with E-E-A-T (Experience, Expertise, Authoritativeness, and Trustworthiness)—a key factor in ranking competitive content.

Good use of H tags also makes your page more readable for users. People rarely read online content in a simple chronological order: instead, they scan a webpage, looking for what they need. Using consistent H tags helps people to understand your pages and find what they want more quickly.

H tags are important for accessibility too, as technology like screen readers uses H tags to provide easier navigation. Screen readers use the HTML to identify H tags and then read this key headings aloud. Visually impaired users can then select whether they want to read certain sections. To make your content accessible to all users, you need to use H tags.

While one H1 per page is the best practice, modern search engines no longer penalise pages that have multiple H1s if structured properly. Google’s John Mueller has confirmed this. However, keeping a single, clear H1 is still ideal for clarity.

➡️ Want to improve other on-page elements? Check out our guide on Best Practices for SEO Image Optimisation.

 

What are the different H tags for in SEO?

H1 tags

A H1 should be used for the main heading or title on a page. It’s the most crucial indicator of what your page is about, so it should include your primary keyword. The title should make it clear exactly what the page is about.

As this is the most important heading, each webpage should only ever have a single H1 tag. After all, if you add more than one, how is a search engine supposed to know which H tag is the most important?

 

H2 tags

Your page may need more than one heading, so H2s are used for your key subheadings. They help you break up the page into different sections or categories and can include the same keywords as your main H1 title.

 

H3 – H6 tags

These are the subsections and sub-points within your different subheadings. They are useful for splitting up longer content into smaller sections, making it much more scannable. They might include secondary keywords, or similar and related keywords.

 

You won’t always need to use all the H tags on a page. In fact, for most pages it’s rare that you will use H5s or H6s unless you’re creating long-form content covering topics in-depth.

➡️ Learn more about optimising your content structure with our guide on SEO for New Websites.

 

 

How to use H tags

H tag structure: nesting

You should always use H tags in descending order, starting with H1 and working down to H6. This hierarchy is called nesting and may look different for different types of pages.

Correct H tag nesting means your H tags have a clear and consistent hierarchy. E.g. Your H2 subheading has a H3 subsection, which contains H4 sub-points. It doesn’t just jump from H2 to H5, nor start at H4 then have H2 subsections.

 

Why is nesting important?

Applying H tags properly with clear nesting helps search engines to understand how important each heading is on your page, and therefore what’s the most important content on the page.

 

Example H tag nesting

Imagine it’s the year 3000, or perhaps 2999, and you’re thinking about buying a new spaceship. Perhaps your parents or your brother have retired to the outer planets, or they’ve just opened a new Butlin’s a couple of galaxies over and you’d really like to check out the Mangan Drive-Thru.

Here’s an example of what H tag nesting could look like for an article helping people to choose a new spaceship.

 

Styled headings vs functional H tags for SEO

Many content systems offer built-in heading options, with styling automatically assigned to a H tag. As a result, website builders or designers will often use these built-in H tags as design elements, selecting them for different headings based purely on their styling. But a H tag itself is not a design element. While consistent styling is important, it should not be prioritised over functionality and SEO.

Choosing how to style a heading is a design consideration while choosing a H tag designation is an SEO decision.

You can style two headings in the same way, while giving them different H tags – or without giving them a H tag at all. For instance, there might be styling reasons why you want all the headings on one page to look the same, but they aren’t all of equal important so you need to give them different H tags.

Here’s an example of two headings – one with a H2 tag, and one with the same styling that is coded as ordinary paragraph <p> text.

This is how they appear on the page.

And this is what the code looks like. You’ll see that both headings have the same styling class of text-2xl font-bold mb-4 but the top section has a H tag of h2 while the bottom has none and is simply designated p for paragraph.

It’s important that whoever is responsible for designing and building your website understands the separation of styling headings and H tags for SEO.

➡️ Avoid common pitfalls like this by checking out our guide on SEO Mistakes to Avoid.

 

 

How To Write Good Headings

Keep them short

Your headings are supposed to summarise or introduce the content below them, so they don’t need to be too long. You will go into more detail below them, whether that’s in paragraphs in an article or linking off to other parts of your site. Lengthy headings also aren’t scannable, so make it harder for people to navigate your site.

Include keywords (where relevant)

Although we’ve mentioned that H tags will often include your primary and secondary keywords, this should only be where they’re relevant. If you’re awkwardly re-writing something to squeeze a keyword in or using it too much across the page, this will look like keyword stuffing.

Make them descriptive and useful

Remember that you are ultimately writing for humans as well as search engines, so your content needs to be useful to people. Part of this means making it as easy as possible for them to find what they need. People come to your page with ‘search intent’, which means they have an idea of the type of content they’re looking for.

Let’s imagine you run a gardening supplies business. If someone has searched for ‘gardening tools‘, they might click on your page called ‘The Most Important Gardening Tools To Own‘ because it looks relevant, but in the end they’re looking to buy gardening tools. You could have a subheading like ‘Buying Gardening Tools‘, which might be ok, but it doesn’t really tell a reader much. Instead, you would be better with a subheading like ‘Where To Buy High Quality Gardening Tools‘ or ‘How To Choose a Gardening Tools Supplier‘. This clearly informs people what the text below will provide.

➡️ Need help implementing an SEO strategy on your website? Arrange a call or coffee today