Heading Styles

Headings, when used in documents, provide a navigational structure to the content.  Headings are often formatted different from the body text making the headings easily noticeable from a visual perspective.  Unfortunately, these visual cues are not picked up by screen readers.  Screen readers rely on non-visual tags placed in the document to make the distinction between headings, subheadings, and body text.

Purpose of Headings1

For documents longer than 3-4 paragraphs, headings and subheadings are important usability and accessibility strategy to help readers both determine the overall outline of the document and to navigate to specific information that may need more of the reader's attention.

Level of Headings2

Headings are classified into levels starting at Level 1 and working through Level 2, Level and so forth. By general convention, the highest level is "Level 1" and often corresponds to the title of the page or major document section. Level 2 is the next set of subheaders with a Level 1 section, and Level 3 are sub-subheaders within a Level 2 section. The lower the number, the smaller and more detailed a section. 

Heading Styles vs Text Formatting3

Visual readers are able to identify headers by scanning pages for text of a larger size or a different color/font face. Blind users on a screen reader are not able to see these visual changes, so increasing the font size is not a sufficient cue.

Instead, the headings must be semantically "tagged" so that a screen reader can both identify headings and provide a list as a page or document table of contents (see image below).

This makes adding headings one of the most important tools for a screen reader user so that he or she can learn what is on the page.

How to Use Heading Styles4

Heading 1 is like the title of a book and there is just one Heading 1 per page. Heading 2s are like chapter titles. Heading 3s are sub-sections of those chapters, and so on. The heading hierarchy also resembles an outline's hierarchy if that metaphor works better for you.

Heading styles can be easily applied in Word and in Blackboard. 

Example of Blackboard Default Heading Styles

Example of the 3 built-in heading styles in Blackboard.

Example of Word 2010 Default Heading Styles

Example of the 4 built-in default heading styles in Microsoft Word 2010.

Learn how to use heading styles in Word.

Learn how to use heading styles in Blackboard.

Additional Benefit of Heading Styles in Word

An additional benefit of using heading styles in Word affects persons who are sighted.  Word has a navigation pane that links to each of the headings in a document.  To view the navigation page, go to the View ribbon and check "Navigation Pane" in the second section of the ribbon.

Navigation Pane in Word

Word has a navigation pane that opens on the left of the document and links to each of the headings in the document.

Headings on the Web

Screen readers identify the hidden heading style tags and can read through the navigation structure of a document just as a sighted person can visually scan the headings.

Watch the following video (1:52) to hear a screen reader navigates a web page when heading styles are used.



1 "Headings and Subheadings." AccessAbility: Accessibility and Usability at Penn State. PennState. 2002-2014. Web. 11 Nov 20104. < http://accessibility.psu.edu/headings>.
2 ---.
3 ---.
4 " Key Accessibility Factors for HTML Pages - Part 1." Web Accessibility MOOC for Online Educators. 2014. Web. 11 Nov 2014.