Heading Structure for Documents and Websites
Heading structure is a critical basic component of digital accessibility. Check out these best practices from UCLA’s Disability & Computing Program.
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 low-vision 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. This functionality also 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.
- Highlight the text you want to format as a heading.
- 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.
Summary & Key Takeaways
- 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.