// glossary

H1 Tag: SEO Best Practices, Examples & Common Mistakes

An H1 tag is the page's primary heading. Learn how to write one, why one H1 per page still matters in 2026, and the mistakes that quietly cost rankings.

// updated:

An H1 tag is the HTML element that marks a page’s main heading — the single, top-level statement of what the page is about. It’s the first structural signal a crawler, a screen reader, and a skimming human all use to decide whether they’re in the right place. Get it right and the rest of the page has a spine to hang off; get it wrong and you’re shipping pages with no clear topic, which is exactly the kind of ambiguity that tanks relevance.

H1 Tag

An H1 tag (<h1>) is the primary heading element of an HTML page, used once to declare the page’s main topic to users, assistive technology, and search engines at the top of the content hierarchy.

Why the H1 still matters

The H1 isn’t a magic ranking lever — it never was — but it’s load-bearing for three audiences at once, and that’s why we never wave it off as “just a design choice.”

  • Search engines use the H1 as a strong on-page topic signal that reinforces what your title tag and body already say. When all three agree, you’ve removed ambiguity about the page’s subject.
  • Screen readers let users jump heading-to-heading. A missing or junk H1 means a blind user lands on a page with no announced topic — a real accessibility failure, not a theoretical one.
  • Skimmers read the H1 before anything else. It’s the promise that the page keeps (or breaks) in the first two seconds.

The H1 won’t outrank a thin page on signal strength alone. But a strong page with a vague or missing H1 is leaving free relevance on the table — and confusing the AI Overviews extraction layer in the process.

In the AI Overviews era, that last point matters more than it used to. Generative answer engines lean on clear heading structure to chunk and quote pages. A descriptive H1 followed by a clean header tags hierarchy makes your content easier to lift into an answer — the new front door to a lot of traffic.

How to write an H1 that works

The rules are boring on purpose. Boring is what scales across a thousand programmatic pages.

  • Be specific. “Running Shoes” tells nobody anything. “Best Running Shoes for Flat Feet (2026 Buyer’s Guide)” tells a search engine and a human exactly what they’ll get.
  • Lead with the topic. Put the primary keyword or its natural variant near the front — not to cram, but to front-load what the page is genuinely about.
  • Keep it human. Aim for roughly 20–70 characters: descriptive enough to be useful, short enough not to truncate or read like a sentence fragment.
  • Don’t keyword-stuff. “Buy Cheap Running Shoes Best Deals Cheap Shoes Online” is exactly what Google’s E-E-A-T signals punish. One natural mention beats five forced ones.
  • Match intent. Align the H1 with the commercial intent — or lack of it — behind the query you’re targeting.

H1 vs. title tag — they’re not the same thing

This trips up more people than it should. The title tag lives in the <head> and shows in the browser tab and (often) the SERP. The H1 lives in the visible page body. They can overlap but shouldn’t be identical — the title can be more SERP-optimized, the H1 more reader-optimized.

ElementWhere it livesPrimary audienceShows in SERP?
Title tag<head>Search engines, SERP clickersYes (as the blue link)
H1 tagVisible <body>On-page readers, screen readersNo
Meta description<head>SERP clickersSometimes (as the snippet)

A good pairing keeps them aligned but not carbon-copied — same topic, different jobs.

One H1 per page — is that still the rule?

Short version: yes, in practice. The HTML5 spec technically allows multiple <h1> elements inside <section> or <article> blocks. But the practitioner reality is that most real CMS and component setups don’t implement sectioning cleanly, and Google has been clear that one clear H1 is the safest, least ambiguous choice.

We treat it as a hard rule: one H1 stating the page’s main topic, then a logical cascade of header tags below it. A clean structure looks like this:

<h1>H1 Tag: SEO Best Practices, Examples & Common Mistakes</h1>
  <h2>Why the H1 still matters</h2>
  <h2>How to write an H1 that works</h2>
    <h3>H1 vs. title tag</h3>
  <h2>Common H1 mistakes</h2>

Note the hierarchy: H1 → H2 → H3, never skipping levels for visual reasons. If you want a heading to look smaller, style it with CSS — don’t reach for an <h4> because it renders at the right size. Semantics drive crawling and accessibility; styling is a separate concern. (See header tags for the full cascade.)

Common H1 mistakes we still see in audits

When we run an SEO content audit, broken H1s show up on a depressing share of pages. The usual suspects:

  1. No H1 at all. Common on JavaScript-heavy sites where the heading renders client-side and never reaches the indexed HTML. If you ship a SPA, make sure your H1 survives JavaScript SEO rendering.
  2. The logo is the H1. An image with no alt text wrapped in <h1> gives crawlers and screen readers nothing. Fix the image alt tags — but really, the logo shouldn’t be the H1.
  3. Multiple competing H1s. Often a theme bug where the site title and page title both render as H1. Pick one.
  4. H1 duplicated across every page. A template that hardcodes the same H1 site-wide creates topical mush and feeds thin content signals. Each page’s H1 should be unique.
  5. Heading levels skipped for styling. Jumping H1 → H4 because the designer liked the size breaks the document outline screen readers depend on.

On programmatic builds, the H1 is a template variable. Get the template right once and ten thousand pages inherit a correct, unique heading. Get it wrong once and you’ve broken ten thousand pages identically. That leverage cuts both ways.

This is the kind of structural hygiene that compounds at scale — which is why we bake H1 logic into the page templates on every core pSEO engagement rather than patching headings page by page.

Effective H1 examples

A few that do the job, across intent types:

  • How to Change a Flat Tire: Step-by-Step Guide — clear informational intent, includes the query verbatim.
  • Best Budget Laptops 2026: Top Picks Under $500 — commercial-investigation intent, specific and dated.
  • Small Business Loan Options: Compare Rates & Terms — transactional-adjacent, sets a clear expectation.

Each one passes the same test: read it cold, with no other context, and you know what the page delivers.

Frequently Asked Questions

Can a page have more than one H1 tag?

HTML5 technically permits multiple H1s inside sectioning elements, but in practice you should use exactly one. Most CMS and component setups don’t implement sectioning cleanly, and a single clear H1 is the least ambiguous topic signal for search engines and the safest choice for accessibility and crawling.

Does the H1 tag affect SEO rankings?

Yes, but indirectly and modestly. The H1 is a supporting on-page relevance signal — it reinforces your topic alongside the title tag and body content. It won’t outrank a weak page by itself, but a missing, duplicated, or keyword-stuffed H1 quietly weakens relevance and can hurt accessibility-driven engagement.

Should the H1 match the title tag exactly?

No. The title tag lives in the <head> and targets SERP clickers, while the H1 lives in the visible page and targets on-page readers and screen readers. Keep them aligned in topic but not identical — the title can be more SERP-optimized, the H1 more reader-friendly and descriptive.

How long should an H1 tag be?

Aim for roughly 20–70 characters. That’s long enough to describe the page specifically and include your primary keyword naturally, but short enough to stay scannable on mobile and avoid reading like a full sentence. Prioritize clarity over hitting an exact length.

Why isn’t my H1 showing up to Google?

The most common cause is client-side rendering — the H1 is injected by JavaScript and never makes it into the HTML Googlebot indexes. Check the rendered HTML in a crawler or URL Inspection tool. Other culprits: the H1 is an unlabeled image, or it’s hidden with display:none CSS.

// related services

Put this knowledge to work

// ready to put it all together?

Founder-led SEO.
No dashboard theater.

Book a call →

// or send a message

Tell us
about your site.

Drop your URL and we’ll give you an honest read — no pitch, no obligation. Prefer to talk live? Book a call →

// 30 min · intro, founder-to-founder

Book a call