Skip to main content
All website issues
Ease of Use

Heading structure is out of order

What this means for your business

Headings on your page skip levels (like jumping from a main heading straight to a small sub-heading). This disrupts the logical structure that screen readers and assistive tools use to help people navigate your content.

How to fix it
Easy
20–30 minutes

  1. 1Headings should follow a logical hierarchy: H1 (page title) → H2 (major sections) → H3 (subsections). Never skip levels — don't jump from H1 to H3.
  2. 2Each page should have exactly one H1 — this is your main page title.
  3. 3Check your page using the free WAVE browser extension (wave.webaim.org) — it shows your heading structure clearly so you can spot where the order breaks.
  4. 4Don't choose heading levels for their visual size — use CSS to style headings instead. H2 should be H2 because it's a major section heading, not because you like how it looks.
  5. 5In your HTML/CMS, change <h3> tags that appear after <h1> (skipping H2) to <h2>, and adjust CSS if needed to maintain visual appearance.

On WordPress

In the Gutenberg editor, you can see and change heading levels directly in the block toolbar. Yoast SEO's content analysis will flag heading structure issues. Review all heading blocks and ensure they follow the hierarchy.

On Shopify

Review your page and product templates in the theme code. Check that product titles use H1, section headings use H2, and sub-headings use H3. Page builder sections often default to the wrong heading level.

Does your site have this problem?

SiteSprout scans your site, tells you which issues you actually have in plain English, and keeps watch so nothing breaks silently.

Scan your site free