Why Heading Structure Matters
Because headings indicate the start of important sections of content, it is possible for assisted technology users to access the list of headings and to jump directly to the appropriate heading and begin reading the content. This ability to “skim” the content through the headings and go directly to content of interest significantly speeds interaction for users who would otherwise access the content slowly.
However, users that use assistive technologies, like screen readers, heavily rely on well implemented, structured, and meaningful markup.
Using Assistive Technology to Navigate Through a Page
Regardless of your experience with web accessibility, you’ve most likely heard that all of your content must be reachable by keyboard, the importance of tab index/order, and the skip to main content link. These are important but about as basic as things get. Specifically screen readers commonly navigate through a site using the following additional techniques:
ARIA landmarks and regions
These allow users to jump directly to portions of page, like the navigation, main body, and banner/header.
Retrieving a list of page links
A list of page links can be useful for pages that have a flat structure with a lot of links, like a home page.
Navigating through the headings
Most screen readers allow the user to navigate through the various heading levels of a page. This can be particularly useful on a page with multiple structured sections.
Navigating through the <h1> and <h2> elements allows the user to understand the overall pupose of a page and how its content is structured. The <h3>through <h6> elements provide a quick understanding of the details in each section.
While thinking about heading structure consider the following:
- Having a lot of content that helps define the high level structure of page buried in heading levels 3-6 could prevent users using assistive technologies from understanding a page’s purpose.
- Using mostly level 1 and 2 headings on a page could blur the overall struture and purpose of page for users using assistive technologies.
- Inconsistently implementing headings from page to page, and even across multiple sites that are part of a suite could create confusion and frustration for users using assistive technologies.
See WCAG 2.0 – Understanding SC 2.4.10 for specific examples of the benefits of using headings to organize content.
Contact me if you are looking for help updating your websites heading structure.