Nesting Headings in Order

Headings should nest in order, one level at a time: <h1>, then <h2> for its main sections, then <h3> for subsections inside those, and so on. Skipping a level — going straight from <h1> to <h3> — is a common mistake that leaves a gap in the outline.

<h1>Recipe Guide</h1>
<h2>Main Courses</h2>
<h3>Pasta</h3>
<h3>Stir-Fry</h3>
<h2>Desserts</h2>

Jumping straight from <h1> to <h3> doesn't just look inconsistent — it actively breaks the outline a screen reader user relies on to navigate the page, since they land on an <h3> with no <h2> above it to explain what section they are even in.

<h1>Recipe Guide</h1>
<h3>Pasta</h3>

It's fine to go back up — an <h2> can follow an <h3> once you start a new section, the same way a book can move from a subsection back to a new chapter. What you want to avoid is skipping downward past a level on the way in.

Which of these heading sequences is correctly nested?

Jumping directly from an <h1> to an <h3>, with no <h2> in between, is good practice.

After using an <h3> for a subsection, starting a brand-new main section should go back ____ to <h2>, not stay at <h3>.