Accessibility - Heading structure

A proper heading structure is one of the most important accessibility considerations because it provides a frame of reference for all users. Headings provide context as well as a way to navigate through documents quickly. They allow us to scan documents both visually and with a screen reader to find relevant content to our task.

Headings

Headings are used to define the structure of a document by using semantic heading levels. Heading levels are content styles that allow screen readers to describe the document or web page structure to everyone, including persons with visual or cognitive disabilities. These individuals can use the screen reader to scan the content or jump to a particular section of the content using headings without having to read the entire document.

Depending on the document type, headings can automatically be used as bookmarks or for a table of contents. Properly used headings break up text for both sighted and non-sighted users and create content with a consistent look and feel.  

Headings should be selected based on their hierarchy, or importance, and heading structure is similar to that of an outline. Remember, the heading numbers refer to the level, not the look of the heading. Headings should be used in the correct order:

Heading 1 = top level heading 

Heading 2 = subheading of Heading 1

Heading 3 = subheading of Heading 2

Creating headings

A best practice for online writing is to have 2-3 sentences per paragraph and 1-2 paragraphs under each heading. Try to find natural locations where the content changes and add sub-headers for ease of reading.

Just by making text a larger font size and bold doesn’t mean you’ve successfully created a heading structure. A screen reader can’t differentiate based on font size or a bold tag. Instead, it navigates through a document based on preset heading tags.

Tips for heading levels:  

  • Use brief headings related to the text within a section.  
  • Always use a heading level designation when labeling a section of information. Do not use bold or enlarged text as a substitute. Screen reader users will not be able to skip to relevant sections or scan the document for important information without those heading levels.  
  • Assign only one Heading Level 1. This should be the title of your document or web page. You may see the style-type within the heading styles that indicates Title, but this is used for APA requirements like Reference pages. 
  • Do not skip heading levels to achieve a certain font or style. You should assign them in numerical order. You can typically edit each heading level to match a preferred look.  

Quick test

Using the Headings bookmarklet, you can quickly and easily identify all headers on a webpage.

 

Was this helpful?
0 reviews
Print Article

Related Services / Offerings (1)

This offering provides educational sessions and workshops on digital accessibility. Training covers topics such as accessibility standards, tools, and techniques to help participants create and maintain accessible digital content and services.