Headings

Using Headings in Text Blocks

Terminalfour is structured to help maintain accessibility across your webpages. However, within text blocks, you have control over the heading levels you use, which means it is important to make sure headings are added in the correct order.

Headings organize the content on a webpage and help users understand how information is grouped. They provide a visual structure for people scanning the page and a programmatic structure that assistive technologies, including screen readers, can use to navigate the content.

Why heading structure matters for accessibility

Many users do not read a webpage from beginning to end. They scan headings to understand what information is available and to quickly find the section they need. Screen reader users can also navigate directly from heading to heading or view a list of the headings on a page.

For this reason, headings should describe the content that follows them and should be arranged in a logical hierarchy.

Headings should not be selected based on their font size, appearance or styling. A heading level communicates the relationship between sections of content. Choosing a heading simply because it looks the way you want can create a confusing or misleading page structure for users of assistive technology.

Understanding heading hierarchy

Think of headings as an outline of your page. Each heading level represents a different level within that outline.

• Heading 1 (H1) identifies the main topic of the page.

• Heading 2 (H2) identifies a major section of the page.

• Heading 3 (H3) identifies a subsection within an H2 section.

• Heading 4 (H4) identifies a subsection within an H3 section.

The same pattern continues for H5 and H6, although most webpages should not require that many levels.

A typical page structure might look like this:

• Heading 1

  • Heading 2

    • Heading 3

    • Heading 3

  • Heading 2

    • Heading 3

  • Heading 2

  • Heading 2

In this example, the H1 represents the entire page. Each H2 introduces a major topic within that page, and each H3 contains information that belongs specifically to the H2 above it.

Do not skip heading levels

Heading levels should follow a logical order. When moving into a subsection, move down one level at a time.

For example:

Correct: H2 → H3 → H4

Avoid: H2 → H4

An H4 indicates that the content is a subsection of an H3. If there is no H3 before it, the relationship between the content becomes unclear.

You can move back up the hierarchy when starting a new section. For example, this structure is appropriate:

H2 → H3 → H3 → H2

The second H2 indicates that the previous section has ended and a new major section is beginning.

Heading 1 is reserved for the page title

The page title should be the Heading 1 (H1) and should identify the primary purpose or topic of the page.

Because the page template provides the H1, do not add another H1 inside a text block. Content within a text block should generally begin with an H2 or the appropriate heading level based on where the text block appears within the overall page structure.

Headings should describe the content

Use meaningful headings that help users predict what they will find in each section.

For example, instead of a vague heading such as More Information, use a descriptive heading such as Application Requirements or Contact the Admissions Office.

Descriptive headings are particularly helpful for users who are scanning the page or navigating through a list of headings with assistive technology.

Do not use headings just to make text stand out

If text needs visual emphasis but does not introduce a new section of content, it should not be formatted as a heading.

Use bold text, callouts or other appropriate formatting options instead. Likewise, do not use bold text in place of a heading when the text