Heading Hierarchy

The heading hierarchyThe heading hierarchy is the logical nesting of headings from H1 to H6 that structures a page's content, much like a table of contents.Open glossary entry → orders headings by importance: the H1The H1 is a web page's main heading. It names the central topic, is visible to users and should generally appear only once per page.Open glossary entry → names the main topic, H2 headings structure the main sections, and H3 headings further subdivide individual sections. This creates a comprehensible structure that helps users, screen readers and machines find their way.

A clean structure follows the content logic, for example H1, H2, H3, H3, H2. As best practice, levels should not be skipped unnecessarily, so not jumping straight from H2 to H4.

Common problems with an unclear structure are:

• skipped levels,
• empty heading tags,
• generic titles such as "learn more",
• headings chosen only for their appearance.

Headings are structural information, not a styling device: meaning is controlled by the HTMLHyperText Markup Language (HTML) is the markup language for web pages. It defines the structure and content of a page, such as headings, paragraphs, links and images.Open glossary entry →, appearance by the CSSCascading Style Sheets (CSS) is the language used to define the layout and design of web pages. CSS controls colours, fonts, spacing and arrangement, among other things.Open glossary entry →.