Heading Tags for SEO: A Practical H1–H6 Structure

What are heading tags?

Heading tags are the HTML elements <h1> through <h6>. They mark headings at six levels of importance within a document:

<h1>How to Grow Tomatoes in Containers</h1>

<h2>Choose the Right Container</h2>
<h3>Container Size</h3>
<h3>Drainage</h3>

<h2>Plant and Support the Tomatoes</h2>
<h3>Planting Depth</h3>
<h3>Stakes and Cages</h3>

The H1 names the overall page. Each H2 begins a major section beneath it, and each H3 begins a subsection of the relevant H2. H4–H6 can continue the same pattern when genuinely needed.

People often search for header tags, but heading tags is the more accurate name. A <header> is a different HTML element used to contain introductory or navigational content. It does not indicate a heading level by itself.

Why do headings matter?

They make long pages easier to scan

Most visitors do not begin by reading every sentence. They use headings to understand the scope of a page, find the relevant section and decide where to focus. A heading such as “Cancellation fees” is more useful than “More information” because it describes the material beneath it.

They provide a navigable structure

Screen-reader users can move from heading to heading or produce a list of headings to understand a page. Correct HTML markup preserves that function. Large, bold text styled with a <div> may look like a heading but does not necessarily provide the same structural information.

They clarify relationships between ideas

Heading levels show whether a section is a sibling or a child of another section. Two H2s cover separate parts of the main subject; an H3 belongs within the preceding H2.

This structure benefits writers as well. If an outline is difficult to organise, the page may be mixing several purposes or presenting ideas in the wrong order.

They help search systems interpret the page

Search engines can use headings alongside titles, body copy, links and other page signals to understand content. Google may also use a prominent heading as one source for a search result’s title link.

That does not make headings a place to repeat keywords. Their first job is to label sections accurately for the person using the page.

What is the difference between a title tag, H1 and header?

These three terms are often confused:

The title tag and H1 can use the same words, but they do not have to match exactly:

Title tag: How to Grow Tomatoes in Containers | Greenleaf
H1: How to Grow Tomatoes in Containers

The title includes the brand for a person comparing search results or browser tabs. The H1 stays concise because the site identity is already visible on the page. Both communicate the same subject.

A <header> may contain the H1, but using a header element does not turn ordinary text inside it into a heading. The heading still needs an <h1>–<h6> element.

How the H1–H6 hierarchy works

Think of heading levels as an outline, not a choice of text size:

H1  The complete page
├─ H2  First major section
│  ├─ H3  Subsection
│  └─ H3  Subsection
├─ H2  Second major section
│  ├─ H3  Subsection
│  │  └─ H4  Detail within that subsection
│  └─ H3  Subsection
└─ H2  Third major section

H1: the page’s main subject

Use one clear H1 that describes the primary content. It should help someone confirm that they reached the expected page.

<h1>Business Current Accounts</h1>

Avoid generic H1s such as “Welcome”, “Products” or “Learn more” when the page has a more specific purpose.

H2: the major sections

Use H2 elements for the main divisions of the H1 topic:

<h2>Compare Account Features</h2>
<h2>Fees and Transaction Limits</h2>
<h2>Who Can Apply?</h2>

These sections sit at the same level. Reading only the H1 and H2s should provide a useful summary of the page.

H3: subsections within an H2

Use an H3 when a major section needs smaller labelled parts:

<h2>Fees and Transaction Limits</h2>
<h3>Monthly Account Fee</h3>
<h3>Cash Deposit Limits</h3>
<h3>International Payments</h3>

An H3 should belong to the H2 above it. If it introduces a completely new major topic, it probably needs to be an H2.

H4–H6: deeper detail when necessary

Long reference pages and technical documentation sometimes need additional levels. Most service, product and Academy pages can remain clear with H1–H3. Do not add deeper levels simply because six exist.

How to write useful headings

Describe the section that follows

A heading should let someone predict the content beneath it. Replace vague labels with specific ones:

Vague: Other things to consider
Clear: Delivery Times and Collection Options

Keep each heading focused

Headings need enough detail to make sense, but they do not need to become full introductory paragraphs. Move qualifications and supporting detail into the body copy.

Use natural search language where it fits

If people commonly call the subject “fixed-rate mortgages”, that phrase is useful in a relevant heading. Do not force keywords into every level or repeat slightly different variations.

Poor:
H2: Fixed-Rate Mortgages
H3: Fixed Mortgage Rates
H3: Best Fixed-Rate Mortgage Deals

Clear:
H2: How Fixed-Rate Mortgages Work
H3: Choosing a Fixed Term
H3: What Happens When the Term Ends?

Make headings useful out of context

Screen-reader users and other visitors may browse a list containing only the headings. Labels such as “Benefits”, “Features” and “FAQs” can become ambiguous when several components use them. Where needed, make the subject explicit: “Benefits of a Heat Pump” or “Payroll Software Features”.

Separate meaning from appearance

Choose the HTML level for structure, then use CSS for presentation. Do not select an H4 because its default font happens to be the size you want, and do not use a bold paragraph where the content is genuinely a section heading.

Practical heading structure examples

Article page

H1: How to Fix a Leaking Tap
  H2: Before You Start
    H3: Tools You Will Need
    H3: How to Turn Off the Water
  H2: Find the Source of the Leak
    H3: A Dripping Spout
    H3: Water Around the Tap Base
  H2: Replace the Faulty Part
  H2: When to Call a Plumber

This structure follows the reader’s task from preparation to diagnosis, repair and escalation.

Service page

H1: Commercial Office Cleaning in Birmingham
  H2: Cleaning Services for Your Workplace
    H3: Daily Office Cleaning
    H3: Washroom and Kitchen Cleaning
    H3: Periodic Deep Cleans
  H2: How Our Contracts Work
  H2: Areas We Cover
  H2: Request a Site Visit

The main service and location appear once in the H1. The lower headings answer the practical questions a potential customer has.

Product page

H1: Alder Waterproof Walking Jacket
  H2: Product Details
  H2: Size and Fit
  H2: Materials and Care
  H2: Delivery and Returns
  H2: Customer Reviews

Reusable H2s can be appropriate across product pages when the H1 and product content make each page distinct. Repetition is not inherently wrong when the headings accurately label consistent interface sections. A page’s outline works alongside its document title; for inclusive content structure, also review the accessibility audit checklist.

Can a page have more than one H1?

For most websites, use one H1 that names the main page content. This creates a predictable outline and avoids uncertainty about which heading represents the page.

Finding two H1 elements does not prove that rankings are being harmed, and it should not trigger a blind sitewide replacement. A second H1 may come from a logo, mobile navigation, modal or reused component. Inspect the rendered page and accessibility tree to understand what users receive.

When several large headings compete as the main title, the page can become harder to interpret. Google may also use prominent headings when generating title links. Choose one clear main H1, then place major sections beneath it as H2s.

If a component needs a heading for accessibility, give it the level that fits its position in the page rather than automatically assigning another H1.

Can you skip heading levels?

Avoid skipping a level when opening a deeper subsection. An H4 directly beneath an H2 suggests that an H3 section is missing:

<!-- Confusing hierarchy -->
<h2>Delivery</h2>
<h4>International Delivery</h4>

Prefer:

<h2>Delivery</h2>
<h3>International Delivery</h3>

Moving back to a higher level is different. An H2 can follow an H4 when the deeply nested section has ended and a new major section begins:

H2: Product Details
  H3: Materials
    H4: Recycled Fibres
H2: Delivery and Returns

The aim is a meaningful hierarchy, not a sequence in which every neighbouring heading must change by exactly one level.

How to audit heading tags

Find pages without an H1

Review important indexable pages that have no main heading. The content may have a visually prominent title built from a generic <div> or the template may have omitted it completely.

Review multiple H1 elements

Group affected URLs by template and inspect representative examples. Determine whether the extra H1 is visible content, a duplicated responsive component or an incorrectly marked logo, navigation or modal.

Group duplicate H1 text

Repeated H1s can be normal on utility components, but identical main headings across distinct landing pages may hide what differentiates them. They can also point to duplicated pages or a template failing to insert a product, location or article name.

Compare the H1 with the title and URL

The three do not need to match word for word, but they should describe the same destination. Flag examples where the title promises one subject and the visible heading introduces another.

Inspect the full outline

A crawler can quickly find H1 patterns, but a useful hierarchy requires context. Review the sequence of H2–H6 headings on representative templates and compare it with the visual page.

• Does the outline begin with a clear page subject?
• Do headings accurately label the content beneath them?
• Are subsections nested beneath the correct parent?
• Does styled text look like a heading without being marked up?
• Are hidden or repeated components adding confusing headings?

Prioritise by page purpose

Start with indexable pages that matter to visitors and search. A heading warning on a redirect, error page or deliberate noindex utility page is unlikely to be the first repair to make.

Review H1 patterns in Clearcrawl

Clearcrawl helps reveal whether a heading issue is an isolated editing mistake or a repeated template pattern. If every product page has two H1s, repairing the shared header component is more reliable than editing the products individually.

Use crawl data to locate and group the issue. Use the rendered page and an accessibility inspection tool to judge whether the complete hierarchy makes sense to people.

How to fix and verify heading problems

1. 01
   Outline the page in plain text.

   List the main subject, major sections and necessary subsections without thinking about HTML or design. If the outline contains two unrelated main subjects, reconsider whether the page has one clear purpose.

2. 02
   Assign levels from meaning.

   Mark the page subject as H1, major sections as H2 and subsections as H3. Continue deeper only when the content needs it. Do not choose levels for their default size.

3. 03
   Fix the shared source.

   Trace repeated problems to the CMS template, page builder, navigation, accordion or reusable component. Make the heading level configurable when the same component can appear at different depths.

4. 04
   Preserve the design with CSS.

   Changing an H4 to an H2 should not force an unwanted visual change. Style headings with classes or design tokens so semantic hierarchy and appearance can be controlled separately.

5. 05
   Test representative pages.

   Check a short page, a long page, a page with optional components and a page using each major template. Review the visual layout, rendered HTML and accessibility outline.

6. 06
   Recrawl after publishing.

   Confirm that intended H1 changes appear across the site and that missing, duplicate or multiple-H1 counts have changed as expected. Spot-check the full hierarchy because a clean H1 report does not prove every H2–H6 relationship is correct.

Common mistakes

Frequently asked questions