Accessi-Bites: Get Headings Right

This habit makes it easy for anyone to scan through your document to find useful information and allows users using assistive technology to do the same.

Heading tags should never be used to control font style alone. They are intended to reflect the semantic structure of the content.

• Heading 1: Use once per document or webpage to indicate the title, topic, or purpose.
• Heading 2: Use to indicate each main section of the document or page.
• Headings 3–6: Use to indicate sub-sections.

Structure

We’re using heading structure on this webpage. The title near the top “Headings” is our Heading 1 - indicating the title of the page. After some introduction text, “Structure” is a heading level 2, indicating a main subsection. "Ordering" and "Nesting" are heading level 3, indicating a subsection of "Structure."
 

Ordering

Always use headings in descending order. For example, use a heading 2 before a heading 3, a heading 3 before a heading 4, and so on.

• Correct: Heading 1 > Heading 2 > Heading 3 > Heading 4
• Incorrect: Heading 1 > Heading 3 > Heading 4

Nesting

You can also “nest” headings under one another. For example, a heading 2 may have two or more subsections. This might look something like:

• Heading 2
  • Heading 3
    • Heading 4
  • Heading 3
  • Heading 3
    • Heading 4
• Heading 2

Live example

You can view a live example on the University’s Editorial Style Guide - notice the use of headings to organize content and make sections easier to find.