Reduce multiple H1 tags to a single H1

Multiple <h1> tags on the same page tell search engines "this page is about several things equally important." It usually happens when a developer reuses a header component, or when a CMS theme wraps the logo AND the headline in <h1>. Pages should have exactly one H1, the headline that describes the page topic.

When Google sees three H1s, it cannot tell which one represents your actual topic, so it falls back to weaker signals like body text. Pages with one focused H1 consistently rank better for that topic. Cleaning this up is a 10-minute fix that often moves rankings within a single re-crawl.

1. 1

   Find every H1 on the page

   In Chrome DevTools, open the Console and run the snippet below to list every H1 and its text content.

   document.querySelectorAll('h1').forEach((el, i) => {
     console.log(i + 1, el.textContent.trim());
   });

2. 2

   Pick the ONE that should stay

   The H1 that survives should be the hero headline describing the page topic. Demote the others to <h2> (or <p>+CSS if it was never really a heading, like a logo wordmark).

3. 3

   Demote the extras

   Edit the template / component so only the hero is an <h1>. Common offenders: logo wrapped in <h1>, every blog card on a listing page using <h1> for the post title (should be <h2> or <h3>), repeated hero sections from old A/B tests.

   <!-- BEFORE: two H1s -->
   <h1>Apex Car Service</h1>
   <h1>Airport Car Service in Austin</h1>
   
   <!-- AFTER: one H1, brand demoted to a logo div -->
   <div class="logo" aria-label="Apex Car Service">Apex Car Service</div>
   <h1>Airport Car Service in Austin</h1>

4. 4

   Update your template, not just one page

   If the duplicate H1 comes from a shared layout (header, hero block, blog card), fix the template so the change propagates to every page using that component.

Re-run the DevTools console snippet, it should log exactly one entry. Re-run the Drive Top-Line audit; the H1 suggestion should clear.

• Google: Using multiple H1s