WCAG 2.2 for an Accessible Financial Web Application with React

A leading financial services provider in Germany faced the challenge of comprehensively modernizing an existing financial web application in response to new accessibility requirements. At the center of the project was a structured accessibility refactoring effort aimed at aligning key user flows, forms, and interaction patterns with WCAG 2.2. The main driver was increasing pressure around the German Accessibility Strengthening Act, known as the BFSG, which has been in force in Germany since June 28, 2025 and implements the European Accessibility Act into German law. For consumer-facing digital services, including certain offerings in the financial sector, accessibility became both a strategic and operational priority.

As a first step, the existing application needed to be aligned with WCAG 2.2. The goal was to significantly improve usability for all users, regardless of whether they rely on keyboard navigation, screen readers, or clear visual structures. WCAG 2.2 is the current W3C recommendation for accessible web content. It was published on October 5, 2023, adds 9 new success criteria to WCAG 2.1, and generally covers the requirements of WCAG 2.1 when implemented.

The project was therefore about much more than isolated fixes. It required a structural improvement of the application as a whole. This included work on semantic HTML structures, keyboard accessibility, focus handling, contrast, ARIA patterns, and consistent interaction behavior across different interfaces.

Because the project progressed faster than originally expected, its scope was expanded. In addition to accessibility refactoring, the team also initiated a refactoring of existing UI structures and built a new internal React component library. This was complemented by Storybook so that components, states, and variants could be documented transparently and reused over the long term.

Our contribution went beyond technical implementation alone. Alongside the accessibility refactoring itself, we supported the frontend team through code reviews, pair programming, and best-practice workshops. This ensured that new accessibility and UI standards were not only delivered, but also embedded into day-to-day development work.