The TLC’s Maintaining Instructional Continuity page has newly-added resources for supporting instructor wellbeing during this unprecedented and uncertain time.

Home / Heading Structure for Documents and Websites

Heading Structure for Documents and Websites

Overview

Imagine reading a book that had no table of contents, no chapter titles, no page numbers, no change to font size or style, and no paragraph breaks – just long scrolling text page after page.  You would not be able to get a sense of the organization of the book, the chapter topics overall, or choose to skip ahead to certain sections. 

A screen reader is one  type of assistive technology that allows blind or visually impaired individuals to navigate websites and documents, but only when these documents and web pages are set up correctly to allow the user to jump from heading to heading and select when and where to read.  For sighted individuals, this functionality allows use of a keyboard instead of a mouse to navigate across documents and websites using keystrokes, and also enables authors to utilize Table of Contents features in document tools.

Headings are responsive design elements which “respond” or change size to fit the screens on different devices.  Use headings when creating documents and web pages to ensure digital accessibility of these course materials.

How to Use Heading Structures

Open the accordions to learn how to create headings in Bruin Learn, Microsoft Word, and Google Docs.

Bruin Learn

To create headings in Bruin Learn, access the second drop-down menu from the left in the Rich Content Editor. The “Paragraph” formatting, normal text, is the default setting.

  1. Highlight the text you want to format as a heading.
  2. Select the desired heading size from the drop-down menu.

Microsoft Word

This short video provides an example of how a screenreader reads headings in a document and illustrates how to create headings in Word.

Video: Improve accessibility with heading styles  (1:21)

Google Docs

See the “Make a title or heading” section of this support document to learn how to create Google Doc headings: Add a title, heading, or table of contents in a document.

Recommended Practices & Workflows

  • Refrain from using “Title” or “Subtitle” but instead use one Heading 1 (H1) for the title of the document or page. This is because when exporting to PDF or other file formats the “Title” and “Subtitle” styles may not be recognized.
    • H1 = Main title
    • H2 = Subsection
    • H3 = Topic within a subsection
    • H4 = Topic within topic within subsection 
  • Use heading structures during the initial creation of documents, rather than retro-actively updating. It may take a little getting used to, but this workflow will help you integrate accessibility as part of your own digital literacy for different tools. 

Overview

Imagine reading a book that had no table of contents, no chapter titles, no page numbers, no change to font size or style, and no paragraph breaks – just long scrolling text page after page.  You would not be able to get a sense of the organization of the book, the chapter topics overall, or choose to skip ahead to certain sections. 

A screen reader is one  type of assistive technology that allows blind or visually impaired individuals to navigate websites and documents, but only when these documents and web pages are set up correctly to allow the user to jump from heading to heading and select when and where to read.  For sighted individuals, this functionality allows use of a keyboard instead of a mouse to navigate across documents and websites using keystrokes, and also enables authors to utilize Table of Contents features in document tools.

Headings are responsive design elements which “respond” or change size to fit the screens on different devices.  Use headings when creating documents and web pages to ensure digital accessibility of these course materials.

How to Use Heading Structures

Open the accordions to learn how to create headings in Bruin Learn, Microsoft Word, and Google Docs.

Bruin Learn

To create headings in Bruin Learn, access the second drop-down menu from the left in the Rich Content Editor. The “Paragraph” formatting, normal text, is the default setting.

  1. Highlight the text you want to format as a heading.
  2. Select the desired heading size from the drop-down menu.

Microsoft Word

This short video provides an example of how a screenreader reads headings in a document and illustrates how to create headings in Word.

Video: Improve accessibility with heading styles  (1:21)

Google Docs

See the “Make a title or heading” section of this support document to learn how to create Google Doc headings: Add a title, heading, or table of contents in a document.

Recommended Practices & Workflows

  • Refrain from using “Title” or “Subtitle” but instead use one Heading 1 (H1) for the title of the document or page. This is because when exporting to PDF or other file formats the “Title” and “Subtitle” styles may not be recognized.
    • H1 = Main title
    • H2 = Subsection
    • H3 = Topic within a subsection
    • H4 = Topic within topic within subsection 
  • Use heading structures during the initial creation of documents, rather than retro-actively updating. It may take a little getting used to, but this workflow will help you integrate accessibility as part of your own digital literacy for different tools. 

Making Your Course Accessible

Heading Structure for Documents and Websites

Descriptive Links

Color Contrast and Font Selection

Course Pages in Bruin Learn

Adding Alt Text to Images

Graphs, Data Visualizations, and Infographics

Accessible Math with LaTex and Overleaf 

Video and Audio – Captions and Transcripts

Remediate Inaccessible PDFS 

Accessible Slides and Presentations 

Checking for Accessibility

Enacting CAE Accommodations

Receive the latest news

Get TLC Updates

The TLC offers monthly and quarterly updates highlighting events, resources, and other opportunities to foster teaching excellence on campus. Sign up to receive communications.