Multiple H1 Tags: Causes, SEO Impact, and How to Fix Them

Multiple H1 tags can be easy to miss during a visual review. A page may look organized, with one obvious headline and several section titles, while the underlying HTML marks more than one element as the main heading. In a crawl of 265 HTML pages, 212 were flagged for multiple H1 headings. The audit classified the issue as low impact and low effort, but the count points to a practical cleanup opportunity: review the shared page templates, identify which headings are doing the same job, and keep the heading structure clear.

What are multiple H1 tags?

For example, a page might have its title marked up as an H1, but also use H1 for a hero tagline, a promotional banner, or a second heading farther down the page. The visible design may make those elements look like separate components. In the document structure, however, each H1 is presented as a top-level heading.

A straightforward hierarchy usually looks like this:

<h1>Technical SEO Audit Checklist</h1>

<h2>Crawlability</h2>
  <h3>Robots.txt</h3>
  <h3>XML sitemaps</h3>

<h2>Indexability</h2>
  <h3>Canonical tags</h3>

The H1 states the central subject. The H2s divide the page into main sections, and the H3s organize detail within those sections. This is not a rule that every page must have exactly one H1 to be valid HTML. It is a useful editorial and technical convention because it makes the page easier to scan, maintain, and inspect.

Do multiple H1 tags hurt SEO?

There are a few practical reasons to tidy up the markup:

• Clearer page structure. A single, descriptive H1 makes the main topic easy to identify. Secondary headings can then describe the sections without competing to be the page's primary heading.
• More predictable templates. Shared components sometimes insert headings without considering the page's existing title. Cleaning up the template helps keep the structure consistent across many URLs.
• Better accessibility and navigation. Screen reader users can navigate by headings. A logical hierarchy gives them a clearer outline of the page's content and how its sections relate.
• Easier maintenance. When heading levels are assigned by purpose, developers and editors are less likely to change heading tags just to adjust font size or visual weight.

The key is to fix the underlying structure rather than changing tags simply to satisfy a count. If a page genuinely contains multiple distinct sections, those sections can still have headings. They usually just do not all need to be H1.

What does a multiple H1 issue look like in a site audit?

A crawl of 265 HTML pages flagged 212 URLs for multiple H1 headings. The report categorized the finding under On-Page SEO and labeled it an Opportunity. Its assessment was low impact and low effort, and its recommended action was to use a single H1 while structuring remaining sections with H2 and H3.

The affected URL list includes a range of page types, so the count should not be treated as proof that 212 pages each need an individual content edit. A repeated issue across many URLs can indicate that a shared component or template is outputting an extra H1.

For example, the audit evidence included the homepage with two H1 tags. That does not by itself reveal which element should be changed. The next step is to inspect the page's markup, identify each H1, and determine which one communicates the page's primary topic.

What causes multiple H1 tags?

Extra H1 elements commonly come from shared design components, duplicated title output, or heading tags chosen for appearance. These are the areas worth checking first.

The page title and hero headline are both H1

A template may display the page title and a large hero message as separate components. If both components are configured as H1, the page ends up with multiple top-level headings. Check whether the hero message is a second expression of the same topic or a supporting statement that would work better as paragraph text.

A shared header or logo uses an H1 on every page

Some themes wrap the site logo or brand name in an H1. If that header appears across the whole website, every page using it may inherit an extra H1 alongside its own page title. The logo can remain visually prominent without being marked as the page's main heading.

Desktop and mobile versions both output a heading

Responsive designs sometimes include separate desktop and mobile headline elements. Hiding one with CSS does not remove it from the HTML. If both versions use H1, a crawler may count both even though visitors see only one at a time. Consider using one semantic heading and adapting its layout with CSS, or ensure the alternate version does not create a duplicate top-level heading.

A reusable widget has a fixed H1 setting

Page builders and content management systems often let editors select a heading level for each widget. A reusable banner, callout, or card component may have been set to H1 and then placed on pages that already have a main title. Review the widget settings and how the component is used across templates.

Headings were selected for visual styling

Developers or editors may choose H1 because it produces a large font, or choose H2/H3 based on the size they want. Heading tags describe document structure, not visual scale. Use CSS classes to control font size, spacing, and weight while choosing the HTML heading level based on the content hierarchy.

A redesign introduced a second title element

During a redesign, an old title component may remain in the template while a new hero section is added. Both may output H1. Compare the current markup with the previous template or inspect the page builder's layout to find duplicate title blocks.

How do you find multiple H1 tags?

For an individual page, open the browser developer tools and run this in the console:

[...document.querySelectorAll('h1')].map(h => h.textContent.trim())

The result is an array of the text inside each H1. If the array contains two or more entries, the page has multiple H1 elements in the rendered DOM. Check the returned text to identify whether the extra headings come from a logo, hero section, duplicated title, or another component.

You can also count the elements directly:

document.querySelectorAll('h1').length

For a whole site, use a crawler to collect heading data across URLs. Open the heading issue filter and review the affected pages. Then group the URLs by path, page type, or template. If the same type of page repeatedly has multiple H1s, inspect the shared template before making individual edits.

When a crawler and the browser show different counts, check whether the heading is injected or changed by JavaScript. Compare the raw HTML response with the rendered DOM, and make sure the crawler's rendering settings match the way the page is delivered to users.

How do you fix multiple H1 tags?

Start by checking every H1 on an affected page

Do not change the first H1 automatically without checking its content and role. List the H1 text, locate each element in the page layout, and decide which one states the page's central subject. The correct choice depends on the page, not merely on which heading appears first in the HTML.

Change supporting section headings to H2 or H3

If a heading introduces a major section, H2 is usually the appropriate level under the page's H1. If it introduces a subsection within an H2 section, use H3. Do not skip heading levels just to get a preferred font size.

<!-- Before: all three are top-level headings -->
<h1>Technical SEO Audit Checklist</h1>
<h1>Crawlability</h1>
<h1>Indexability</h1>

<!-- After: one main heading and supporting sections -->
<h1>Technical SEO Audit Checklist</h1>
<h2>Crawlability</h2>
<h2>Indexability</h2>

Keep decorative text out of the heading hierarchy

A slogan, button label, eyebrow text, or short promotional phrase may not need to be a heading at all. Use a paragraph, span, or other suitable element and style it with CSS. This prevents decorative interface text from being interpreted as part of the page outline.

Update the shared template or reusable component

If many affected pages use the same template, correct the source component rather than editing every URL. Check the theme builder's heading-level settings, reusable blocks, global header, hero component, and page title output. After changing a shared component, inspect several representative page types to make sure the fix does not remove a needed heading elsewhere.

Preserve the visual design with CSS

Changing an H1 to an H2 does not have to make the text smaller. Apply a class to control its appearance independently from its semantic level:

<h2 class="hero-heading">A clearer way to manage your audit</h2>

<style>
.hero-heading {
  font-size: 2.5rem;
  line-height: 1.15;
  font-weight: 700;
}
</style>

That keeps the intended design while giving the document a more meaningful heading structure.

Re-crawl and review the affected pages

After making changes, run another crawl and check the multiple H1 filter. Confirm that the count has decreased and inspect any remaining URLs. A residual issue may come from a page-specific layout, a cached template, or a component that was not included in the original fix.

Multiple H1 vs. missing H1 vs. duplicate H1

These findings all concern page headings, but they describe different conditions and require different checks.

One page can have more than one of these problems, so check the actual markup rather than assuming one issue explains every heading warning. For example, a site-wide logo could create multiple H1s on some templates, while a separate archive template could have no H1 at all.

What is the best workflow for fixing multiple H1 tags?

Use a repeatable process that moves from the site-wide pattern to the individual markup, then verifies the result.

What makes a good H1 tag?

Once the structure is corrected, make sure the remaining H1 is useful to the person reading the page.

• State the page's main topic. The H1 should describe the subject of the page, not merely repeat a generic label such as “Home” or “Services” when a more specific heading is appropriate.
• Be clear and natural. Use the main phrase where it fits, but avoid awkward keyword repetition or a string of search terms.
• Match the page's purpose. A product page, article, category archive, and contact page serve different needs. Their H1s should reflect those differences.
• Work with the title tag. The title tag and H1 should describe the same page topic and search intent, though they do not have to use identical wording.
• Support a logical outline. Follow the H1 with H2 sections and use H3 for subsections where appropriate. Choose levels based on structure, not font size.

Multiple H1 tags at a glance

The main points: what the issue means, what the audit found, and the steps to address it.

Frequently asked questions