PLAINFINCH learn by building

Headings and structure

You will fix the headings on a page so both readers and crawlers can see what each part is about.

What are headings for?

Headings are the signposts inside a page. HTML has six levels, <h1> to <h6>. The <h1> names what the whole page is about, <h2> elements name its main parts, and <h3> elements break those parts down further. Few small pages need more than three levels.

People use headings to scan. Someone opening the bird club's walks page wants to know the meeting place and time, and a clear Where to meet heading lets them find it in a second. Screen reader users do the same thing with a keyboard shortcut that lists every heading on the page, so the outline needs to make sense on its own.

Search engines read headings for the same reason. They help a search engine understand what each part of a page covers, which helps it match a search to the section that answers it.

Do headings affect where a page ranks?

Headings are one of the ways a search engine works out what a page is about, which affects which searches it might be relevant to. Google's own advice describes headings as a way to help both people and search engines see the structure of a page. Nobody outside Google can say how much weight a heading carries, and no single heading change moves a page to a particular position.

What a clear heading does reliably is make the page easier to read. A visitor who lands from a search and sees Guided bird walks by the river at the top knows at once they are in the right place. A visitor who sees Welcome has to read on to find out.

The lab does not rank pages. It checks the parts of heading structure you can verify: whether each indexed page has an <h1>, what it says, and whether levels are skipped.

What should the h1 say?

The <h1> should name the topic of the page in plain words, the way a visitor would describe it. On the walks page that is the guided walks; on the events page it is this winter's events and talks. It often echoes the <title>, without the site name tacked on the end.

Avoid headings that could sit on any page, such as Welcome, Home or Introduction. Avoid using the site's name as the <h1> on every page as well. The club's name belongs on the home page and in the header; inner pages should say what they hold.

The <h1> is also a fallback for the title link. When a page's <title> is missing or generic, search engines often build the title link from the main heading instead. The lab does the same.

<main>
  <h1>Guided bird walks by the river</h1>
  <h2>Saturday morning walk</h2>
  <h3>Where to meet</h3>
  <h2>Sunday family walk</h2>
</main>

Can a page have more than one h1?

Yes. Google has said several times that more than one <h1> on a page is not a problem for search, and pages with several are indexed and shown like any other. HTML allows it too.

One <h1> per page is still the easiest pattern to follow. It forces you to decide what the page is about, and it gives screen reader users a single clear starting point. If you find yourself wanting two, it is often a sign that the page covers two topics and could be two pages.

The lab follows the same view. It warns when a page has no <h1> at all and never when it has more than one.

Why should heading levels not skip?

Heading levels describe nesting. An <h3> is a part of the <h2> above it. Jumping from <h2> straight to <h4> leaves a gap in that outline, and someone listening to the headings with a screen reader may wonder what they missed.

Search engines cope with skipped levels without trouble, and Google has said the order of headings is not something to worry about for search. The lab reports a skip as a note for that reason, on accessibility grounds. Fixing it takes a minute, and the people who rely on the outline are real visitors.

Skips usually happen because someone picked a heading level for its size. The fix is to choose the level by position in the outline and set the size with CSS. Going back up is fine: after an <h3>, the next section can start with an <h2> again.

FigureTwo outlines of the walks page. Before: Riverside Bird Club is a big paragraph, so the page has no h1, and Where to meet is an h4 straight under an h2, leaving a gap at level 3. After: the h1 says Guided bird walks by the river, two h2 sections follow, and Where to meet is an h3 inside the Saturday walk.Two outlines of the walks page. Before: Riverside Bird Club is a big paragraph, so the page has no h1, and Where to meet is an h4 straight under an h2, leaving a gap at level 3. After: the h1 says Guided bird walks by the river, two h2 sections follow, and Where to meet is an h3 inside the Saturday walk.
Headings form an outline. The fixed walks page has one h1 that names the topic, and each level sits directly under the one above it.

What counts as a heading to a crawler?

Only the six heading elements. A paragraph with a big font, a <div> with a class called title, or bold text on a line of its own may look like headings in the browser, but a crawler reads them as ordinary text. The same is true of headings drawn inside an image.

Check this with View Source or the browser's developer tools, where you can see the element behind each line. In the lab, Inspect lists how many <h1> elements the crawler read on a page, and the Checks view lists missing main headings.

The reverse mistake happens too. Some page builders wrap the logo, the menu or a footer label in heading elements to get a particular style, which fills the outline with headings that describe nothing. Keep heading elements for the real sections of the content.

How do headings help a page answer searches?

A search engine tries to match a search to the part of a page that answers it. A section with a heading that names its subject, such as Where to meet or How to add a sighting, gives that section a clear label. Google sometimes links straight to a passage within a long page and highlights it when someone follows the result.

Write headings as the questions or topics a visitor brings to the page. If people ask what to bring on a walk, a section headed What to bring answers them in a way a heading like Info never could. Heading text with a vague label and the real answer hidden in paragraph four helps nobody.

Keep headings honest. A heading that promises something the section does not deliver frustrates readers, whatever it does for search.

What do AI tools get wrong about headings?

AI tools often treat more than one <h1> as an error and tell you it will hurt your SEO. Google has said otherwise. The real reason to prefer one is clarity for visitors, and that is a choice, with no penalty attached.

They also like to stuff headings with search phrases, turning a section title into something like Bird Walks River Bird Walks Near Me. That reads badly and does not help. A heading that a person would naturally write is the right one.

Another common suggestion is to choose heading levels for size or to style everything as an <h2> for consistency. Levels describe structure. Generated page outlines can also add headings for sections that have one sentence under them, which makes a page look thorough while saying very little. Read the outline back as a list and check that every heading has real content beneath it.

Field notes

  • Headings show the outline of a page, which helps readers scan and helps search engines follow the topic.
  • The h1 should say what the page is about in plain words, usually close to the title.
  • Heading levels should go in order without skips, so the outline stays clear for screen readers.
  • Only real heading elements count as headings, so bold text styled to look big is plain text to a crawler.

Easy to get wrong

A paragraph styled to look large is still a paragraph. Crawlers and screen readers only treat heading elements as headings.

A generic main heading tells visitors and search engines nothing about the page. Name what the page holds.

Choose the level by its place in the outline. Set the size with CSS.

Questions people ask

Should my h1 match my title exactly?

It does not have to. They usually say the same thing in different ways: the title often adds the site name and is written for the results page, while the h1 is written for someone already on the page.

Can headings contain links?

Yes, an <a> inside a heading is valid HTML. Keep the heading's text descriptive, because screen readers read it out both as a heading and as a link.

How many headings should a page have?

As many as the content needs, and no more. A short page may only need an h1. A long one with several distinct parts gets an h2 for each part, so readers can find the bit they came for.

Does the lab check heading text for keywords?

No. The task's checks look for a word such as walk in the h1, only to confirm it names the page's topic. Any wording that does that passes.

Keep going