← #145 Fold CSS declarations with region markers
#146

Avoid skipping heading levels

Topics: Accessibility, HTML

It's common to use the heading elements, <h1> to <h6>, to represent the heading of sections.
The <h1> tag is often used in the highest section, whereas the <h2>, <h3>, ... tags are used in the lower section.

Heading elements are used not only because of their semantic meanings but also by screen reading tools. Those tools determine the content of the page based on the headings, and allow users to navigate between sections via the headings.

It's recommended to keep the heading elements in the order, so the users won't be confused that there's a missing heading or section while navigating on the page.

<!-- Do not -->
<h1>Main heading</h1>
<h3>Heading level 2</h3>
<h2>Heading level 3</h2>

<!-- Do -->
<h1>Main heading</h1>
<h2>Heading level 2</h2>
<h3>Heading level 3</h3>

More

Fix a typo or suggest an improvement
#147 Avoid using the <b>, <i>, <s> and <u> tags