With the increasing interest in accessibility, you may wonder how to make sure your courses meet the mark. The Web Content Accessibility Guidelines (WCAG) are a useful resource, but even experienced designers and developers sometimes find them tricky to interpret. Written in tech speak and focused on web development, it’s not always easy to know how they apply to e-learning—much less be sure your courses comply.

But your path to better accessibility doesn’t have to feel overwhelming. In this article I’ll walk you through some simple — but important — changes you can make right now to ensure your courses are more accessible. 

 

1. Keep Text at Size 12 or More

The easiest way to improve accessibility is as simple as adjusting your text size. To be sure your content is clear and readable, make sure your font is at least size 12—and larger is often even better. This adjustment takes almost no time at all and makes a huge difference immediately.

 

2. Make All Buttons 44 x 44 Pixels or Larger

Another quick win involves button size. When buttons are too small, they’re difficult to click accurately—particularly for learners with motor impairments. A good practice is to ensure your buttons are at least 44 x 44 pixels. The bigger the button, the easier it is for learners to interact with. See for yourself with this example.

 

3. Hide Decorative Images from Screen Readers

It’s not uncommon to use photos and illustrations just for aesthetic reasons. While they may reinforce the course look and feel, if not handled the right way they can be challenging for learners using screen readers. This is because these tools default to announcing everything on the screen. So, learners using screen readers may have to repeatedly press the tab key or screen reader navigation keys, to get past these graphics towards meaningful content.

The good news is that there’s an easy fix. If an image is simply decorative, your authoring app might allow you to completely hide it from accessibility tools. This way, screen readers won’t announce it at all.

How can you tell if an image is decorative or informative? Ask yourself this: If I removed this image, would it take away from the learning experience? If the answer is yes, it’s an informative image. If the answer is no, it’s likely decorative. 

 

4. Add Alternative (Alt) Text to Informative Images

Now it’s time to turn to your informative images. To make them more accessible, be sure to add alternative (alt) text—descriptive text that screen readers announce to learners—to explain what each image depicts.

Most authoring tools have a feature for adding alt text, so it’s easy to include it in your courses. Then it’s just a matter of writing a description that sums up what’s meaningful about each image. Not sure what makes great alt text? Check out WebAIM article.

 

5. Use Contrasting Colours

Being thoughtful about your colour choices is another simple way to improve accessibility. Contrast is the difference in brightness between colours. When you use a strong contrast between items—like text and buttons—in the foreground and background, you can ensure your learns will find your course is easier to read and to interact with for learners.

The WCAG has specific recommendations about what contrast ratios work well. Thankfully, for AA compliance there are just two ratios you’ll need to keep in mind:

• 4.5:1 - This is the contrast most of your text should have with the background colour.
• 3:1 - Use this ratio for the colour of interface elements—like buttons— and larger text (≥ 14 point bold or 18 point regular) compared to the background colour.

Tools like colour contrast checkers and accessible colour palette builders can then help you quickly confirm your choices meet or exceed those ratios.

 

6. Include Closed Captions and Transcripts for Audio and Video

To make your audio and video content more accessible, add closed captions and transcripts. Why both? Because learners who are both deaf and have vision impairments can’t access captions. Not to mention that transcripts also allow people with cognitive impairments to read at their own pace.

If your course uses a lot of audio and video, consider including a downloadable complete transcript at the beginning of the course. That way learners can follow along using one single file.

 

7. Check Your Focus Order

It’s important to make sure screen readers narrate the on-screen text and objects in the order you intended. For instance, if the content of a process interaction was read out of order, that could be incredibly confusing for learners. 

Some e-learning authoring apps take care of setting up the correct focus order for you entirely. Others might do most of the work, but require you to double-check it for accuracy—particularly with customised layouts. In those cases, the best time to do that review is near the end of your development, when your layout is finalised.

 

The Bottom Line

All these tips are easy to start using right now. And they go to show that improving accessibility doesn’t have to be complex or time-consuming. With just a few new techniques you can make a significant leap forward in the level of accessibility you’re providing. And that improves the learning experience for everyone!

Want to learn more about making accessible e-learning? Check out this helpful article series: All About Accessibility.

 

 

Allison LaMotte

Manager, Community & Customer Engagement, Articulate