Case Study: Accessibility Engineering for Canada Learning Code
- Client: Canada Learning Code (CLC)
- Role: Accessibility Consultant & Chapter Lead
- Timeline: 2016–2020
- Focus: Technical auditing, framework extension, and mentorship
Overview
Canada Learning Code is a national non-profit dedicated to providing computer science education to all Canadians. My work with CLC evolved from community leadership into a specialized technical consultancy role focused on making their digital learning environments truly inclusive.
The Challenge
As CLC transitioned more materials to digital formats, they utilized Inspire.js for their workshop slide decks. While Inspire.js is a powerful framework, it lacked several out-of-the-box accessibility features required for a "coding for all" mission. Learners using screen readers or keyboard-only navigation faced significant barriers when trying to follow along with live workshop content.
The Solution
1. Engineered the Inspire.js A11y Plugin
To solve the structural issues within the slide framework, I developed a custom accessibility plugin. This wasn't just a patch, but a set of enhancements that provided a semantically rich experience for assistive technology.
Key Technical Features:
-
Semantic context: Programmatically injected
role="region",aria-roledescription="slide", and uniquearia-labelattributes to every slide. - Focus management: Created a visible focus indicator reset for keyboard users and ensured that focus shifted directly to the slide content container upon navigation.
- Keyboard-ready controls: Generated an accessible link list for previous/next controls, ensuring the interface was fully operable without a mouse.
- CSS helper classes: Integrated utility classes to manage visibility and layout specifically for accessibility needs.
2. Comprehensive Digital Audit (2020)
I conducted a deep-dive audit of the canadalearningcode.ca brochure website. This involved mapping out remediation steps for the public-facing site to ensure WCAG 2.1 compliance, covering everything from navigation landmarks to complex form interactions.
3. Grassroots Leadership (2016–2018)
Serving as a Chapter Lead , I bridged the gap between technical standards and human experience. I organized monthly workshops, marketed sessions to local learners, and provided 1:1 mentorship to help students unblock technical issues in real-time.
The Impact
The implementation of the Inspire.js plugin transformed the core educational tool used by thousands of learners across Canada. By making the workshop slides accessible, we ensured that the path to learning how to code was open to everyone, regardless of the tools they use to access the web.
Technical Reference:
- GitHub Repository: svinkle/inspirejs-a11y-plugin