HTML5, Google, and WCAG all converge on the same standard: one H1 per page. Multiple H1 tags create semantic confusion - Google cannot tell which one represents the main topic and disperses the relevance signal across all of them.
Why this matters
The H1 tag tells the algorithm "this is the main topic of the page". When a page has five H1s, the algorithm has to pick which one matters - usually it picks the first one in DOM order. If the first one is the logo H1 or a slider H1, the keyword you carefully crafted in your "real" content H1 is treated as just another H2.
DOM order does not always match visual order. With flexbox or grid order, the H1 that appears first in code can render last on screen - leading to a mismatch between what the user sees and what Google parses.
For accessibility, screen-reader users use the "jump to H1" shortcut to reach the main content. On a page with five H1s, they must page through all of them to find the right one - confusing and frustrating.
How to detect
Open the homepage in DevTools (F12), switch to Console, and paste document.querySelectorAll('h1').length. Anything greater than 1 indicates a problem. Then paste document.querySelectorAll('h1').forEach((h, i) => console.log(i, h.outerHTML)) to print each H1 and where it lives in the DOM.
Complementary check: install the Chrome extension HeadingsMap - it visualizes the heading hierarchy with color coding. Multiple H1s are flagged in red.
Third check: run the page through https://wave.webaim.org/ - the report includes "Multiple H1 headings" as an explicit accessibility error.
How to fix
Walk the H1 list from DevTools. Keep one - the H1 that describes the page's primary topic. Convert the rest to H2 (if they are meaningful section headings) or to lower levels (H3, H4) where appropriate.
To change in the block editor: open the page for editing, click the offending block, and change "Heading Level" from H1 to H2 in the right-hand sidebar.
Common culprits that emit unwanted H1s:
- Hero sliders - Slider Revolution, Smart Slider, MetaSlider typically default the slide headline to H1. Edit the slide and change the tag to H2.
- Page builders - in Elementor, Divi, Beaver Builder, Bricks, the Heading widget exposes an HTML Tag dropdown. Check every heading on the page.
- Commercial themes - some themes (Astra, GeneratePress, Kadence) wrap the site title or logo in H1 on every page. The theme settings usually have a "Site Title HTML Tag" option - change it to
divorp. - FAQ blocks or pricing tables - certain plugins emit an H1 per item. Inspect plugin settings.
After each fix, reload the page and re-run the DevTools count.
Common mistakes
First mistake: judging the H1 by visual size. CSS can make an H1 look small and a paragraph look huge, but Google reads HTML, not CSS. Trust the DOM, not the layout.
Second mistake: leaving the original hero H1 in place when adding a new content H1. Verify you removed the old one rather than just adding a new one alongside it.
Third mistake: hidden H1s. Themes sometimes inject an H1 with display: none or visibility: hidden - it is invisible to users but still part of the DOM, and Google still counts it. Inspect every H1 in the DOM, not just visible ones.
Fourth mistake: using H1 every time you want a big heading. Section headings should be H2 - rely on CSS for visual sizing rather than reaching for a stronger tag.
Verifying the fix
Re-run document.querySelectorAll('h1').length - it must return exactly 1. Run Lighthouse Audit and confirm SEO and Accessibility pass without heading-order warnings. Run wave.webaim.org and confirm there is no "Multiple H1 headings" alert. Re-run the RankPlus audit to verify the issue clears.