Headings

The purpose of headings on a page is to provide structure and organisation by assigning titles to the sections and subsections.

Their effectiveness comes when they are correctly applied in a hierarchical order. For a user without any particular disability their organisation might not be very noticeable but for a person that uses screen-reader technologies, their order and hierarchy is essential to clearly understand the page structure and the relationships between sections and relative subsections, without confusion or "getting lost" during the navigation.

Using headings in HTML

The HTML tags to create a heading and, their hierarchy, looks like this:

<h1>Main page heading</h1>

<h2>Section 1</h2>

<h2>Section 2</h2>

<h3>Subsection 2.1</h3>

<h4>Subsection 2.1.1</h4>

<h3>Subsection 2.2</h3>

<h2>Section 3</h2

It's imperative to not use heading tags incorrectly. One of the common errors when writing HTML code, is assigning heading tags to pieces of text just to make it larger, despite it not being an actual heading.

Another common mistake is using heading tags without following the correct hierarchical order. You should never skip a heading level, you should follow the correct order as shown in the code sample above. For example you should not jump from a second level heading (<h2>) straight to a fourth level heading (<h4>) without first having a third level heading (<h3>).

These mistakes can lead to much confusion for screen-reader users because the real structure of the page would not be clear to them.

Using headings in Microsoft Word

To correctly use headings in Microsoft Word:

1. Highlight any section's title
2. Inside Styles section of the Home tab, select the appropriate heading by paying attention at the right hierarchical structure.

Notice in the above screenshot that the four headings have different sizes in relation to their hierarchical position. 

Using headings in Adobe Acrobat

To add heading to the PDF document using Adobe Acrobat:

1. Click on Accessibility tool,
2. Select Reading Order,
3. Highlight the part of text you want to use as heading,
4. From the opened window select the most appropriate heading and the press Close.