Enhancing eLearning Courses for Accessibility Using Articulate Storyline, NVDA, WebAIM and WCAG Guidelines

CUSTOMER: Professional Training & Consulting Services Provider

INDUSTRY: Learning & Development

TECHNOLOGY USED: Articulate Storyline 360, NVDA, WebAIM

About The Client

The client is a professional training and coaching services provider based in Canada, specializing in diversity, employment equity, and harassment prevention training and consultation. They provide cost-effective, web-based courses for employees and leaders/managers on the importance of respectful workplaces, diversity, and inclusion. They also offer practical tools and step-by-step conversation guides to reinforce the training and support employee engagement. They have helped organizations across the globe achieve their diversity objectives by providing in-person training, conducting organizational reviews, and identifying best diversity practices.

Business Need

The client had several Articulate Storyline courses which were not standardized. As a priority, besides standardization, they also wanted to make the entire portfolio of existing courses WCAG 2.1 AA and AAA (Web Content Accessibility Guidelines) compliant.

While making these courses accessibility compliant, through global changes such as color scheme, standardization of type, font color, title positioning, Alt-Text, media for screen reader, tab indexing, and so on, the client wanted the following challenges to be resolved:

  • Screen contrast ratios: To make the courses accessible to people with low vision or color blindness.
  • Interactivity: Exclusion of functionalities such as drag-and-drop and fill in the blanks to conform to the WCAG guidelines and improve course usability. The interactivities were modified into Multiple-choice questions (MCQs)/ Multiple-response questions (MRQs) and Click and reveal interactions.

Harbinger’s Solution

Harbinger’s team of Instructional Designers (IDs), Graphic Designers (GDs), Quality Analysts (QAs), and Project Manager (PM) took charge of the revamping of the courses to make them compliant with WCAG recommended and universally acceptable accessibility guidelines.

Articulate Storyline 360 was used as a development tool to ensure easy maintenance and updating of the courses, and NVDA screen reader and WebAIM to evaluate Web Accessibility.

A blend of global format changes and functionality enhancements as outlined below helped accomplish the Accessibility goal successfully:

  • Re-development of screens to fit the WCAG criteria.
  • Changes made to course color scheme to fit contrast ratio as per WCAG guidelines.
  • Standardization of font type, font color, and font size.
  • Consistent alignment of page title throughout the modules.
  • Inclusion of Alt-text to relevant images and appropriate media for the screen reader to read.
  • Realignment of Tab order of the on-screen components to make navigation easier.
  • Auditing to ensure that course content/screens aligned with the WCAG AA Accessibility guidelines.

Solution Snapshots

Business Outcomes

The implementation of courses as per WCAG guidelines empowered learners to have accessible, compelling, and enjoyable learning experiences.

Some of the benefits included:

  • WCAG Compliant course catering to the learning needs of specially-abled people.
  • Interactive and functional media elements that made the courses accessible to a wide range of learners.
  • Optimized content from the SEO (Search Engine Optimization) perspective.
  • Flexible designs ensuring easy access and improved usability for individuals with special abilities, learning styles, and devices.

Client Testimonials

“Harbinger, you have been excellent throughout the development process. We appreciate your creative contributions to our cause. The courses looked systematic and aligned. Our team is very happy to see the look and feel of all courses.”

– Project Manager


    Do you have a similar case to discuss? Let’s talk!