Headings

Headings are important for accessible web and document design. They make information easier to skim through for both sighted users and screen reader users.

Why do we need headings?

Headings provide a visible structure for the flow of ideas throughout your webpage or document. The smaller the number of the heading, the higher “priority” or more general that topic is.

Headings Best Practices

  • Only use H1 once
  • Add headings in order
  • Use short, descriptive headings
  • Use built-in styles

Only use H1 once

On web pages, first-level headings (H1) should function as the title of the page.

Add headings in order

Headings should follow a specific hierarchy to be logical for the organization of the content. Each section should start with a heading and subsections can have new heading levels in order. Do not use headings as a way to change font sizes.

WebAIM: Heading Order Explanation

Use short, descriptive headings

Headings are a title for whatever content follows. It is best practice never use a full sentence for a heading.

Use built-in styles

Headings should stand out and have their own distinct styles so the structure of the text is easy to follow. This means that headings are usually larger in size than paragraph text. Make sure your heading levels have consistent styles (i.e. heading level 2’s all have the same style, and heading level 3’s all have the same style).

Example

The first column shows a list of technology topics and UA supported instructional technologies as subtopics. The second column lists how each bulleted item would be styled as a heading in a document or web page.

Instructional Technologies

  • Learning Management System
    • Blackboard
      • Original Course View
      • Ultra Course View
  • Communication & Collaboration Tools
    • Hypothesis for social annotation
    • Microsoft Teams for synchronous learning
    • Panopto for recording lectures and asynchronous learning
    • Zoom for web conferencing
  • Content Creation Tools
    • Adobe Creative Cloud (via UA license)
    • Panopto for recording lectures and interactive quizzes
  • Assessment & Feedback Tools
    • Gradescope for written assessments and rubric grading
    • PointSolutions for audience response
    • Respondus LockDown Browser for test security
    • Turnitin for writing instruction and plagiarism detection

H1: Instructional Technologies
H2: Learning Management System
H3: Blackboard
H4: Original Course View
H4: Ultra Course View


H2: Communication & Collaboration Tools
H3: Hypothesis for social annotation
H3: Microsoft Teams for synchronous learning
H3: Panopto for recording lectures and asynchronous learning
H3: Zoom for web conferencing


H2: Content Creation Tools
H3: Adobe Creative Cloud (via UA license)
H3: Panopto for recording lectures and interactive quizzes


H2: Assessment & Feedback Tools
H3: Gradescope for written assessments and rubric grading
H3: PointSolutions for audience response
H3: Respondus LockDown Browser for test security
H3: Turnitin for writing instruction and plagiarism detection