</>
ValidateHTML

Empty Heading Tags

Heading elements (<h1> through <h6>) define the document outline. An empty heading creates a gap in the page structure, confuses screen readers (which announce it as a heading with no content), and wastes SEO potential.

Find this error in your own code. Paste your HTML or enter a URL, free and instant.Open the validator
8.4%
of sites tested

How common is this error?

We ran this validator over the home page of the Tranco top 5,000 websites in August 2026. 222 of the 2,656 sites we could reach hit it. That makes it the 14th most common HTML problem we found, across 627 occurrences. See the full study.

Most frequent wording: <h3> cannot be empty, must have text content

Why It Matters

Empty headings confuse screen reader users who navigate by headings. Search engines use headings to understand page structure. Empty headings dilute your heading hierarchy. They typically result from headings styled with CSS background images instead of text.

Common Causes

  • Styling a heading with a CSS background image instead of putting text inside it.
  • Leaving a placeholder heading in the markup that was never filled in.
  • Using heading tags purely for spacing or visual rhythm.

Code Examples

Invalid
<h2 class="section-icon"></h2>
<h3></h3>
Valid
<h2 class="section-icon">Our Features</h2>
<!-- Or remove the heading entirely if it's decorative -->

How to Fix

  • 1Add meaningful text content to every heading element.
  • 2If the heading is purely decorative, remove the heading tag and use a <div> or <span> instead.
  • 3If using icon fonts or SVG in headings, include visible or screen-reader-only text.
  • 4Use aria-label as a last resort if you truly can't add visible text.

Frequently Asked Questions

Why is an empty heading a problem if users can't see it?
Screen-reader users navigate by jumping between headings. An empty one announces as a heading with no content, creating a confusing dead stop in the outline and wasting a structural landmark.
I use an icon in my heading. How do I keep it accessible?
Include text alongside the icon, or add visually hidden text with a screen-reader-only class. If the heading is purely decorative, use a <div> or <span> instead of a heading tag.
Does an empty heading hurt SEO?
It dilutes your heading hierarchy and gives search engines no text to associate with that section. It will not tank a page on its own, but it is a wasted ranking signal.

Check Your HTML Now

Our validator detects this error automatically and shows the exact line number.

Open HTML Validator

Related HTML Errors

Heading Level Skip

Skipping a heading level, like h1 to h3, breaks your document outline and hurts accessibility. Learn the correct heading hierarchy for SEO and screen readers.

Missing Alt Attribute on Images

A missing alt attribute is the top accessibility error and a lost SEO chance. Learn why every img needs alt text and how to write it well for screen readers.

Duplicate ID Attributes

A duplicate id breaks JavaScript, anchor links, and screen reader navigation. Learn how to find and fix duplicate id attributes in your HTML the right way.

← View all HTML errors