Epic Creative
LibraryInsightsAbout
Search/
© 2026 Epic Creative
AboutLibraryInsights
Digital & SEO

How to Structure H1, H2 and H3 Headings Clearly

Use H1, H2 and H3 headings to create a clear document outline for readers and assistive technology, while keeping SEO claims proportionate and keywords natural.

19 Aug 20267 min read1,486 words
In this guide
  1. Start with the page's principal purpose
  2. Use H2 headings to organise major decisions
  3. Use H3 only when a subsection genuinely belongs inside H2
  4. Make semantic headings accessible
  5. Distinguish headings from decorative slogans
  6. Consider headings within reusable components
  7. Avoid inventing an SEO penalty for multiple H1 elements
  8. Align headings with genuine search intent
  9. Check the live page on narrow screens
  10. Review headings whenever the content changes
  11. Choose an outline that helps people act
  12. H1, H2 or H3: which heading should describe this information?
  13. Five questions about H1, H2 and H3

HTML headings give a website an understandable structure. The H1 identifies the principal subject of a page, while H2 and H3 headings divide that subject into useful sections and smaller related explanations. They help readers scan a long document, support assistive-technology navigation and clarify the relationships between different ideas. But heading elements are not a secret keyword formula that can guarantee a particular Google ranking. Their value depends on whether the content beneath each heading genuinely answers the question implied by its wording.

Conceptual diagram of connected web documents, illustrating why individual pages need clear identity and accessible navigation
Hyperlink diagram by L1ucas, based on Andreariverac, Wikimedia Commons original and author record, CC BY-SA 3.0 Unported, unchanged. This is a conceptual page-navigation illustration rather than a screenshot of heading semantics.

Start with the page's principal purpose

Before assigning heading levels, write a clear statement of what the page is meant to help the visitor accomplish. A service page might explain how a particular maintenance service works, while an informational page might teach how canonical URLs are evaluated. If the draft tries to answer several unrelated questions, the problem may be its content scope rather than its heading hierarchy. A useful H1 names the central subject directly, without making unsupported claims or listing every related search keyword.

The document title and H1 should support the same purpose, although they need not be identical. The HTML title appears in the document head, while the H1 appears in the body. Google may consider prominent page text when generating title links, but exact wording in either element cannot force a particular result. Check that the live title, H1 and opening paragraph genuinely agree.

Use H2 headings to organise major decisions

H2 sections should divide the main subject into meaningful parts. A guide about an SEO migration might use sections for inventory, redirect mapping, launch testing and subsequent monitoring. Those are distinct tasks. A service page might use sections for eligibility, process, exclusions and contact. This makes the document navigable because each heading tells the reader what question the following content will answer.

Do not choose headings solely from an automated list of keyword suggestions. Several near-identical headings can make an article longer without making it clearer. If two sections substantially repeat one another, consider merging them. The right number of headings depends on the underlying explanation. A short complete answer may need very few sections, while a technical diagnostic article can reasonably require many.

Use H3 only when a subsection genuinely belongs inside H2

An H3 is useful for subordinate information. An H2 about launch verification might contain H3 subsections on canonical signals, mobile forms and sitemap checks. Each is a part of the larger verification topic. Avoid placing an H3 directly after an H1 merely because its default font size looks attractive. Heading levels communicate structure, while CSS should control appearance.

When a heading structure becomes difficult to follow, inspect the document outline as a reader would. Can someone navigate through the sections and understand their relationships without reading every paragraph? If not, the article may need reorganisation. A nested section should not introduce a completely unrelated subject, and a major independent question should not be buried under a subordinate label simply to satisfy a visual design.

Make semantic headings accessible

People using screen readers often navigate by headings. Meaningful levels and descriptive wording help them locate the information they need. A visually bold paragraph is not necessarily a heading in the accessibility tree. The W3C Web Accessibility Initiative headings tutorial explains how semantic hierarchy contributes to understandable page structure.

Check the actual rendered HTML rather than relying on the appearance of a content management system preview. A template may insert an extra H1 above the article, or a component may render an H3 where the content editor expected an H2. These implementation issues require template-level corrections. Do not make heading structures intentionally confusing just to imitate a competitor's design.

Distinguish headings from decorative slogans

Large hero statements, badges and promotional phrases can be styled prominently without being the correct semantic heading. The main heading should still identify the real document. For example, 'Better results tomorrow' may be an advertising slogan, whereas 'Managed Website Maintenance for Small Businesses' actually describes a service. The page can display both, but a slogan should not displace the information a visitor needs to orient themselves.

Use typography and spacing to create visual hierarchy around genuine semantic structure. Headings need not be the biggest text on the screen, but their levels should reflect how the content is organised. Review designs on small screens, where large slogans can push meaningful information too far down the page or become clipped.

Consider headings within reusable components

Modern websites often assemble pages from hero sections, cards, feature lists, accordions and related-content blocks. A shared component can accidentally place the same heading level on every page regardless of context. An FAQ component that always produces H2 headings may break the structure when nested inside another section. Developers should provide a clear semantic contract for reusable components.

Audit the final heading sequence on representative page types. A homepage, service page and long article may use different structures. When a component is changed centrally, test the different contexts in which it appears. The most effective fix is often an adjustment to the shared template rather than hand-editing every article record.

Avoid inventing an SEO penalty for multiple H1 elements

A site audit may flag multiple H1 elements, but that finding is not automatically proof of a Google penalty. The more useful question is whether the page has one coherent principal subject and a readable semantic structure. Multiple major headings may occur in certain legitimate document patterns, but careless use can confuse readers and assistive-technology navigation. Assess the actual markup, document design and page purpose before prescribing a fix.

Google's SEO Starter Guide encourages understandable organisation without promising a fixed ranking bonus for a heading count. Treat headings as a content and accessibility decision, not a mathematical optimisation rule. If a site generates duplicate H1 elements by accident, correcting the template improves clarity even when a precise ranking effect cannot be measured.

Align headings with genuine search intent

Search intent describes what a person wants to accomplish. A guide answering 'what is a robots meta directive?' needs explanatory headings, while a troubleshooting article should include diagnosis and verification. A service page must clarify scope and next steps. Repeating the same phrase in headings throughout all three pages does not make them equally useful. The headings should signal the distinct work each destination performs.

Review the questions customers ask and compare them with the page sections. If a meaningful question has no answer, add an appropriate section with substantive detail. If a proposed heading would merely introduce another generic paragraph, reconsider it. A heading promises information; the paragraphs that follow must deliver that promise.

Check the live page on narrow screens

Long technical headings can wrap awkwardly at 320 or 375 pixels. They should remain fully visible, readable and operable without forcing horizontal scrolling. CSS should allow natural wrapping and appropriate spacing. If a sticky navigation bar overlaps an anchor destination, adjust the offset rather than removing the heading or hiding content. Compare tablet and desktop layouts as well.

Keyboard users should be able to reach anchor links and related navigation. Screen-reader checks should reveal an understandable hierarchy, not a collection of unrelated levels. Tables, images and forms within sections need their own accessibility tests. Passing an automated heading check does not certify the complete page experience.

Review headings whenever the content changes

Article updates can make existing headings misleading. A service may have changed eligibility, or a guide may now contain procedures its original heading did not anticipate. At publication, compare the title, H1, H2 outline and actual paragraphs as a whole. Keep meaningful sources attached to the claims they support. A date change without a substantive content review does not make an obsolete guide accurate.

Record the editor responsible for the review and the public URL tested. A CMS update is only proof that content was saved; the production renderer may still serve an older version. If a frontend exposes internal editorial notes, treat that as a separate confidentiality defect. Correct the appropriate template rather than publishing internal review material as a substitute for proper source attribution.

Choose an outline that helps people act

The best heading structure allows a visitor to understand the subject and locate the section needed for their next decision. Start with a specific H1, group major concepts beneath H2 headings, and use H3 for real subordinate explanations. Remove repeated keywords and decorative pseudo-headings where they obscure meaning. Verify the semantic output with available accessibility tools and public browser checks.

Headings improve organisation and usability when their labels are accurate and their hierarchy is coherent. They cannot guarantee search position, but they make good content easier for people to consume and maintain. Treat the outline as a reader-focused part of editorial quality rather than a quota to be satisfied by an SEO plugin.

H1, H2 or H3: which heading should describe this information?

Select heading levels according to the relationship between concepts, not their visual size or an invented SEO weighting.

Five heading decisions for accessible web documents
CriterionH1 / main document subjectH2 and H3 / supporting structure
RoleIdentify the page's principal purposeDivide major sections and subordinate explanations
Common useService or guide nameProcess stages, decisions and their specific details
Key failureGeneric slogan or mismatch with page contentSkipped levels or repeated keyword-only sections
Accessibility checkClear document orientationLogical screen-reader heading navigation
AcceptanceMatches title and core page answerMatches content and relationship of each section

Source A: W3C WAI headings tutorial (semantic page navigation, checked 31 October 2026). Source B: MDN heading elements (HTML semantics, checked 31 October 2026). Both explain structure, not a guaranteed SEO ranking coefficient. Decision: prioritise understandable hierarchy and accurate content over keyword repetition and visual heading size.

Five questions about H1, H2 and H3

Should every important page have a clear H1?

A main heading is a useful orientation point and should describe the page's actual subject, not merely a promotional slogan.

Are H2 and H3 ranking formulas?

No. They structure information and support navigation; no fixed Google bonus is guaranteed for a heading level.

Must the H1 match the HTML title exactly?

No. Natural wording can differ, provided both identify the same real subject.

Should an H3 be used only because it looks smaller?

No. Choose semantic levels according to nesting and use CSS for visual appearance.

How should headings be checked after publication?

Inspect actual public markup, screen-reader navigation and mobile wrapping, alongside the sections' factual accuracy.

PreviousUse Google Search Console to Find SEO IssuesNextViewport Meta Tag: Responsive Website Guide

More from Digital & SEO

View all →
3 min read

How to Prioritise SEO Content Refreshes for Small Business Sites

8 min read

How Small SEO Agencies Can Triage Technical Audit Findings

8 min read

A Practical Keyword Mapping Review for Small SEO Agencies

7 min read

A Practical Local SEO Client Intake Process for Small Agencies