Skip to main content

Heading Styles

When you properly use headings, all users can more easily understand and navigate your content.

Headings make your documents more readable by breaking up long blocks of text and helping users quickly identify sections that are most relevant to them.

Visually, headings typically appear in a larger, bolder font, but it is also important that headings are indicated through heading styles or tags (proper semantic markup) so that they can be useful to users of assistive technology.

Screen reader users can employ keyboard shortcuts or special gestures to quickly jump between headings in a document, similar to how sighted users might skim a document looking for key headings. Screen reader users can also pull up a list of all of the headings in a document that functions similar to a table of contents or outline. However, people can only do this if headings are properly indicated via heading styles.

Headings come in different levels. The top-level heading in a document should be a heading level 1. A subheading under that should be a heading level 2, and a heading nested under that would be a heading level 3 (and so on). The web only supports 6 levels of headings within a page, and screen readers typically do not support more than 6 levels of headings in other types of documents.

In many apps, heading styles can be used to automatically generate a table of contents or provide a visual outline of the document. In programs like Google Docs or Microsoft Word, you can also use heading styles to quickly adjust the visual appearance of your headings in bulk.

What To Do

Provide clear and descriptive headings. Make sure you properly indicate your headings using heading styles, and avoid applying heading styles to text that doesn’t logically serve as a heading.

Ensure your heading hierarchy is logical (level 1 for your first heading, level 2 for your subheadings, and so on). Structure your work so that you don’t need more than 6 levels of headings within a single document.

Human Impacts

Without headings (or with unclear headings), your readers will struggle to find what they are looking for.

Without proper heading styles, your readers won’t be able to effectively navigate your content. The issue will be particularly acute for screen reader users, but it impacts all users. In Microsoft Word, users won’t be able to make full use of the navigation pane if heading styles aren’t used (or are used improperly). On the web, people may use tools like the HeadingsMap extension to help them more easily navigate webpages, but these tools similarly won’t work without proper use of heading styles.

WCAG References

This skill corresponds to the following success criteria of the Web Content Accessibility Guidelines (WCAG):