Guidelines for accessible LibGuides

The Accessibility for Ontarians with Disabilities Act's (AODA) Information and Communications Standard is part of the Integrated Accessibility Standards Regulation (IASR) that includes requirements for accessible websites and web content.

Queen's University has developed a webpage for Creating Accessible LibGuides that is intended to be used as a tool to assist in the creation of LibGuides that meet required accessibility standards under the AODA. It offers tips and guidelines on how to make an accessible and user-friendly LibGuide.

The following list includes information on how to make elements commonly found within LibGuides accessible.

Headings

Screen readers use headings to navigate a document. Use headings in a consistent structure from most (H1) to least (H6) importance. This helps all users navigate the text. Improper headings structure hinders usability and accessibility.

  • Use the heading formatting available from the Style drop-down menu when creating content for your guide.
  • The Page Title is a Heading 1 (H1).
  • The Content Box Title is a Heading 2 (H2).
  • Use Heading 3 (H3) and Heading 4 (H4) to structure your content.
    • Heading 4 is a sub-heading of a Heading 3.
  • Headings and labels should accurately describe the content that follows them.

Hyperlinks

Hyperlinks are used to link your document to a website or another document. Screen readers recognize links and make them searchable.

  • Ensure that the Hyperlink has context and describes where it leads. It should not read “click here.” Instead say, Click here for more information on Library hours or just say Library hours.
  • In addition to making a link’s name unique, make it descriptive so that it is understood out of context. Screen-reader users can adjust their software to read only the links on a page. For this reason, links should provide enough information when read out of context.
  • When linking to a file, indicate the format and document size. For example: Accessible documents (PDF 75KB).

Please note

Copying and pasting content from outside sources can sometimes make a resource inaccessible. Use the remove formatting function to eliminate code that may be problematic.

Images

Provide text alternatives, alt text, for any non-text content. This includes images, symbols, animations, etc. Alt text provides a textual description of images and graphics. The alt text is read by a screen reader. If alt text is not provided, a screen reader will either read the file name associated with the image or ignore it as if it doesn’t exist.

Create alt text in your LibGuide by going to the text editor and filling out the Alt Tag field on the Insert/edit Image screen.

How to create effective alternate text

  • Alt-text descriptions should be as accurate and as succinct as possible.
  • Consider the content and function of your image.
  • Information such as filename or file type should not be included in the alt text.
  • Do not use “Image of ...” or “Graphic of ...” as alt text. Screen readers will state image and then read the alt text.
  • However, if it is a screen shot, indicate “Screen shot of ...”
  • Do not repeat the information which is contained in the document itself into the alt text. If it’s already in the document, that should be enough.
  • Describe images that include text.
  • Remember that screen readers always read the alt text, so image-heavy pages take a long to read using a screen reader.

Style

Using pre-set styles and structuring your website enables individuals using assistive technologies such as a screen reader to easily navigate your website. Pre-set styles tell people what text is a heading or a bulleted list.

Colour

There are a number of important accessibility issues to be aware of when using colour. Colour choices can affect the accessibility of your guide. Individuals who have low vision and those who are colour blind are most affected by lack of colour contrast.

  • Provide colour choices that have enough contrast between the font and the background to enable all individuals to use the page. The higher the contrast between text and background, the easier the website can be readA good example of high colour contrast is black and white. An example of poor colour contrast is light yellow and white.
  • Do not use colour alone to convey important information or to prompt a response. For example, dont ask individuals to fill in fields marked in blue.
  • When formatting for emphasis, use headings, bold or underline. Colour will not be recognized by a screen reader. 

Fonts

  • It is preferable to allow the LibGuide CSS to format the font type, size, and colour. Only change text appearance when there is a real need for something different.
  • Use sans-serif fonts such as Arial, Verdana, Tahoma.
  • Avoid font sizes smaller than 9 point as they are difficult to read.
  • Avoid italics and underlining text other than hyperlinks.

Resources

Tables

When using tables, it is important to indicate what cells are headings and/or rows. This enables individuals using assistive technology to read the information in a logical way.

  • Provide table headings (th) for your rows or columns as appropriate. This will ensure they are accessible to patrons using screen readers. Associating data cells with their headers allows users of screen readers to navigate through the data tables more effectively.
  • Tables should be used to hold data and not for design.
  • It is important to remember that screen readers read tables linearly.

Videos and podcasts

Videos

To be accessible, videos must have a text-based alternative. Videos and screen casts created by the Library must have an accompanying transcript and/or caption.

The Accessibility for Ontarians with Disabilities Act states that “as of January 1, 2021,all internet websites and web content must conform with WCAG 2.0 Level AA, other than, success criteria 1.2.4 Captions (Live), and success criteria 1.2.5 Audio Descriptions (Pre-recorded).”

Podcasts

Podcast feeds that do not give access to transcripts are not accessible to users with hearing impairments.

To ensure accessibility:

  • Include captions and/or transcripts.
  • If external, provide a text alternative to the audio content.
  • If the podcast is library-created, a transcript will have to be created.
  • Podcast Accessibility Tips

Resources

The Queen's Accessibility Hub: Video Accessibility

PDFs

An accessible PDF means that the PDF files are tagged. Tags provide a hidden structure to the PDF content so that a screen reader easily navigate the document.

Before you can create a tagged PDF, you must first ensure that the PDF contains text and is not an image. If it is an image PDF, you will have to convert (OCR) the file.

Resources

Queen's University Accessibility Hub, Creating Accessible PDFs Using Microsoft Word

WebAIM. PDF Accessibility

Usability

Tips

There are many ways in which a LibGuide can be created so that it is easy to navigate and access content.

  • Write web content in clear language.
  • Aim to have tabs contained within one row.
  • Make sure the tab name and the page content are clearly related. 
  • Use strong contrast between text and background.
  • Avoid using too many boxes.

Please note

You do not have to change web content that you don’t control. For example, content on social media sites such as Facebook or Twitter.

Resources and accessibility testing tools

Web accessibility

Queen's University Accessibility Hub: Accessible Websites

WebAIM

Web Accessibility Initiative (WAI)

WCAG at a Glance

Accessibility testing tools

Web Accessibility Initiative (WAI): List of Web Accessibility Evaluation Tools

WAVE Web Accessibility Evaluation Tool

Disability simulation

WebAIM: Screen Reader Simulation

WebAIM: Dyslexia Simulation

Checking for accessibility

The WAVE Web Accessibility Tool will check the accessibility of your LibGuide. 

To check for accessibility, follow these steps:

  • Add the URL of the print version of a guide.
  • Click the Print Guide icon in the top portion of the page.
  • Copy the URL in the address bar.
  • Go to the WAVE tool to get an accessibility report.

http://wave.webaim.org/