Accessibility and Usability

Accessibility is one of the things that will determine the usability of an OER for learners with diverse needs. Exemplary OER borrow many best practices from web design, ensuring that content is readable and works as intended for all users. While you are not expected to become an accessibility expert, you will provide front-line checks for basic web accessibility, as described later in this chapter. Let’s start with a bit of background information.

Here is a definition of web accessibility from W3 Schools:

Web accessibility means that people with disabilities can use the Web. More specifically, Web accessibility means that people with disabilities can perceive, understand, navigate, and interact with the Web, and that they can contribute to the Web. Web accessibility also benefits others, including older people with changing abilities due to aging.

CTLT University of British Columbia. (2017, July 28). Open dialogues: Open education and accessibility. [Video file]. YouTube.

Image & Text Readability

Whenever you are presenting content to students, it’s important to check whether the text in your content is recognizable to a computer as text. Accurate optical character recognition (OCR) is often required for PDFs to make the text understandable. Screenreaders require this information to relay text back to students accurately. Other best practices for making course materials readable are listed in the sections below.

Use heading levels (h1, h2, h3)

Text-based OER should always have a clear and logical structure. Using headings and other structural elements to organize your resource can make it easier for all learners to access and understand the material. Many editing tools support table of contents (TOC) generation based on where these section markers are placed. This can help students navigate to a specific chapter or section of a text, especially if the digital version of the resource has its TOC hyperlinked to each section within the text.

Individuals using screen readers can also more easily navigate the sections of your content when headings levels have been applied consistently.

Use true lists

While they may “look” similar to bulleted lists, using asterisks or icons to create a visual list of items can confuse a screenreader that is expecting to encounter structured content. Whenever listing items, use the true list features of your content editor, such as bullet points or numbered lists.

Provide alt text & captions

No matter the subject of an image used in your content, you need to offer descriptive text. A screen reader will look for a contextual description of an image to share with readers, which should live in the text surrounding the image (title or caption) or as alternative (“alt”) text. This is one of the most commonly overlooked aspects of accessibility for instructional content, but most text editors include tools for adding alt text to images.

When adding alt text to an image, be sure to clearly and succinctly describe the most important elements for the student to know. Do not include extraneous detail. In some cases, you do not need to add alt text at all, as in the case of purely decorative images. In the case of complex images such as charts, graphs, flowcharts, etc., we include long descriptions. Long descriptions are linked in the caption of the figure or image and the actual text is located at the end of the chapter page.

Video and audio content also needs descriptive text, but these usually take the form of captions or, in the case of podcast recordings, transcripts. You can easily add captions to videos using YouTube’s built-in editor tools or other video software. As OER Assistants, you would not need to add captions. It is something that you would flag for the instructional designers or send back to the faculty.

Use descriptive link text

Ensure all web pages and web links have titles describing a topic or purpose. The purpose of the link can be determined by the text alone. That is, you don’t need to include additional information justifying the use of the link. You want the link to be meaningful in context. For example, do not use generic text such as “click here” or “read more” unless the purpose of the link can be determined by meaning in the surrounding content. If the link is opening a file (not another web page), that is also indicated. Please see the examples below.

Use accessible fonts & colours

OER should be readable for those with disabilities related to colour as well. Some best practices for ensuring that fonts and colours are accessible are described below:

• Use dyslexic-friendly fonts like Arial, Century Gothic, Open Sans, and Verdana. These recommended fonts are usually chosen for ease of use and accessibility and may also be a good fit for your needs. We stick with three themes that take care of this.
• Ensure there is a clear contrast between colours (e.g. between the background and font colour, or between separate colours on a graph). There are many free online tools available for checking colour contrast, but we recommend WebAim’s Color Contrast Checker and ContrastChecker.com.
• Do not use colour to communicate meaning without other markers of that meaning present. If you have colour-dependent information in images or within the text of your resource, be sure that either alternative methods of recognition (such as differing patterns) are present or that the contrast can be adjusted by users.

Assessment Approach

Conestoga College assesses the accessibility of our OER projects using the following approaches. Click on the links to review the checklist and tools we use.

• Using accessible platforms provided by eCampusOntario: Pressbooks and H5P
• Self-evaluation and manual testing
  • Accessibility Checklist for OER Development
• Consultations with accessibility experts employed with Conestoga College
• Online, open-source tools:
  • WAVE accessibility evaluation
  • WebAIM Contrast Checker
  • WCAG Color Contrast Checker browser extension