A Beginner’s Guide to Heading Tags And How to Use Them

If you’re new to running a website with a CMS (Content Management System) and using a WYSIWYG (What You See Is What You Get) editor, you’ve probably come across the option to add headings like H1, H2, and so on. But what do all these “H” tags mean? Why do they matter for your site’s structure and SEO (Search Engine Optimisation)? Let’s break it down.

What Are Heading Tags?

Heading tags are HTML elements that define the titles and subtitles on your web pages. These tags go from H1 (the most important) down to H6 (the least important). Think of them as a way to organise your content, like chapters in a book.

Here’s a quick rundown of the hierarchy:

H1: The main heading of the page—like the title of a book.
H2: Subheadings under the H1—like chapters.
H3: Subheadings under the H2—like sections within chapters.
H4, H5, H6: These are for even smaller subsections, but you won’t often need to go this deep.

Why Is Heading Hierarchy Important?

Using headings in the right order isn’t just about making your page look neat. It’s about creating a logical structure that helps both visitors and search engines understand your content.

For Users: A good heading structure makes your page easy to scan. Most people won’t read every word they skim! Headings help them find the sections they care about.

For Search Engines: Headings help search engines like Google figure out what your page is about. They use your headings to understand the main topics and themes. Get it right, and it helps your SEO efforts.

Heading Tags in Action: An Example

Let’s say you’re writing a blog post called “How to Grow Tomatoes”. Your headings might look like this:

H1: How to Grow Tomatoes (this is your main topic)
H2: Choosing the Right Tomato Seeds (a sub-topic)
H3: Heirloom vs Hybrid Seeds (a smaller section within the H2 topic)
H2: Preparing Your Garden (another sub-topic)
H3: Soil Preparation (more detail)
H2: Watering and Feeding (a final sub-topic)

Notice how there’s only one H1? That’s key. Every page should only have one H1 tag, and it should describe the main topic of the page. Your subheadings (H2, H3, etc.) flow naturally from the H1 to give structure to the content. Don’t jump from an H1 to an H4 keep the hierarchy clean and logical.

How Headings Relate to SEO

So, how do headings affect SEO? Well, search engines use your headings to get a sense of what each section of your page is about. The better organised your content, the easier it is for search engines (and your users!) to understand it.

H1 Is Important: The H1 is one of the first things search engines look at when they crawl your page. Make sure it’s relevant, and try to include your main keyword naturally. But don’t stuff it with keywords, Popular search engines are  smart enough to penalise you for that!

Subheadings Help With SEO Too: Your H2s and H3s can also help search engines understand the different parts of your content. They might not carry the same weight as the H1, but using keywords in your subheadings (again, naturally!) can still be beneficial.

Improves Accessibility: Properly structured headings improve the experience for people using screen readers or other assistive technologies. This isn’t just good for user experience, it is also something search engines consider when ranking pages.

Headings Takeaway

Using headings properly not only improves your page structure and makes your content easier to digest, but it can also have a significant impact on your on page SEO. When creating a page, remember to:

  • Use only one H1 per page (this is your main title).
  • Organise content with logical H2s, H3s, etc. to break up the page.
  • Incorporate relevant keywords naturally into your headings.
  • Don’t skip levels, keep the heading hierarchy intact.

With well-structured headings, you’ll not only create a better experience for your readers but also send all the right signals to search engines.

How Headings Work Across HTML Sections

When using HTML sections (<section> tags), the rules for heading tags (H1, H2, etc.) still generally follow the same principles of hierarchy. However, there are a few nuances to consider depending on how you structure the page.

Page-Wide Hierarchy Still Matters: Even if you divide your content into <section> tags, the overall hierarchy of the page remains crucial. Ideally, there should still only be one H1 tag per entire page, representing the primary topic of the entire document. This is because search engines generatre the page as a single entity when ranking it, not as multiple sections.

Using Headings Within Sections: Within each <section>, you can use H2, H3, etc., to create a local hierarchy. However, it’s important to maintain a logical order. For example:

Your page’s H1 should still describe the main topic of the entire page.

Inside each section, you can start with H2 for the section heading, and then use H3 and below for subsections within that section.

<h1>How to Grow Tomatoes</h1>
<section>
  <h2>Choosing the Right Tomato Seeds</h2>
  <h3>Heirloom vs Hybrid Seeds</h3>
</section>
<section>
  <h2>Preparing Your Garden</h2>
  <h3>Soil Preparation</h3>
</section>

In this case, each section starts with an H2, but the page still only has one H1 at the very top. The H2 tags in each section are considered as subheadings of the overall H1, not new H1 tags for each section.
Do <section> Tags Change the Rules?

In theory, HTML5 allows <section> tags to act like mini-documents, meaning that inside each <section>, it could be valid to have its own H1 tag. This is a semantic feature of HTML5, but in practice, for SEO purposes, it’s still better to stick to the traditional rule of one H1 per page. Not all search engines have fully adapted to treat multiple H1 tags within sections as a best practice.

In short, even if you use <section> tags, the page as a whole is treated as a single structure when it comes to SEO, and sticking with one H1 for the entire page is the safest way to ensure clarity for search engines.

Summary

While HTML5 introduces more flexibility with semantic elements and the potential for multiple H1 tags within different sections, the prevailing SEO best practice, supported by leading authorities like Google and Moz, recommends using a single H1 tag per page. This approach ensures clarity for search engines and maintains a strong, organized structure for your content.

Download The PDF

Get In Touch With Matt and the Team

Further Reading