Design for Accessibility

Thoughts on Instructional Design and TechSmith Camtasia

There are many different tools for instructional design. And I have seen many different approaches to interactive content. In this blog, I share some occasional thoughts on what I am seeing in this rapidly growing field. Have questions or thoughts to share? Please post your comments below or share them by contacting me.

It is important that instructional videos and interactive modules can be used by everyone, including those with visual impairments. Understanding how contrast impacts visual accessibility is key. There is a handy, free, web-based tool to help ensure visual components have sufficient contrast between foreground and background colors to ensure readability for everyone.

The WebAIM tool allows you to paste in the hex color values for the foreground and background colors. It then displays the contrast ratio, along with the Web Content Accessibility Guidelines (WCAG) AA and AAA ratings for readability.

In the sample images above, the text on the right image has a WCAG AA rating of PASS for large text. The text on the left image has a FAIL rating for all WCAG AA and AAA. This is implicitly obvious, as it is much easier to read the text on the right image than that on the left.

If you are using video, consider dropping the opacity of your video to 35% or so to increase the contrast level for text annotations. Another approach to increasing contrast would be to use the Camtasia Spotlight feature as mentioned in my last blog post. Either method increases contrast levels sufficiently to meet WCAG standards.