EQUAL ACCESS
FOR OVER 8M
DAILY USERS
Collaborated with Bell Media’s development and design teams to ensure the CTV News website met AODA and WCAG 2 standards, improving access to critical news for over 8 million daily users.
ROLES
FRONT END DEVELOPPER, UX DESIGNER
Tools
HTML, CSS, SWIPER, JAVASCRIPT
YEAR
2024-2025
the challenge
THE PROCESS
RESULTS & IMPACT
TAKEAWAYS
1
THE CHALLENGE
Our team was tasked with bringing the CTV News website into compliance with AODA and WCAG standards within just two quarters. As part of the task force working on this initiative, my challenge was to bridge the design and development teams, applying UX insight to help ensure that accessibility fixes were both technically feasible and user-centered. The site’s size, legacy code, and inconsistent design patterns made the remediation effort complex to scope and execute.
2
THE process
Keyboard navigation
FOOTER MENU REDESIGN
ROTATOR MIGRATION
SETTING UP FOR SUCCESS
Our team was tasked with bringing the CTV News website into compliance with AODA and WCAG standards within just two quarters. As part of the task force working on this initiative, my challenge was to bridge the design and development teams, applying UX insight to help ensure that accessibility fixes were both technically feasible and user-centered. The site’s size, legacy code, and inconsistent design patterns made the remediation effort complex to scope and execute.
KEYBOARD
NAVIGATION FIXES
Addressing keyboard navigation required thorough research into accessibility best practices, especially around proper tab order and logical page structure. Many fixes revealed deeper problems—for example, ensuring a correct tab sequence meant verifying that each page had only one H1, which led to cross-team collaboration to resolve structural inconsistencies. Agile and Scrum practices were essential here; sprint planning, refinement, and constant teamwork helped us re-scope tasks as new issues surfaced and fold them into the initiative without derailing overall progress
USER TESTING AND DISCOVERY
As part of the initiative, our team conducted usability testing with a keyboard-only user, which provided invaluable insight into real-world navigation challenges. Their feedback helped us identify high-priority areas needing immediate attention, including the footer menu, whose navigation issues became especially clear during testing. This discovery directly prompted my involvement in the footer redesign and pushed the task from a small fix into a meaningful improvement for accessibility and usability.
KEY TAKEAWAYS
Ensuring reliable keyboard navigation is essential for creating an inclusive experience, and applying best practices in tab order plays a major role in that effort. My design background helped me interpret user feedback and translate accessibility findings into clearer, more intuitive UI structures. Working on this initiative deepened my understanding of software development workflows, collaborative problem-solving, and accessibility standards—ultimately making me a stronger, more informed designer.
FOOTER MENU REDESIGN
While working on fixing keyboard navigation issues, it became clear that the existing footer menu needed more adjustments than originally scoped. The old version lacked a clear information hierarchy, wasn’t mobile responsive, and was built on inconsistent HTML structures that made tabbing unpredictable and confusing. These gaps not only created accessibility barriers but also highlighted an opportunity to improve overall usability.
EXPANDING THE SCOPE
The original ticket was sized as a small task, with no more than a couple of days of work assigned to it, as it was focused solely on keyboard navigation fixes. Once work began, it became clear that a full restructuring and redesign of the footer was necessary to address the root issues. Refinement and retrospective meetings helped the team re-evaluate the scope, align on the expanded requirements, and re-point the ticket to reflect the added complexity.
OVERCOMING CHALLENGES
Drawing on my design background, I proposed a clearer information hierarchy that better supported user needs while resolving accessibility blockers. By collaborating closely with the design team, I helped refine the updated layout to maintain brand consistency and visual cohesion. During retrospective meetings, I advocated for the increased scope by showing how a thoughtful redesign not only fixed the keyboard navigation issues but also delivered a more usable, responsive, and accessible footer for all users, which fully aligned with the initiative’s goals.
ROTATOR MIGRATION
Rotators were a recurring component across the site, often showcasing essential news content, yet their outdated JavaScript library made them difficult or impossible to navigate with a keyboard. They also lacked clear visual cues—such as navigation buttons—to indicate that more content was available beyond what was shown by default. On mobile, their poor responsiveness further limited user interaction, preventing a large portion of our audience from accessing key stories.
MIGRATING AND REDESIGNING THE COMPONENT
To resolve these issues, I helped migrate the rotators to Swiper, a modern JavaScript library optimized for mobile-first interaction, ensuring a smoother experience for all users—not just those with accessibility needs. I collaborated closely with the design team to introduce navigation arrows, adding redundancy that improved usability and guaranteed keyboard users could move through content reliably. My design background guided these decisions, helping bridge technical implementation with user-centered thinking.
MIGRATING AND REDESIGNING THE COMPONENT
To resolve these issues, I helped migrate the rotators to Swiper, a modern JavaScript library optimized for mobile-first interaction, ensuring a smoother experience for all users—not just those with accessibility needs. I collaborated closely with the design team to introduce navigation arrows, adding redundancy that improved usability and guaranteed keyboard users could move through content reliably. My design background guided these decisions, helping bridge technical implementation with user-centered thinking.
3
rESULTS & IMPACT
AccessIBILTYfor All
Thanks to the remediation initiative, the site — now reaching roughly 8 million daily users — is compliant with AODA and WCAG standards, ensuring that people with disabilities can access critical news just like anyone else. In Canada, around 7.4% of adults report a seeing disability and 5.0% report a dexterity disability. Statistics Canada+2Statistics Canada+2 As Canada’s population ages (with a growing share of seniors who commonly live with disability), these changes mean the site will remain usable and inclusive for a larger portion of the population for years to come.
SETTING UP FOR SUCCESS
Our team was tasked with bringing the CTV News website into compliance with AODA and WCAG standards within just two quarters. As part of the task force working on this initiative, my challenge was to bridge the design and development teams, applying UX insight to help ensure that accessibility fixes were both technically feasible and user-centered. The site’s size, legacy code, and inconsistent design patterns made the remediation effort complex to scope and execute.
SETTING UP FOR SUCCESS
Our team was tasked with bringing the CTV News website into compliance with AODA and WCAG standards within just two quarters. As part of the task force working on this initiative, my challenge was to bridge the design and development teams, applying UX insight to help ensure that accessibility fixes were both technically feasible and user-centered. The site’s size, legacy code, and inconsistent design patterns made the remediation effort complex to scope and execute.
4
TAKEAWAYS
SETTING UP FOR SUCCESS
Our team was tasked with bringing the CTV News website into compliance with AODA and WCAG standards within just two quarters. As part of the task force working on this initiative, my challenge was to bridge the design and development teams, applying UX insight to help ensure that accessibility fixes were both technically feasible and user-centered. The site’s size, legacy code, and inconsistent design patterns made the remediation effort complex to scope and execute.
SETTING UP FOR SUCCESS
Our team was tasked with bringing the CTV News website into compliance with AODA and WCAG standards within just two quarters. As part of the task force working on this initiative, my challenge was to bridge the design and development teams, applying UX insight to help ensure that accessibility fixes were both technically feasible and user-centered. The site’s size, legacy code, and inconsistent design patterns made the remediation effort complex to scope and execute.
SETTING UP FOR SUCCESS
Our team was tasked with bringing the CTV News website into compliance with AODA and WCAG standards within just two quarters. As part of the task force working on this initiative, my challenge was to bridge the design and development teams, applying UX insight to help ensure that accessibility fixes were both technically feasible and user-centered. The site’s size, legacy code, and inconsistent design patterns made the remediation effort complex to scope and execute.