Headings are one of the most important content related components of a page. When they are visually styled well, they make it easy for everyone to scan pages. By making sure they are well-structured, you help both sighted users and those who use screen readers understand the relationship between different pieces of content on a page. As an added bonus, headings that are worded well and structured properly also help boost search engine optimization (SEO).
Resources
How to Create Better and More Accessible Heading Structures (approximately 5 minute video)
5 Heading Accessibility Issues and How to Fix Them
(Pope Tech)
This video and article explain why a heading structure is important, what a heading hierarchy is, tips for creating a heading structure, and mistakes to avoid when using headers.
Check Heading Accessibility Using the WAVE Tool (approximately 5 minute video)
(Pope Tech)
This video provides examples of how good and bad heading structure is read by screen readers. It also has some demos of how you can use the WAVE tool to review a page’s heading structure. For a link to download the WAVE browser extension, visit the Tools page.
Essential Guide to Heading Accessibility in Web Development
(A11Y Collective)
This article’s title has “development” in it, but it’s not written in a technical manner. It has information about the benefits of well-written, structured headings, heading hierarchy (with a great example about how it relates to the structure of a book), and concise heading best practices.
