Accessibility Best Practices for LibGuide Content Creators

Rich Text Editor | Preview | Navigational Layout and Columns | Resources

This page focuses on some LibGuide-specific tips and tricks that are useful to creating accessible and informative guides.

Use the options available in the Rich Text Editor as much as possible. Using these options will help maintain accessibility.

Remove Format

The Remove Format icon (which appears as an italic letter T followed by a subscript letter X) will return text to the default formatting. It is recommended that you use this tool if you are copying and pasting text from any other site or document (e.g., another LibGuide, a website, a Word document, a PDF, etc.). According to Springshare, the following formats will be removed: ^[1]

• Font style
• Font size
• Text and background colors
• Bold, italic, and strikethrough formats
• Paragraph alignment and indentation

Use the Preview option to check your guide across various browsers and on mobile devices. (Dragging the screen to a smaller size will mimic mobile device views.)

If something on your guide gets distorted or doesn't function as expected, it needs to be adjusted.

Navigation Layout

LibGuides currently have two options for Guide Navigation Layout: Top- and Side-Navigation. The current recommendation by the LibGuide Working Group is Side-Navigation, but there are times when you might want to use Top-Navigation instead - both for accessibility and usability. Let's look at the benefits and restrictions of each.

Top Navigation (Tabbed Navigation)

Pros

• If you map your entire guide to Canvas, which already has multiple levels of side-navigation, adding another layer of side-nav may be too much. Top level navigation may help differentiate between Canvas and LibGuides.
  • Note: if you are only mapping pages or boxes, this no longer matters.
• You have more control over the size and number of columns available.

Cons

• Studies have shown that top-navigation is more difficult for users to navigate because of "tab blindness", which is the idea that users tend to ignore tabs that are laid out across the top of a site.
• Secondary pages are not displayed. Instead, a small arrow is shown that opens a drop-down menu of secondary pages.
• On mobile devices, top-navigation tabs are crushed together based on the length of the page's title. Additionally, the secondary page drop-down menu is very difficult to access.

Side Navigation

Pros

• Studies have shown that it is easier for users to navigate sites that use side navigation.
• Secondary pages can be displayed automatically. Note: secondary pages are only displayed if the option is turned on. See Springshare's page Guides: Change a guide's page layout template for more information.
• On mobile devices, the primary and secondary tabs are organized in a structured and uniform manner. 

Cons

• You lose the option of having more than a 2 column layout.
• Side-navigation may not be the best option is you are mapping your guide outside of LibGuides, such as within Canvas, LibWizard, etc.

Columns

As mentioned in the Navigation Layout section, the number of columns you have available are dependent upon whether you are using top- or side-navigation. Side-navigation only offers a two column format, whereas top-navigation offers up to 4 columns.

In guides that use the recommended side-navigation option, it is best practice to only place content in the second column. This creates a clear separation between navigation and content. One exception to this would be including your profile box under the navigation box.

In guides that use top-navigation, there are a few key design principles to remember.

1. On a mobile device, the page will be read in this order:
   • Navigational items will appear first
   • Top Box (if used)
   • Column 1 - top to bottom
   • Column 2 - top to bottom
   • Column 3 - top to bottom
   • Column 4 - top to bottom
   • Bottom Box (if used)
2. The width of your columns is important. If your columns are too narrow, they will be difficult to read because content will be broken into multiple lines.
3. The  amount of content included in each column is also important. If columns 1, 2, and 4 only have one box and column 3 has several, a user will have to scroll far down the page to view column 3's content and then scroll back up to view column 4.
   • The most important content should be placed in the top box or the left box.