What are Heading Tags?

Heading tags: the page outline in HTML

Heading tags are the six semantic elements—<h1> through <h6>—that label sections of content in hierarchical order. Together they form a machine-readable outline of the page: what the document is about, how major topics divide, and how fine details nest.

Heading tags are not decorative font sizes. Browsers apply default styles, but SEO and accessibility value comes from semantics: level communicates parent/child relationships, not visual weight alone.

The six heading levels at a glance

Each level has a dedicated glossary entry with use-case depth. This page covers the system—how they cooperate.

Heading hierarchy rules

One logical H1 per URL (default)

The H1 tag states the page's central topic. Marketing and editorial URLs should not compete with multiple H1s from sidebars, heroes, and article titles simultaneously.

Do not skip levels arbitrarily

Good:  H1 → H2 → H3 → H3 → H2
Risky: H1 → H4 (missing H2/H3 parent context)

Skipped levels confuse assistive technology heading rotors and SEO tools—not because Google forbids it in HTML, but because outline meaning breaks.

Headings introduce content

A heading tag followed immediately by another heading tag with no intervening copy is a structural bug unless the second heading opens a nested subsection with content below it.

Heading tags vs CSS headings

Anti-pattern:

<p class="text-3xl font-bold">Looks like H1</p>

Preferred:

<h1 class="text-3xl font-bold">Actual H1 topic</h1>

Design systems should expose semantic components (Heading level={2}) so editors cannot accidentally choose visual size over correct level.

Complete outline example

<main>
  <h1>Internal linking audit checklist</h1>
  <p>Introduction...</p>

  <h2>Prepare your crawl data</h2>
  <h3>Export server logs</h3>
  <h3>Configure crawl scope</h3>

  <h2>Analyze link equity</h2>
  <h3>Find orphan pages</h3>
  <h3>Map anchor text patterns</h3>

  <h2>Implement fixes</h2>
  <p>Conclusion...</p>
</main>

Heading tags and SEO signals

Search engines use heading tags to:

• Segment body copy into topical blocks
• Understand which phrases label sections vs body paragraphs
• Occasionally source SERP title text when title tags are missing or generic

They do not replace:

• Unique meta titles and meta descriptions
• Substantive content depth
• Internal linking and site architecture

Heading tags clarify; they do not substitute for quality.

Heading tags vs header element

Teams conflate heading tags with the header landmark (<header>). The header region often wraps site chrome—logo, navigation, utility search. The article's H1 usually lives in <main>, not in the global header repeated on every page.

See the header glossary page for chrome-specific guidance.

Heading tags in JavaScript apps

SPAs and hydrated components risk:

• Headings rendered only after client JS executes
• Route transitions leaving stale headings in DOM
• Component libraries outputting <div> instead of h* tags

Validate with rendered DOM crawls, not only view-source HTML.

Heading tags and featured snippets

Clear H2/H3 question headings with direct answers below can support snippet extraction. No markup guarantees placement. Patterns that help:

<h2>What is index bloat?</h2>
<p>Index bloat is when low-value URLs accumulate in Google's index...</p>

Common heading tag mistakes sitewide

Heading tag audit workflow

1. Crawl site with heading extraction per URL
2. Flag missing H1, multiple H1, skipped levels
3. Group by template (blog, PDP, docs)
4. Fix CMS components emitting wrong levels
5. Re-crawl after deploy; sample top traffic URLs manually

Heading tags by content type

Match depth to user needs—not every page earns a six-level tree. Fixing a heading component in the theme is often the highest-leverage on-site SEO win for heading health.

How Crawlox helps with heading tags

Crawlox extracts the full h1–h6 tree for every crawled URL, highlighting missing primaries, duplicate patterns, skipped levels, and sitewide widget headings that pollute outlines. Combine heading inventories with title and body analysis to fix template-level structure—not just one-off editorial tweaks.