Adding Media, Interactivity, and Mathematical Equations
In this chapter, you will learn what you can do to ensure that the OER you create are accessible to learners with diverse needs. Exemplary OER follow the best practices of web design to ensure that people with disabilities—including auditory, cognitive, neurological, physical, speech, and visual disabilities—can perceive, understand, navigate, interact, and contribute to the material.
“Open Dialogues: Open education and accessibility” by the Centre for Teaching, Learning and Technology, University of British Columbia [YouTube] is licensed CC BY 4.0.
The principles of universal design are the foundation for the most inclusive learning tools and environments. The authors of the BCcampus Open Education Accessibility Toolkit – 2nd Edition define universal design as “the process of creating products (devices, environments, systems, and processes) that are usable by people with the widest possible range of abilities, operating within the widest possible range of situations (environments, conditions, and circumstances).” They recommend considering each of the following aspects of any educational resources you use:
- Do I have visual materials that present core concepts that not all students may be able to see or understand?
- Do I have multimedia materials (e.g., audio, video) that present core concepts that not all students may be able to be hear, see, or otherwise access?
- Do I have documents that present core concepts in a format that not all students may be able to access?
If your answer to any of these questions is “yes,” then some work is needed to ensure that these materials are accessible to all your students.
A related concept is Universal Design for Learning (UDL), which is “a framework to improve and optimize teaching and learning for all people based on scientific insights into how humans learn.” At its core, UDL asks that learners be provided with multiple means of engagement, representation, and action and expression in their learning. These multiple means are aimed at addressing the following:
- How is student interest in learning engaged and sustained?
- How is information made perceptible and comprehensible?
- How are students able to respond to, communicate, and/or express their learning?
Text and Image Readability
Whenever you are presenting content to students, it’s important to check whether the text in your course content is recognizable to a computer as text. For example, accurate optical character recognition (OCR) is often required to make the text in a PDF understandable to screen readers. Other best practices for making course materials readable include those described in the sections below.
Using Heading Levels (H1, H2, H3, etc.)
Text-based OER should have a clear and logical structure. Using headings and other structural elements to organize your webbook can make it easier for all learners to access and understand the material. Many editing tools support table of contents (TOC) generation based on the placement of section markers within a text, which can help students navigate to a specific chapter or section of the 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 webbook when heading levels are applied consistently.
Using True Lists
Using asterisks or icons to visually separate the items in a list may look similar to a bulleted list, but it can confuse a screen reader that is expecting to encounter structured content. Whenever listing items, use the true list features of your content editor.
For example, do use the bulleted list feature.
- First item
- Second item
Or, use the numbered list feature.
- First item
- Second item
But do not use asterisks, as in the following example:
* First item
* Second item
Providing Alt Text and Captions
No matter what the subject of an image used in your webbook may be, you need to offer descriptive text for that image. 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 text, or “alt text”. This aspect of the accessibility of instructional content is commonly overlooked even though 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 about the image. Do not include extraneous details. In some cases, you do not need to add alt text at all, as in the case of purely decorative images.
The following are examples demonstrating necessary alt text and extraneous alt text:
- Necessary descriptive alt text: “Part A: a container holding volume V subscript 1 of gas on the left side only. Part B: a container filled with volume V subscript 2 of gas.”
- Too much descriptive alt text: “There is a figure with a white background and two squares labeled A and B. Part A has a rectangle (representing a container) with a shaded grey section on the left half of the container with dots representing a gas. The gas is labeled V subscript 1. Part B …”
- Unnecessary descriptive alt text: “An icon of a person smiling, included to liven up the page!”
Video and audio content needs descriptive text as well, but it usually takes the form of captions or, in the case of audio-only content, transcripts. You can easily add captions to videos by using YouTube’s built-in editor tools. Some free tools you can use to create transcripts are Otter and Descript.
Using Descriptive Link Text
When you include hyperlinks (implicit links) in your webbook, be sure that the linked text describes the topic or purpose of the link. Readers should be able to determine the purpose of the link from the text alone without additional information justifying the use of the link, such as generic text that says “click here” or “read more.”
Compare the following examples:
- An example with descriptive link text: “CUNY’s Accessibility Toolkit for Open Educational Resources provides additional guidance on creating accessible OER.”
- An example of generic text: “Click here for more information on creating accessible OER.”
If the OER design does not permit the inclusion of explicit links (written out URLs) in the text, implicit links (hyperlinked text) can be used, and a more detailed list of sources should be provided at the end of the resource or in a separate document. Footnotes are a great way of providing more explicit links for content without cluttering the text on a page.
For more information about creating accessible links, including links to content that is not a web page, see the chapter Links in the the BCcampus Open Education Accessibility Toolkit – 2nd Edition.
Using Accessible Fonts and Colors
Some best practices for ensuring that fonts and colors are accessible include the following:
- Use dyslexic-friendly fonts, such as Arial, Century Gothic, Open Sans, and Verdana. Your institution might recommend certain fonts for digital and print materials. These recommended fonts are usually chosen for ease of use and accessibility and may be a good fit for your needs as well.
- Make sure there is a clear contrast between colors (e.g. between the background and font color, or between different colors on a graph). There are many free online tools available for checking color contrast, but we recommend WebAIM’s Contrast Checker and Acart Communications’ Contrast Checker.
- Do not use color to communicate meaning without other markers of that meaning present. If you have color-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.
File Format and Software Choice
The usability of an OER is heavily impacted by how easily users can access it. Two aspects of content design that are inherently tied to accessibility are a resource’s file format and the software used to access it.
Open File Formats
If someone wants to read your work, they need to be able to open the file on their computer; however, some file formats require specific proprietary software to open. Saving your work in open file formats can give your students more options for accessing their course content on whatever platform best meets their needs.
- Open formats: HTML, ePub, RTF, Mobi, PNG, XML, PDF, Markdown
- Proprietary formats: MS Word, Pages, PowerPoint, Keynote
Some software used to create or display content disables accessibility features built into your computer’s operating system, such as zoom, text-to-speech, and speech-to-text. It is important to check whether the software students will use to view your course content disables the accessibility features of their computer’s operating system. This can be an issue both for OER and for traditional, publisher-provided course content.
- Is the software used to view the OER compatible with most assistive devices?
- Does the software require point-and-click interaction to work properly?
- Can the software menus be “seen” and properly interpreted by screen readers?
Pressbooks itself was created with accessibility in mind, as described in its statement on Accessibility.
Online Accessibility Tools
A great deal of OER content is displayed on websites, so we can use accessibility-checking tools to identify areas that can make it difficult for assistive technology tools to work properly. The online WAVE tool does just that: identifying errors and possible issues with the accessibility of websites.
Additionally, the Flexible Learning for Open Education (FLOE) website provides access to a suite of tools intended to engage “diverse learners and educators to design more inclusive forms of teaching and learning,” based on the belief that “learning happens best when the experience is personalized to individual needs.” For more information, see FLOE’s Inclusive Learning Design Handbook or visit their source code on GitHub.
- This chapter is based on the chapter Accessibility and Usability in The OER Starter Kit by Abbey Elder, published under a Creative Commons Attribution 4.0 International License, and includes material adapted from the ABOER Starter Kit by Technologies in Education at the Faculty of Education, the University of Alberta, published under a Creative Commons Attribution 4.0 International License. The chapter has been revised in accord with the style, structure, and audience of this guide. ↵
- This definition of web accessibility is based on an Introduction to Web Accessibility from the W3C Web Accessibility Initiative (WAI). ↵
- This information is from the chapter Universal Design in the BCcampus Open Education Accessibility Toolkit - 2nd Edition by Amanda Coolidge, Sue Doner, Tara Robertson, and Josie Gray, published under a Creative Commons Attribution 4.0 International License. ↵
- This framework was created by CAST, a nonprofit education research and development organization. ↵
- The section File Format and Software Choice was adapted from About Accessibility by Affordable Learning Georgia and UH OER Training by Billy Meinke, published under a Creative Commons Attribution 4.0 International License. ↵
text that describes the appearance, content, and/or function of an image