Accessibility Challenges in Lab Simulations
Matthew Ralston, Greg Gay · 2021 · Proceedings of the 18th International Web for All Conference (W4A) · doi:10.1145/3430263.3452439
Summary
This paper describes the accessibility challenges encountered and solutions developed when creating online lab simulations for an Occupational Health and Safety course at Ryerson University (now Toronto Metropolitan University). The COVID-19 pandemic accelerated the shift from in-person labs — where students physically measured workplace noise, light, and heat levels — to online simulations. The authors developed four types of simulations: workplace simulations where students navigate isometric views of workplaces (garages, offices, restaurants) taking readings at grid squares with virtual devices (sound level meters, dosimeters, light meters, thermometers, air velocity meters); a sound level meter simulation measuring sound at different distances and angles from a source; and an audiometer simulation where students test virtual patients' hearing thresholds at different volumes and frequencies. Each simulation presented unique accessibility challenges because they relied on custom interactive interfaces with non-standard navigation patterns, visual feedback mechanisms, and spatial interactions that fell outside typical web accessibility guidelines.
Key findings
The team achieved full keyboard navigability and screen reader support across all simulations using standard web accessibility techniques. Key solutions included: setting logical tab orders matching the lab workflow to minimize keystrokes; using aria-live regions to announce dynamic changes like measurement readings and status updates; providing options to mute audio and disable animations with equivalent screen reader output; using SVG overlays with focusable polygon elements for navigable grid maps (replacing image maps that were harder to style); reading measurement ranges rather than fluctuating values via aria-live to avoid overwhelming screen reader output; and using aria-labels to convey instructions and status for interactive elements like hotspots and buttons. For the audiometer simulation, screen reader announcements were used to convey when tones start and stop playing, and the test subject's hand-raise response was announced after the tone finished to avoid being drowned out by the actual audio. The workplace grid navigation used invisible spans with aria-live to announce current row, column, and room as the user moves through the map.
Relevance
This paper provides a practical playbook for making interactive web-based simulations accessible — a challenge that extends well beyond educational labs to any custom web application with non-standard UI patterns. The specific techniques demonstrated are directly applicable: using logical tab order to mirror task workflows, choosing aria-live announcements carefully to avoid noise, replacing images with SVG for better focusable elements, and providing text alternatives for audio and animation cues. The work is particularly relevant as online learning continues to expand post-pandemic and accessibility of interactive educational content remains a significant gap. The solutions show that even highly visual, spatial interfaces like isometric workplace maps can be made keyboard-navigable and screen reader-compatible without compromising the learning experience. The paper is brief but dense with implementation specifics that practitioners can adapt.
Tags: education accessibility · online learning · keyboard accessibility · screen reader accessibility · ARIA · web accessibility · simulations
Standards referenced: WCAG · WAI-ARIA