Designing for accessibility is a no-brainer. As designers, we’re responsible for ensuring our audience can process our text and graphics, complete our practice activities, and master our assessments. If the future Linus Pauling is among the 12 percent of learners with sensory, mobility, or cognitive impairments, he or she may require a screen-reader-friendly Periodic Table of the Elements.
But let’s face it: designing for accessibility is frustrating. It limits the colors, images, layouts, and interactions we can use. Replacing a single text box or slide often means tweaking the tab order and, yep, testing it all over again. Alt text merits an article all its own, as do PDFs. “Building a compliant course doubles my development time,” one colleague lamented recently.
Valorie Sundby, Web Accessibility Compliance Specialist at the Accessibility Center of Excellence at Optum/United Health Groups, understands these challenges, but she believes they are worth tackling. She helped design the periodic table linked above. Even her business cards feature Braille.
The daughter of a physical therapist specializing in spinal cord injuries, Valorie saw firsthand the challenges impaired individuals face and helped conference attendees experience these obstacles by using screen reader output to render a web page in a game of “reverse Pictionary“.
We didn’t play that game during September’s Denver Metro eLearning Developer’s (DMELD) meeting, but Valorie shared tips, tricks, and resources in hopes of creating “accessibility champions” who are willing to learn, apply, and teach accessibility at their organizations.
Despite the growing number of accessibility tools available, humans are indispensable. “A tool can tell you if something exists,” Valorie said, “but only you can tell if it makes sense.” And to make that call, we need to consider the context. For example, what alt text would you add to this image so a screen reader can properly describe it?
That depends on what, if anything, the image adds to the learning experience.
- For a gardening course, you might add “Yellow tulips blooming in the spring.”
- A horticulture course might use “Tulipa gesneriana.”
- If the image is a link to the Tulip Society of America, users need to know (a) that it is a link, and (b) where the link will take them.
- If the image appears in an article on tulipmania, it may be a decorative “artifact” that the screen reader should ignore. Again, that depends on the article itself.
And images are only part of the equation. To ensure accessibility, you need to examine all screen elements for:
- Semantic information. Are headings, lists, paragraphs, and tables consistently marked? Skipping heading levels, using blank table cells for page layout, or failing to call out nested lists is a sure way to lose learners trying to navigate with a screen reader.
- Role of elements. Are images, links, tabs, and buttons clearly identified as such? Will learners know what will happen if they click those tulips?
- Name. Do related elements have consistent names? Or is the module title something like “Writing for Social Justice,” with the associated quiz called, “An Idea Whose Time Has Come”?
- Value. If a page contains a check box, is it already selected? If it’s a link, has it been visited? If it’s a text box, is there already text in it?
But what about eLearning? Does accessible learning restrict us to true/false and text entry? Drag-and-drop is famously off limits for visually and motion-impaired learners. Must we choose between clever interactions and accessible content? Valorie doesn’t think so.
“Interactivity is fine as long as you provide an alternate way to offer the same learning experience through keyboard controls,” she said. For example, a screen reader can replicate drag-and-drop, as long as the designer provides tags to identify:
- Draggable objects and targets
- Whether a specific object has been grabbed and dropped
Of course, configuring those tags forces us to stop and examine the goals of the interaction. Are we just adding some variety to a multiple-choice question? Testing where on a body to apply medication? Sequencing items in a list? Something else? What are we trying to accomplish with this interaction in the first place?
Accessible design requires planning, expertise, tools, testing, and creativity. It demands empathy for your learners and a clear vision of what skills and knowledge you want to confer. But this extra thought can reward us by deepening our understanding of just those issues.
Ultimately, accessible design is just good design!