Overview

Sighted users often scan a page and use visual cues to determine how a page or document is organized. This lesson will address headings and how they help ensure non-sighted users and people using assistive technology can make sense of how a document/page is organized as well.

This lesson does not cover how to add headings to a page or document. That depends on what program you are using and is addressed in the supplementary modules.

Core Concepts

What are headings?

Headings are the labels given to each section title of your doc/webpage; they give your document structure by organizing the content into sections. Often, people use a bold or larger font to indicate section titles (which allows sighted users to scan the document for the section they need). Assistive technology, however, does not allow the user to navigate based on whether the text is bold or larger. By using headings, a person using assistive tech can jump from section to section rather than read through all of the text to find what they need.

Without headings, a document/webpage is essentially one long stream of text that forces the someone using assistive tech to navigate through from the start, rather than jump to what they need (imagine if you could only navigate a webpage by using the right and left arrow keys - no scroll bar, no up and down arrows!).

*Visual Formatting and the User Experience*
Visual Formatting	User Experience
Sections are visually distinct due to spaces, bold text, but headings are not used.	Visual formatting is stripped away leaving one long stream of text.

You won't always know if a document or webpage uses heading just by looking at it. Headings are often visually distinct, but just because text is larger or bold doesn't mean it is actually formatted as a heading. In the supplementary modules we'll discuss how to look for headings, as it differs depending on the program you are using.

How to Use Headings

Headings are used in a hierarchical manner. Document/page titles should always be Heading 1. Heading 2 is used for section titles. Heading 3 would be applied to sub-section titles.

Headings are nested under other headings; you should never jump from Heading 1 to Heading 4 without using Headings 2 and 3. For instance, anything formatted as Heading 3 should be a sub-section to what has been labeled as Heading 2.

Example Word doc with headings noted

Headings exist on their own line. So, you cannot make one part of a sentence or the first line of a paragraph a heading without making all of the text a heading. Sometimes people new to accessibility will try to turn anything they've made bold into a heading. However, sometimes you need to add a section title or change the semantic structure in order to apply a heading. See the examples below.

Before Adding Headings

Adding Headings

Item titles are bold at the start of each line.

Text is restructured with section titles added to accommodate headings.

Course: SOC 101

Section: 3805

Term: Winter 2019

Credits: 5

Instructor: Tess Johnson

Email: tjohnson@college.edu

Office: ESB 28

Phone: 360-555-3848

Course Info (Heading)

Course: SOC 101
Section: 3805
Term: Winter 2019
Credits: 5

Instructor Info (Heading)

Instructor: Tess Johnson
Email: tjohnson@college.edu
Office: ESB 28
Phone: 360-555-3848

Check Your Understanding:

Without headings, a person using assistive technology like a screen reader

A. will not be able to access the document text at all.

Incorrect.
As long as it's real text, the user can still access the text, but they won't see how it's structured.

B. cannot navigate by sections, or scan section titles to understand the document structure.

Correct.

C. will need to OCR the document in order to navigate it.

Incorrect.
You OCR a document to convert scanned text to real text.

The UO Experience

"The hard part of being blind and using a screen reader to navigate a Word document is not all digital content is created alike. When you just bold the font of a section heading, the document reads like one large unbroken lump of text – envision an entire book written without blank lines or paragraph indents. If people would learn how to use heading styles, then I could quickly and easily move among the sections. And, heading styles aren’t just for the blind. When sighted authors/editors discover this gem of a feature, they’ve got the power – with the push of a button – to create a table of contents, display as an outline, move entire sections, and change all heading fonts simultaneously." – Heidi, UO faculty

"I was working on a homework with my classmates all 3 of which also have some form of ADHD, and we all agreed that a large paragraph problem easily could’ve been 4 bullet points. It was then that I realized just how beneficial well-structured material could have been." – UO undergraduate student

Video Supplements

How Headings Help Screen Reader Users (3 mins)

This video out of NC State University provides a good explanation as to how headings on a website assist screen reader users to understand how content on the page is arranged.

How Headings Help Screen Reader Users

Screen Reader: Document Without Headings (1 minute)

This video, from the Colorado State University Assistive Technology Resource Center, shows how screen reader users experience documents without headings.

Screen Reader: Document Without Headings

Benefits of Headings to Writers (2 minutes)

This video, from the Colorado State University Assistive Technology Resource Center, explains how using headings benefits writers and document creators.

Benefits of Headings to Writers

Additional Resources

Headings from AccessibleU, Univ of Minnesota - A very good discussion about the importance of headings in documents and webpages. While it references Moodle (a different LMS than what we use), the rest of the information is relevant.
Semantic Structure - This page from WebAIM discusses how headings are useful for webpages.
Headings from Colorado State University, Accessibility by Design