Skip to main content
SlapMyWeb

SEO fix

How to Fix a Missing H1 Tag

Give the page a single top-level heading that names its subject.

Difficulty
Easy
Impact
Medium
Time
15 min

Before

<div class="text-4xl font-bold">Website Audit Tool</div>

After

<h1 class="text-4xl font-bold">Website Audit Tool</h1>
Before and after code for: How to Fix a Missing H1 Tag

A missing h1 leaves the page with no top-level heading, so the document outline has no root and the strongest on-page hint about the subject is absent. The fix is one h1 naming what the page is about: styled however the design requires, since the tag carries the meaning and CSS carries the size.

Why it matters

Screen-reader users navigate by heading, and a page with no h1 gives them no starting point. It is also a signal search engines use, and it is free to provide.

How to fix it

  1. Confirm it is really missing

    Often a heading exists visually but is marked up as a div with large text, or as an h2 with no h1 above it.
  2. Write it as the page's subject

    It should describe this page, not the site. "Website audit tool", not the company name.
  3. Place it before the main content

    The h1 belongs at the top of the main content region, above the sections it introduces.
  4. Style it freely

    If the design calls for small text, use CSS. Do not choose a lower heading level to get a smaller size.

The code

Beforehtml
<div class="text-4xl font-bold">Website Audit Tool</div>
Afterhtml
<h1 class="text-4xl font-bold">Website Audit Tool</h1>

On your platform

WordPress

Some page builders render the title as a styled div. Check the front end rather than the editor.

Next.js

If a shared layout renders the h1, per-page headings become h2s and every page gets the same top-level heading.

Sources

Fixed that one.
Now find the rest.

A free audit ranks every issue on your site by the score points it costs, and links each one straight to its guide.

Run a free audit
Free foreverNo signupLive scan progress