Introduction to Accessibility: Act One

Introduction to Accessibility: Act One

Written by Kristy Lacroix, Digital Media Specialist for the Manitoba Flexible Learning Hub

Edited by Nancy Fischer and Erin Thomas

The Exposition

Digital Media Specialists are able to create fun and immersive visuals that enhance the learner experience of online courses. An important element to our designs is that we must always take into consideration accessibility and offering accessible content.This is also an important element for instructors when first writing and organising their course material. How do we ensure that our online course content meets accessibility requirements? What can we do to guarantee that our course content can be accessed by any learner at any time and provides equal opportunities to achieve course learning outcomes? To answer these important questions, let’s use the assistance of an analogy; a process with which we are familiar… the process of translating a story from screenplay to film.

Act One, Scene One

In this scenario, our “story” is the content of an online course. But how do we begin to tell this “story,” or any story, for that matter? We tell it with words, and we use a lot of them! In order to make a course fully accessible, we should begin with a complete written transcript of all content, including images or videos we intend to use. If our course was going to be made into a film, what level of detail would be required in order for a story artist to create a visual storyboard from our materials? When developing a screenplay, the author must consider that everything they write down will need to be translated into a visual storyboard by a story artist, and that artist will depend on the visual descriptions provided by the author. Similarly, when an instructor authors a course, all content must have a written descriptive counterpart, as screen-readers rely on clear descriptions and well-organised content to articulate a course correctly and to ensure the quality of the course.

Act One, Example One

We will first look at a creatively designed mathematics course as an example. Let us suggest that for this particular course, we want our students to assess a curve on a graph and work backwards to identify the equation based on their visual observation. Normally, the descriptive text for a graph would be the equation that the graph represents. In this case, however, we would be giving students who accessed the alternative text the answer to the question unfairly, so how can we describe the graph to meet our learning outcomes and provide an equal and inclusive learning experience? The solution is to describe the curve on the graph itself, without use of the equation. Now, if we have dozens of graphs we want to use in the course we may want to reassess our design, as writing descriptions for graphs without being able to use their equations might add quite a lot of time to our project scope! However, not making the graphs accessible and thereby not creating an equal learning experience is, of course, not recommended, so descriptions must be created for this course content that support an innovative approach to mathematics delivery.

graph, curve, mathematics
How would you describe a graph in order for a student to derive an equation from the description with no access to the visual?

Remove Unnecessary Content

As you might have gathered, ensuring accurate and meaningful written content for any visual component of a course can be quite a lot of work and should be considered in the first phases of project scoping. This is where we enter the realm of “necessary” vs. “unnecessary” content. Necessary images will add to the success of the learners taking the course. Charts, historical photographs and examples of fine artworks, are visual elements that enhance the learning experience and quality of the course. Conversely, adding additional elements like unnecessary images or emoticons in text may confuse screen-reader software and create poor learning experiences for students who utilise these technologies.

yes, you, can, motivation, poster

Act One, Example Two

Here is a good example of an unnecessary image: it’s a pleasant graphic and lovely sentiment, but it doesn’t provide you with any additional information on the topic of accessibility.

Of course, there are ways to design a visual piece that contributes both aesthetically and practically, as in the case of this Web Accessibility for Designers infographic. You can bookmark or print this excellent resource for reference when designing your own online courses. Our team refers to it regularly.

The Epilogue

To summarise the content of this article, please remember the following points:

  • When designing a course, write absolutely every aspect of the content down.
  • If you choose to enhance your course content with images or videos, consider how best to describe this content to someone who has to create a visual from only the written description, much like a storyboard artist creating visuals from descriptions in a screenplay.
  • When estimating a scope for your course content, consider how certain elements may require additional written effort in order to meet accessibility standards.
  • Familiarise yourself with Accessibility Best Practices to ensure quality in your course.

Join us next month for our coming accessibility instalment – Act Two – where we will discuss tips specific to creating accessible PDF documents that can provide both aesthetic visual and practical components to an online course.

Image List

  1. Smolaw11. “Work stay at home, Director handwriting film storyboard or shooting board, Screenplay, dialog picture for film with characters, Scripted sequence, predefined series of event, pre-production media – stock photo.” Getty Images, Royalty-free, #1289884539, Thailand, URL:
  2. FrankRamspott. “Hand-drawn vector drawing of an Infographic regarding the Coronavirus, Flatten The Curve. Black-and-White sketch on a transparent background.” Getty Images, Royalty-free, #1212710004, Germany, URL:
  3. Cienpies. “Yes you can colorful typographical Poster. Inspirational motivation quote design background.” Getty Images, Royalty-free, #528068947, URL: