Header Tags for SEO: The Complete Guide to H1–H6 Heading Tags

You have written a genuinely useful page, but it sits on page three and no one reads it. Often the problem is not the words, it is the structure holding them up. When your headings are vague, out of order, or missing, both readers and search engines struggle to work out what your page is actually about. Header tags fix that. Get your H1 to H6 hierarchy right and you make your content easier to scan, easier for Google to understand, and easier for AI search tools to quote. This guide walks you through every part of it.

What are header tags?

Header tags are HTML elements, written H1 through H6, that mark the headings and subheadings on a web page. They give your content a hierarchy: the H1 states the main topic, and H2 to H6 break that topic into sections and subsections for readers, search engines and AI tools to follow.

People say “header tags” and “heading tags” to mean the same thing, and this guide does too. Here is what they look like in HTML:

<h1>Header Tags for SEO</h1>
<h2>What are header tags?</h2>
<h3>The H1 tag</h3>
<h2>Why header tags matter</h2>

The number sets the level of importance. H1 is the top of the tree, H6 the smallest branch. That is the whole idea, and everything below builds on it.

Header tags vs title tags vs the header element

Three things get muddled here, and the confusion causes real mistakes. A heading tag, a title tag and the HTML header element are not the same, so it helps to separate them before going further.

What a title tag is (and how it differs from an H1)

A title tag lives in the invisible part of your page code and sets the clickable headline in search results and the browser tab. Your H1 is the main heading people see on the page itself. They can match, and often should, but they do different jobs.

The two live in different places. The title tag sits inside the page’s head section, while the H1 sits in the body where visitors read it. Google’s own guidance notes that it may build the title link in search from several sources, including your title tag and the headings on the page. So if your title tag is missing or weak, Google can fall back on your H1. That is one more reason to write a clear, descriptive H1. If you want the full picture on the other half of this pair, our SEO services cover on-page work like this end to end.

The header element vs heading tags

The HTML header element is a container, not a heading. It usually holds introductory content at the top of a page or section, like a logo, navigation or a search box, and it can contain a heading tag inside it. So a header element might wrap your H1, but it is not itself an H1. Mixing the two up is common, and it matters when you are reading or editing raw HTML.

The head section vs headings

The head section is a third, separate thing. It holds metadata about your page, such as the title tag, meta description and tracking scripts, and none of it renders as a visible heading. Think of it this way: the head section describes the page to browsers and search engines, while heading tags organise the content people actually read.

What each heading level is for

The HTML specification defines exactly six levels of section heading, from H1 down to H6, as the MDN reference on HTML heading elements sets out. You rarely need all six. Here is when to reach for each one.

The H1 tag: your page’s main title

The H1 is the main heading of the page and should describe what the whole page is about, much like the title of a document. Use one H1 per page and put your primary topic in it. If a reader saw only your H1, they should know what they are about to read.

The H2 tag: major sections

H2s mark the main sections of your page. Each H2 introduces a distinct chunk of the topic, the way chapter titles divide a book. Most pages do the bulk of their structural work with H2s.

The H3 tag: subsections under an H2

An H3 breaks a single H2 section into smaller parts. Use it when a section has several points that each deserve their own subheading. Every H3 should sit logically underneath the H2 above it, not float on its own.

The H4 tag: deeper breakdowns, used sparingly

H4s add another layer beneath an H3, for when a subsection itself splits into parts. Most articles never need to go this deep. Reach for an H4 only when the content genuinely has that many layers, not to make text smaller.

The H5 and H6 tags: rare, for detailed or technical content

H5 and H6 exist for deeply nested content, such as technical documentation or reference material. For a typical blog post or service page, you will almost never use them. If you find yourself relying on H5s and H6s often, it is worth asking whether the page has become too complicated.

Why header tags matter for SEO

Header tags are not a magic ranking button, but they earn their place. They help search engines, they help readers, and they support the parts of SEO that increasingly decide who gets seen. Here is what they actually do.

They help search engines understand structure and topics

Search engines read your headings to work out what each part of a page covers. Google’s John Mueller has described a heading as a really strong signal that tells Google a section of the page is about a particular topic. Clear headings make it easier for Google to match your sections to what people search for.

They improve readability and scannability for users

Most people scan before they commit to reading. Headings give them a map: they can skim the subheadings, find the part they need, and start there. That lowers the effort of reading your page and keeps people on it longer, which is good for everyone.

They improve accessibility for screen readers

People who use screen readers rely on headings to move around a page. The software announces each heading and its level, and lets users jump between sections with keyboard shortcuts. A logical heading structure is one of the simplest things you can do to make your content usable for visually impaired readers, and the W3C’s guidance on page structure with headings explains why.

They help you win featured snippets

Google often builds featured snippets, the answer boxes at the top of results, from well-structured headings and the text right beneath them. A clear question-style H2 followed by a tight, direct answer gives Google something clean to pull. Structure will not force a snippet, but it makes your page eligible for one.

Heading use correlates with higher rankings, but is not a silver bullet

Studies of top-ranking pages tend to find that well-structured content using headings performs better, though correlation is not proof of cause. A controlled SEO split test by SearchPilot gives a more grounded picture: a travel site whose listing pages had no H1 changed the first H2 to an H1, and across the full set of pages this produced a statistically significant 4.5 percent lift in organic traffic. Notice the nuance, though. The same change on a small subset of pages had been inconclusive, and the win came from adding a missing H1, not from swapping tags for their own sake. Use headings well as part of good content, not as a trick.

How to structure H1–H6 heading tags

A logical hierarchy is mostly a matter of following a few rules in order. Here is the structure to aim for on every page:

1. Use one H1 that describes the whole page.
2. Use H2s for your main sections.
3. Use H3s for subsections that sit under a specific H2.
4. Go deeper with H4 to H6 only when a subsection genuinely splits further.
5. Never skip a level on the way down, such as jumping from an H2 straight to an H4.
6. Keep the visual order matching the code order, so the hierarchy reads top to bottom.

Here is a clean structure in HTML:

<h1>Setting the exposure manually on a camera</h1>
  <h2>Set the ISO</h2>
    <h3>ISO and image quality</h3>
  <h2>Choose an aperture</h2>
    <h3>Aperture and depth of field</h3>
  <h2>Choose a shutter speed</h2>

If you read only those headings, you still understand the page. That is the test of a good hierarchy.

Header tag best practices

Once the hierarchy is right, a handful of habits keep your headings working for both readers and search engines. Treat these as a checklist you run before publishing.

Use only one H1 per page

Give each page a single H1 that names its main topic. More than one H1 blurs the focus and tells search engines the page is about several things at once. Reserve the H1 for the title, and use H2 to H6 for everything below it.

Maintain a logical order and don’t skip levels

Follow the levels in sequence: H1, then H2, then H3, and so on. Skipping from an H2 to an H4 breaks the logical outline and confuses screen readers, as the MDN guidance on not skipping heading levels notes. If you need a heading, use the next level down, not the one that happens to look right.

Include target keywords naturally, but avoid stuffing

Work your target and related keywords into headings where they fit, because Google reads headings for context. But keep them natural. If a keyword makes a heading clumsy, drop it. Google recognises keyword-stuffed headings and they help no one, least of all the reader.

Keep headings clear, descriptive and concise

Write headings that tell the reader exactly what the section covers. Skip vague openers like “Understanding” or “An overview of” that add words without meaning. A heading like “How to structure H1 to H6 tags” beats “A discussion of various approaches to heading structure” every time.

Match search intent with your H1 and first H2

People arrive with a question in mind. Use your H1 and first H2 to confirm they are in the right place by reflecting what they searched for. When the heading matches the intent behind the search, readers stay instead of bouncing back to the results.

Keep formatting and case consistent

Pick a style for your headings, such as sentence case, and apply it across the whole site. Keep them a similar length and tone. Consistent headings look intentional and make a site easier to read, which quietly supports the experience Google rewards.

Use headings for structure, not styling

Never choose a heading level because you like the font size it produces. Headings define structure; CSS controls appearance. If you want bigger or smaller text, style it with CSS and leave the heading levels to reflect the real hierarchy, as MDN advises against using headings to resize text.

Write question-style subheadings where a section answers a question

When a section answers a specific question, phrase the heading as that question. “How do I add an H1 in WordPress?” signals to both readers and AI tools that a direct answer follows. This is one of the simplest ways to make your content easy to quote, which matters more every year.

Common header tag mistakes to avoid

Most heading problems come down to a short list of repeat offenders. Watch for these when you audit a page.

Multiple H1s, or no H1 at all

Two common faults sit at opposite ends. Some pages carry several H1s, often because a logo or site title is marked up as one on every page. Others have no H1 at all. Both weaken the signal about what the page is about. Aim for exactly one clear H1 per page.

Using the same heading on every page

If every page shares the same generic heading, readers and search engines cannot tell them apart. Give each page headings that describe its own content, so each one stands as a distinct topic in its own right.

Skipping heading levels

Jumping from an H2 to an H4 to grab a smaller font breaks the outline. Screen readers announce the gap, and the structure stops making sense. Move down one level at a time and use CSS if you only want a size change.

Keyword-stuffing headings

Cramming the same keyword into heading after heading reads badly and can work against you. Write headings for people first. The keywords you need will mostly appear on their own if the page is well organised.

Using headings on non-heading elements

Marking up footers, navigation or captions as headings just to change their size clutters the page’s outline with things that are not really sections. Keep heading tags for actual headings, and style everything else with CSS.

How to add and edit header tags in your CMS

You rarely touch raw HTML to set a heading. Almost every content management system, or CMS, gives you a menu for it. Here is how to do it across the platforms most Singapore businesses use.

WordPress

WordPress handles headings through its editor, and most SEO plugins add a check on top. There are two ways in.

Setting headings in the block editor

In the block editor, add a Heading block, type your text, and choose the level from the block toolbar’s level selector (H1 through H6). WordPress usually turns your post title into the H1 automatically, so your in-content headings normally start at H2. You can also switch a block to “Edit as HTML” if you prefer to set the tag by hand.

Checking the heading with Yoast or Rank Math

Plugins like Yoast SEO and Rank Math do not place headings for you, but they flag issues, such as a missing keyphrase in your subheadings or long stretches of text without one. Treat those flags as prompts to review structure, not hard rules to obey blindly.

Shopify

In Shopify’s page and blog editor, highlight your text and pick a heading level from the formatting menu’s paragraph or heading dropdown. To change the H1 or headings on templated pages like your home or product pages, you edit the theme files, which takes a little more care. Our Shopify SEO work covers that side if you would rather not touch theme code.

Wix

In the Wix editor, select a text box and choose a heading style (Heading 1 through Heading 6) from the text settings panel. Wix links these styles to the underlying tags, so picking “Heading 2” applies an H2. Keep an eye on which element Wix has set as the page’s H1, since templates vary.

Squarespace

Squarespace applies headings through its text editor: highlight the text and select Heading 1, 2, 3 or 4 from the formatting toolbar. It exposes fewer levels than some platforms, which is usually fine, since most pages do not need H5 or H6.

Webflow

Webflow gives you direct control. Add a Heading element and set its tag (H1 to H6) in the settings panel, independent of how it looks. Because Webflow separates the tag from the style so cleanly, it is easy to keep structure and appearance in their own lanes, which is exactly what you want.

Magento

On Magento, you set headings through the WYSIWYG editor on a CMS page or block, or in the raw HTML for product and category descriptions. For a large ecommerce catalogue, it is worth agreeing a heading pattern for product pages so every page follows the same structure.

How to audit your header tags

Before you fix headings, you need to see them. Three methods cover most needs, from a quick single-page check to a full site sweep.

Check the page source manually

On any page, open your browser’s view-source or developer tools and search the code for <h1 to find the H1, then <h2, and so on. It is a fast way to confirm a single page has one H1 and a sensible order, with no tools to install.

Use a browser extension

An SEO browser extension can show a page’s heading structure in one click, listing every heading in the order it appears and at what level. It is quicker than reading source code and good for spot checks while you browse.

Use a site crawler for site-wide issues

To check headings across a whole site, a crawler flags every page with a missing H1, multiple H1s or broken order in one report. This is the only practical way to audit a large site, and it is a core part of any SEO audit we run for clients.

Header tags for AI Search and AEO

Search no longer stops at ten blue links. AI Overviews and tools like ChatGPT now answer questions directly, and they lean on structure to decide what to quote. Answer engine optimisation, or AEO, is the practice of shaping content so these systems can find and cite it, and your headings do a lot of that work. Our AI SEO service is built around exactly this shift.

How AI engines chunk content by heading

AI systems rarely read a page start to finish. They break it into chunks, often along your headings, and pull the chunk that best matches a user’s prompt. Clear, descriptive headings make those chunks easy to identify, which makes your content easier to retrieve and quote.

Use descriptive, question-based subheadings that mirror prompts

People ask AI tools full questions. When a subheading mirrors the phrasing of a likely question, you make it obvious that a direct answer sits below. A heading like “How do AI engines use headings?” maps neatly onto a prompt, where a vague “Headings and AI” does not.

Put the direct answer immediately under the heading

Lead with the answer. Right after a question-style heading, give a short, self-contained response, then expand on it. AI systems weigh how closely the text under a heading supports the heading itself, so burying the answer three paragraphs down weakens the match.

How to earn AI Overview citations for heading-related queries

To be quoted in an AI Overview, make your page the easiest good answer to cite. Lead each section with a clear answer under a descriptive heading, add an FAQ section with self-contained questions and answers, and mark it up with FAQ schema so the pairs are machine-readable. Google’s own AI features guidance stresses people-first, helpful content over any single trick, so structure supports good content rather than replacing it.

Header tag examples: good vs bad

Seeing the difference makes the rules stick. Here is a poorly structured page, with headings out of order and levels skipped:

<h3>Quick links</h3>
<h1>Setting the exposure manually on a camera</h1>
<h4>Set the ISO</h4>
<h2>Choose an aperture</h2>
<h4>Vignetting</h4>

The topic is buried below a navigation heading, the H1 arrives late, and the levels jump around with no logic. A reader scanning the outline learns very little.

Here is the same page fixed:

<h1>Setting the exposure manually on a camera</h1>
  <h2>Set the ISO</h2>
    <h3>ISO and image quality</h3>
  <h2>Choose an aperture</h2>
    <h3>Depth of field</h3>
    <h3>Vignetting</h3>
  <h2>Choose a shutter speed</h2>

Now the H1 leads, every H2 is a real section, and each H3 sits under the right parent. The outline alone tells the whole story, which is exactly what you want a search engine, a screen reader and a reader in a hurry to find.

Frequently Asked Questions

Final thoughts

Header tags are one of the least glamorous parts of SEO and one of the most reliable. Get your H1 to H6 hierarchy right and you make every reader, search engine and AI tool that meets your page work less to understand it, which is the whole game. Pick one important page, view its heading structure, and see whether the outline alone tells the story. If it does not, you now know exactly how to fix it. If you would rather have a team handle the structure across your whole site, our SEO agency is built for it, and we would be glad to hear what you are working on.