Digital Accessibility Essentials: Headings

What Are Headings?

Headings are the titles and subtitles that organize the content of a document or webpage. They provide structure and help readers understand how information is grouped and related.

Headings are usually visually styled to stand out (for example, larger or bold text). This helps sighted people to quickly skim a document and jump to sections. When headings are properly applied (or tagged), assistive technology users can use headings in a similar way. Properly tagged headings can also automatically generate an accurate table of contents in tools like Microsoft Word.

On the left, green check mark over properly structured H1, H2, and paragraph text. On the right, red X over improperly structured paragraph text, H2, and H1.

Why Headings Matter

Headings greatly enhance accessibility when they are set up correctly. Without correctly tagged headings, screen reader users may need to read through large amounts of content just to find a specific section. 

Properly tagged headings:

  • Provide a clear structure for everyone.
  • Enable screen reader users to navigate by section instead of reading line by line.
  • Help users build a mental map of the webpage or document.
  • Improve usability and comprehension.

Heading Basics

Headings should follow a logical hierarchical order, starting with heading level 1. 

  • Heading Level 1 (H1): Represents the main topic or title and is typically used only once per document or webpage. 
  • Heading Level 2 (H2): Represent sections of the H1 topic.
  • Heading Level 3 (H3) and beyond: Subsections of the heading above them. 

Key Rules for Headings

  1. Do not skip heading levels.
    1. For example: H2 should not be followed directly by H4.
  2. You may move backward by more than one level when starting a new section.
    1. For example: You can move to H2 for a new section after using H4 for a previous subsection.
  3. Avoid using more than six heading levels (H6).
  4. Avoid using a “Title” in addition to heading levels. Documents and webpages should start with H1.
  5. Keep heading styles visually consistent so sighted people can easily understand the structure.
  6. If you want to change how a heading looks, adjust its visual style without changing the heading level.

Heading Structure in Practice

The following is an example of proper heading structure. Note how each more specific heading level is a subsection of the heading under which it is nested.

  • H1: Department Name
    • H2: Courses
      • H3: Undergraduate Courses
      • H3: Graduate Courses
    • H2: Faculty
    • H2: Students
      • H3: Undergraduate Students
      • H3: Graduate Students
        • H4: Graduate Students in Science
        • H4: Graduate Students in Math
    • H2: Staff
    • H3: Administrators

Using headings in this way is a key component of accessible digital content.

Practical Application

Applying (or tagging) headings varies by tool but is often fairly simple. Typically, you can select text and then apply the appropriate heading level from a menu, or you can select the appropriate heading level from the menu and then type the text.

Here are some tool-specific tutorials for applying headings:

Additional Resources

CMS Login