Loyola Support DocumentationSakai 20 Student Guide Accessibility Structuring documents to be more accessible

Structuring documents to be more accessible


Assistive technology users rely heavily on page titles and headings to navigate complex content. Structuring complex content will help users parse it as well. Headings allow users to move from one part of a document to another without using a mouse.  Additionally, screen readers will interpret headings for those who use them.

For this reason, headings should not be used for typographical effects. To increase or decrease the font size of large blocks of text, use the Normal Paragraph Format and select a new Font size from the Size menu, or use Styles.

Use Unique and Descriptive Page Titles

Assistive technology users rely on page titles. Page titles will be imperative this when creating a page in the Lessons tool or an HTML page in the Resources tool. The title of the new document will be the same as the name of the item as it appears on the left-hand tool menu or the list in Resources.

Do Not Use Color or Spatial Position to Convey Information

Using color or spatial position to convey important information can be problematic.  For example, if you were to say, "click the green button on the left," color blind users may not be able to distinguish the button. Screen reader users may have difficulty interpreting "left" because a screen reader reads from the top of the page to the bottom, as well as left to right. Therefore, the best solution is to quote the target label: for example, "Click on Start Assignment," or "Click the Save button."

Add Structure with Headings

If a document can be outlined, then adding headings will convey its structure. Use short title headings that describe the content that follows.

Nest headings appropriately:

  • Heading 1 > Heading 2
  • In most cases, start with Heading 1.

Steps to Add Headings

  2. When the cursor is positioned in the text box, the name of this menu will change to match the Paragraph Format of the text.  In a blank document, it will say Normal.
  3. Select the Paragraph Format menu (Normal, in a blank document) to select a Heading.


  • The default size of the Headings can always be adjusted with the Size menu.  The default size of some of the higher-level headings (the ones with small font sizes, e.g., Heading 5 and Heading 6) may need adjustment.
  • Conversely, do not use headings for typographical effects. Users of assistive technologies can navigate through a document by jumping from heading to heading.  To increase or decrease the font size of large blocks of text, use the Normal Paragraph format and select a new font size from the Size menu.

Use Inline Styles


  • Italic Title - Makes selected text an italicized Heading 2.
  • Special Container - Inserts a block of text (a <div> HTML element) that can be used to group together several items in a document and/or format them with background colors or borders.  As with paragraph breaks, using <div> containers to group items in meaningful ways can assist with navigation because keyboard users can skip from one group of elements to another.
  • Marker - This highlights text in bright yellow. 
  • Big - Without setting a specific font size, this style makes selected text slightly larger than the text that surrounds it.
  • Typewriter 
  • Computer Code - Indicates a block of text that has been identified as computer code (for example, a list of HTML tags to indicate how to code in HTML).
  • Keyboard Phrase - Defines keyboard input.
  • Sample Text
  • Variable - Indicates specific variables used in a mathematical expression. 
  • Deleted Text - This puts a strike through selected text (a line through the middle of the text to cross it out).
  • Inserted Text - This underlines text.
  • Cited Work - Visually, text is italicized.
  • "Inline Quotation" - This signifies inline quoted text. 

To preview what these styles do, add one and switch to Source view. The Inline Quotation style will use <q>, which will signify the opening of an inline quotation. Cited Work will create an element that presents itself as such. Conversely, avoid using these special formats to achieve a typographical effect. For example, Cited Work produces italic text, but it would be confusing to a screen reader if you used it just to italicize text for emphasis.