Make sure that headings are formatted with a heading element

Thanks to well-written descriptive headings, visitors can quickly recognize the structure of a text. A heading often has a different design, for example it is larger and in bold. It makes it easier to scan the structure of the page.

The structure that is only conveyed through design cannot be perceived (or not properly perceived) by visitors who are blind or partially sighted. For these visitors it is important to also record structure in the code. For example, software can also determine the structure and the relationships on the web page.

Visitors using a screen reader can use a list of all headings to navigate the page. They can also jump straight to the next heading.

Make sure that all headings are formatted with an HTML element (h1 to h6).

Note: Texts that are not headings may not be formatted with an HTML heading element.

Further make sure that the order of the headings and subheadings is logical. A few rules apply:

  • The first heading on the page should be a first-level heading.
  • A first-level heading should be followed by a second-level heading.
  • A second-level heading should be followed by another second-level heading or a third-level heading.
  • The heading levels should not be skipped.

In a CMS, a text can be selected and indicated that it is a heading. You can also choose the level of a heading. This automatically formats the text with the correct HTML element.