Heading Tags H1–H6: The Complete Guide to SEO Structure and Accessibility
Heading tags, the H1 through H6 elements, are among the most powerful on-page SEO signals you have direct control over. Yet most websites get them wrong: duplicate H1s, skipped levels, vague descriptions, or no H1 at all. This guide breaks down exactly how to structure your headings for maximum SEO impact, better readability, and improved accessibility.
What Are Heading Tags and Why Do They Matter for SEO?
Heading tags are HTML elements, ranging from <h1> through <h6>, that define the hierarchical structure of your page content. H1 is the top-level heading (usually the page title), H2s are major sections, H3s are subsections of those sections, and so on.
From an SEO perspective, headings do three critical jobs:
- Signal topic relevance: Google reads heading text to understand what each section of your page covers.
- Establish page hierarchy: A clear H1 → H2 → H3 structure helps crawlers build a mental model of your content architecture.
- Enable featured snippets: Well-structured headings increase the chance Google will extract your content for answer boxes, people-also-ask results, and table-of-contents snippets.
Key Insight
Pages with a single clear H1 and a logical H2 to H3 hierarchy are significantly more likely to rank in the top 3 positions than pages with unstructured or missing headings, according to multiple SEO correlation studies.
The H1 Tag: Your Most Important Heading
The H1 is the single most important heading on your page. Think of it as the title of a book: it tells both readers and search engines exactly what the page is about. Best practice rules for H1 tags:
✓ Good H1
How to Convert Images to Base64: Complete Guide✗ Vague H1
Welcome to Our Site✗ Multiple H1s
Having two or more H1 tags dilutes the primary topic signalH1 Rules
- Use exactly one H1 per page, no more and no less.
- Include your primary keyword naturally in the H1 text.
- Keep it under 60 to 70 characters for clarity.
- Make it unique across your site, so every page has a distinct H1.
- The H1 should match (or closely mirror) the page's meta title for consistency.
H2 Tags: Your Section Landmarks
H2 tags divide your page into major sections. They are the chapter headings of your content. Each H2 should represent a distinct sub-topic that supports the H1 theme. Think of them as the answers to questions your target audience is likely to ask.
H2 tags also play a key role in People Also Ask (PAA) results. When Google sees a clear question-style H2 followed by a concise answer, it often extracts that content for PAA boxes, driving additional zero-click and click traffic to your page.
Example of a Good H2 Structure for a page about "Image Compression":
- H1: How to Compress Images Without Losing Quality
- H2: Why Image Compression Matters for Website Speed
- H2: Lossy vs. Lossless Compression Explained
- H3: When to Use Lossy Compression
- H3: When to Use Lossless Compression
- H2: Best Image Formats for the Web
- H2: How to Compress Images in Bulk
H3 to H6: Subsection Detail
H3 tags are subsections within H2 sections. H4 to H6 are used for progressively deeper nesting. In practice, most pages only need H1, H2, and H3. H4 to H6 are appropriate for long-form technical documentation, glossaries, or reference materials.
The most common heading mistake beyond the H1 problem is skipping levels, meaning jumping from H2 directly to H4, for example. This is analogous to writing a book outline that skips from chapter headings directly to sub-sub-sections with no intermediate structure.
The 5 Most Common Heading Mistakes
No H1 Tag
The page has no H1. Search engines have no clear signal about the page's primary topic. Fix: Add a descriptive, keyword-rich H1 as the first heading on the page.
Multiple H1 Tags
Often caused by CMSs or themes that automatically wrap both the site name and the post title in H1 tags. Fix: Ensure only the post/page title uses H1; use a <p> or styled div for the site name.
Skipped Heading Levels
Going H2 → H4 or H1 → H3 breaks the document outline. Fix: Never skip a level; always nest one level at a time.
Headings That Match Exactly
Using the same text for H1 and the meta title is fine, but repeating the same heading text throughout the page (e.g., three H2s all reading 'Introduction') confuses crawlers. Fix: Each heading should be unique and descriptive.
Styling Divs as Headings
Using CSS to make a <div> look like a heading is invisible to screen readers and search engines. Fix: Use actual H1 to H6 elements, styled with CSS if needed.
Heading Structure and Accessibility
Good heading structure is not just an SEO concern; it is a WCAG accessibility requirement. Screen reader users rely on heading tags to navigate long pages. When a user activates their screen reader's "heading navigation" mode, they jump from heading to heading to find the section they want, exactly like a table of contents.
WCAG 2.1 Success Criterion 1.3.1 (Info and Relationships) requires that the structure conveyed visually be programmatically determinable, meaning a visually larger heading must actually be an H1, not just a large, bold div.
Accessibility Tip
Use your browser's accessibility tree or a tool like axe to verify that your heading structure makes sense when read linearly, without seeing the visual design.
How to Audit Your Heading Structure
There are several ways to inspect the heading structure of any web page:
- Browser DevTools: Open DevTools → Elements, search for <h1> to find all heading tags.
- View Page Source: Ctrl+U (or Cmd+U on Mac), then Ctrl+F to search for <h.
- Heading Tag Analyzer: Use our free Heading Tag Analyzer to paste your HTML and get an instant visual tree with an SEO score and issue list.
- Screaming Frog: For bulk site audits, Screaming Frog's SEO Spider can export heading data for every URL on your site.
Quick Checklist Before Publishing
Analyze Your Page Now
Use our free Heading Tag Analyzer to check your page's H1 to H6 structure, get an SEO score, and see a visual heading tree with issue highlights.
Open Heading Tag Analyzer →Headings are just one piece of on-page SEO. For a full picture of how your page stacks up, including title tags, meta descriptions, images, links, and schema markup, run it through our On-Page SEO Checker to get a comprehensive 0-100 score with specific fix recommendations.