Warningcontent.h1

The page has no main heading

Why it matters

The <h1> is the page's headline: the first thing a screen-reader user jumps to, and one of the places Google looks when it writes the title link for a search result ("the main visual title shown on the page", "heading elements, such as <h1> elements"). A page without one leaves both to guess what it is about. Headings that are only styled text (<div class="title">) don't count: the tag is what carries the meaning.

More than one <h1> is allowed by HTML and Google has said it copes, so that is only a notice: it usually means the logo or a sidebar widget is marked up as the headline, which muddies the outline for screen readers.

Source: Influencing your title links in search results.

How to fix it

Mark the visible headline of the page up as the one <h1>, and use <h2> downwards for the sections under it:

<h1>Wedding cakes in Leeds</h1>

If the theme wraps the logo in an <h1> on every page, change that to a <div> or <p> on all but the home page.

Examples

These are the rule's own test pages, and what it says about each. They are run on every change to the rule book.

<h1>
<img src="/logo.png">
</h1>

WarningThe <h1> has no text in it (an image without alt text, perhaps), so it tells nobody anything.

fail-empty
<div class="h1">Wedding cakes</div>
<h2>Flavours</h2>

WarningThe page has no <h1>, so search engines and screen readers have no headline to go on.

fail-none
<h1>Flour &amp; Co</h1>
<h1>Wedding cakes</h1>
<aside>
<h1>Newsletter</h1>
</aside>

NoticeThe page has 3 <h1> headings. It is allowed, but one headline is clearer; check the logo or a widget isn't marked up as one.

fail-three
<h1>Wedding <em>cakes</em> in Leeds</h1>
<h2>Flavours</h2>

PassedThe page has one main heading: "Wedding cakes in Leeds".

pass-one