Heading tags

Heading tags are the HTML elements h1 to h6. Use one h1 for the page title, h2 for sections, and h3 within those sections. Only go deeper when the content needs it.

Google uses headings to understand a page’s structure and topics, but as of 2026 they are not a strong ranking factor. Several h1s will not break indexing, though one h1 is the convention and reads better.

Screen readers let people jump by heading. Keep levels in order and do not skip from h1 to h3. Headings that match common questions help featured snippets and AI answers quote that section.

<h1>Pricing</h1>
<p>Simple plans for teams.</p>
<h2>Monthly plans</h2>
<h3>Starter</h3>
<h3>Pro</h3>
<h2>Annual plans</h2>

You have few pages and little time. Clear headings help users scan, cut bounce, and make support pages easier to use. Good headings also make it clearer what each page is for, so you avoid intent mismatch and keyword cannibalisation across similar pages.

On a help page like "/guides/getting-started", an h1 that states the task and h2s that match the steps reduce support tickets. On "/pricing", h2s that match plans cut confusion and make internal links clearer, for example a link with anchor text "See Pro features" that jumps to the h3 Pro section.

1. 1

   Pick the h1

   Make it the page title users expect. Example on "/guides/getting-started": h1 "Getting started with YourProduct".

2. 2

   Map h2 sections

   List the main sections. Turn them into h2s. Example: "Install", "Connect data", "First dashboard".

3. 3

   Nest h3 only when needed

   Use h3 inside a section when there are subtopics. Do not jump from h2 to h4.

4. 4

   Phrase questions where helpful

   Use h2 like "How does billing work?" on "/pricing". This can earn a featured snippet or an AI quote when your answer sits right under it.

5. 5

   Check the outline in the browser

   Right click, Inspect, search for <h1>, <h2>, <h3>. Or use your CMS preview to view source and scan the heading order.

6. 6

   Fix styling-only misuse

   Do not use headings to make text big. Use CSS classes on <p> or <div>. Reserve h1 to h6 for the document outline.

A fixed page reads cleanly in the outline: one h1 that matches the title tag, logical h2s for sections, optional h3s, and no skipped levels.

Match how people ask. On a FAQ page, use h2s like "What is your refund policy?" and "How do I cancel?" Keep the answer in the next paragraph. Short, direct, no fluff.

For a blog post targeting "heading tag html", start with h1 "Heading tag HTML: H1 to H6 explained". Follow with h2s "What are H1 to H6", "How Google uses headings", and "Examples". This signals relevance without stuffing keywords.

• Multiple h1s used for styling. Fix by keeping one h1 and moving others to h2 with CSS for size.
• Empty headings generated by the CMS. Remove or convert them to <p>.
• Skipping levels, for example h1 to h3. Insert the missing level or lower the deeper one.
• Using <header> as a heading. <header> is a container, still put an h1 or h2 inside.
• Keywords stuffed into every heading. Write for scanning first, add key terms only where they help understanding.
• Accordion components that hide h2s by default. Ensure collapsed headings still use real h2, not buttons without roles.

Test with a screen reader shortcut list of headings. If the list is confusing, fix the HTML, not just the CSS.