Lead design initiative to improve WCAG compliance for our B2B2C experience.
At Okta, one of the biggest parts of our business is providing a customizable login experience for our customers to use for their customers. The number of end users for this experience could be in the hundreds of millions, so it goes without saying that there needs to be a way for people with disabilities to get the same level of service as those without disabilities. We ran an accessibility evaluation with an outside auditor to evaluate the changes needed to achieve WCAG 2.2 compliance.
In order for our auditors to validate the existing state of the and user experience we needed to provide a testing environment, as well as instructions on how to access and experience every screen and every possible flow that a user could journey through. This included documenting the flows to give the auditors a guide for their testing.
Below you can see what the previous non-compliant experience looked like.
After receiving the audit from the independent group, we looked for trends and high priority items that needed to be improved to achieve WCAG compliance. We separated issues into visual improvements, or code level improvements. We realized that much of improvements were simply around focus states, and so we enacted a plan to address those to quickly reduced the amount of work needed to achieve compliance. I went through our component library and looked at the design assets that were non-compliant and created new versions of them in our design system to meet compliance.
The Okta login experience is a fully customizable experience for our customers, and they can change the colors and fonts of the experience. Because changing our visual design assets in our platform would impact our customers customized login experiences, we wanted to provide a beta testing feature for our customers internal development environments so that they could also improve their experiences based off of our changes without and interuption for their customers. We added a toggle in the admin dashboard to allow our customers to enable or disable this in their test environments and convert it to live once ready.
You can see the improved WCAG 2.2 compliant experience below.
With these improvements I created, our customers who faced strict compliance regulation from governmental bodies, and legal challenges from advocacy groups, were able to meet compliance standards and expensive fines, and offer an improved and inclusive experience for all of their users.