×

Elearning accessibility - inclusive digital learning design

Blog posts | 20.05.2021

Kineo

Shaping the future of learning

Read a good book recently? Enjoyed a fantastic tv program or film? A great experience is arguably as much about the needs, wants, experience and values that the consumer brings to it as what the original creator puts into it. It takes two to tango, right? Equally, a great learning experience depends so much on the learner and their needs. It doesn’t matter what we put into a learning experience if the learner can’t access it well or have a high quality experience of it. 

And a learning audience is rarely a homogenous group. Key for any digital learning project, is to start with the learners in mind, understanding their range of requirements, including accessibility requirements, and tailoring your approach to meet the full variety of needs. Great learning experiences should be great no matter what your learner’s individual needs are, including users with accessibility challenges or disabilities. 

Good UI and UX principles go a long way to supporting accessibility provision, but one size doesn’t always fit all. The best learning strategy may mean different experiences for learners with different needs. Obviously those experiences should be equal in quality of experience but they might be different in mode of delivery in order to optimise for different needs. 

Often the best approach is to create elearning that is accessible to all. Because of the nature of elearning this is not necessarily as straightforward as it may seem; read on to learn about the main areas of consideration for accessibility in digital learning and what you should consider best practice in your workplace elearning programs.  

Understand the different types of challenges learners may face

There are various reasons why people could face issues with accessibility, whether it be from a disability, illness or accident or they may develop impairments with age. Some may not consider themselves to have a disability, but will have certain limitations that affect their experience.

Barriers to accessibility in elearning fall into the following main categories:

  • Visual – such as loss of sight, color blindness or increased sensitivity
  • Auditory – such as mild or moderate hearing loss
  • Mobility – such as difficulty using a mouse or keyboard
  • Cognitive and neurological – includes neurodiversity such as dyslexia, autism or learning difficulties 

Understand the technical challenges

Elearning is typically much more complicated than a regular webpage. Most web content consists of little more than static text, graphics and video. Elearning on the other hand employs a plethora of interactions; MCQ’s, sliders, drag and drop, text reveals and their ilk; building and using these in a way that doesn’t present a barrier to some of your audience is both a technical and a design challenge. 

How can you make your elearning accessible?

There are some simple solutions and assistive technologies to accommodate accessibility such as: 

Follow the guidelines

The WCAG is an international set of standards designed by the World Wide Web Consortium (W3C), a group of organizations, staff and members of the public who look to address common barriers to accessibility online. 

There are three levels of WCAG – A, AA, and AAA. ‘A’ signals the very minimum level and ‘AAA’ the highest, meaning accessible to all. Most companies will aim for ‘AA’ standard or above, so when working with a partner it’s important you know what level they are working to. 

W3C publish a very handy Quick Reference guide to meeting WCAG which is a great starting point. 

Keep it simple

The more complexity you add in terms of interactivity and course structure, the more difficult it will be to make the content accessible. Some interactions, such as the notorious drag and drop will never work well for learners with motor impairments or who are using an assistive technology to navigate the course. Most interactions can be built to be accessible, but every interaction should be seen as a potential impediment to accessibility and used sparingly. 

Clear navigation  

Make sure the navigation through your course is as simple and linear as possible and that the UI is consistent. You should ensure buttons appear in the same place (forward and back for example) and if you have a menu the menu options appear in the same order throughout the course. A lot of this is basic good UX and everyone will benefit from clear navigation, but for learners using screen readers or a screen magnifier they’ll find it much easier if they can reliably predict where navigational elements will appear on screen.

Structure the page properly 

All pages in your course must follow a clear structure with consistent use of headings and regions. This not only helps all learners to orientate themselves and process your content but is particularly important for users of assistive technologies which use the underlying structure to enable users to navigate and quickly scan through content. 

From a technical perspective, you can use either semantic markup or WAI-ARIA labels to specify the structure. For Adapt we have opted to use ARIA as it gives us more functionality and flexibility. 

Keyboard accessibility  

Learning content should be keyboard-friendly, so that learners aren’t reliant on the use of their mouse. With keyboard accessibility, learning can be undertaken on any device.

Proper contrast colors 

To comply with WCAG colour contrast rules, there should be a good contrast between foreground text and background colors. You can check contrast ratios by using a tool such as WebAIM color contrast checker.

Learners with low vision will often have difficulty reading text with low contrast and color contrast levels can also be an issue, for example in case of color blindness. 

Larger fonts 

Some fonts are more challenging to read.  As a rule, choose a larger rounder font as these are easier on the eye and keep the focus on the learning content.  

You should also ensure text can be resized, to allow users to make text larger – this can usually be taken care of by the web browser but you’ll want to check the maximum size increase (usually 200%) doesn’t affect the functionality at all. 

Text alternatives (or alt-text) 

Hopefully everyone is aware of the need to script alt-text which is used by screen readers to describe images that may not be visible to the learner. Writing effective alt-text is an art form; it must be concise, descriptive and useful; an aid to comprehension not a distraction. If an image isn’t descriptive, you shouldn’t provide alt text (i.e. leave it as an empty attribute); W3C provide useful guidelines in their Web Accessibility Tutorials.

Screen readers  

An assistive technology software solution that renders text and image content into speech or braille. Screen readers are essential to those that are vision impaired, or struggle with reading and comprehension. JAWS and the open source NVDA screen readers continue to be market leaders, but we are finding that the screen readers bundled by Microsoft and Apple into their operating systems (Narrator and VoiceOver) have improved hugely in recent years and are becoming more popular.

Use Adapt

Kineo and the Adapt open source community have spent a lot of time optimizing the accessibility implementation of the Adapt authoring tool and making it easy for designers to create elearning that works brilliantly with screen readers. For a detailed explanation of our approach head to the accessibility page on the Adapt Wiki. 

We are proud of our accessibility expertise and love to create better learning experiences for everyone, so if you’d like help creating your own accessible elearning, get in touch

You can also join our upcoming Kineo Conversation on elearning accessibility on Thursday 17th June for more!

Kineo

Shaping the future of learning


Kineo helps the world’s leading businesses improve performance through learning and technology. We’re proud of our reputation for being flexible and innovative, and of our award-winning work with clients across the world.

You are using an outdated browser.

For a better browsing experience we recommend

I understand (close)