Correct heading order

How to fix incorrect heading order?

Make sure heading levels increase by one step at a time. You can skip back to a higher level when closing a section, but you must not skip levels going deeper:

<h1>Page title</h1>
<h3>Section title</h3>

<h1>Page title</h1>
<h2>Section title</h2>
<h3>Subsection title</h3>

<h1>Page title</h1>
<h2>First section</h2>
<h3>Subsection</h3>
<h2>Second section</h2>

Do not choose a heading level for its visual size. Use CSS to style headings. Choose the level based on the document outline.

Why is this important?

Screen reader users navigate pages using heading levels. When levels are skipped, the document outline becomes inconsistent and confusing. Users may think they have missed a section, or may not understand the hierarchy of the content.