Scaling Accessibility Through Your Design System Panel Recap

Find out the main takeaways from our fireside chat on scaling a11y through design systems. Get valuable insights from some of the industry's biggest experts.

We invited a panel of experts to discuss scaling a11y through your design system. The panel consisted of accessibility advocate and design leader Geri Reid, renowned engineer Lauren Beatty, and UX and design researcher Stéphanie Walter, moderated by our product designer, Aprile Elcich.

This webinar provided valuable insights for designers, developers, and anyone interested in creating inclusive and accessible digital experiences. Here are the top takeaways from the webinar.

Accessibility is best implemented from the start

Implementing accessibility in your product can be a daunting task. We asked the panelists what their experience was and what they advise other designers to do. They all agreed that it was essential that you start thinking and applying accessibility very early on in the process. When it's there from the beginning, it's a lot easier to maintain.

Accessibility starts with the design system

When you want to create an accessible product and encourage your design team to implement accessible design practices, it doesn't work as well when the design system they're following doesn't practice what it preaches. It also gives provides your organization with a rock-solid accessibility foundation to build from.

Design systems team can own accessibility

We asked the team panel who they thought should own accessibility in an organization. They agreed that accessibility is everyone's responsibility, and because of that, design systems are a great place to have everyone involved. It's crucial to find advocates in your organization and support each other. In the end the design system team will have a decisive say in the design of the product, so they will definitely be involved.

Test constantly and follow accessibility guidelines

It's not enough to just implement accessibility; you have to make sure it's implemented correctly. Our panelists discussed how to test and what accessibility guidelines to follow. WCAG gives you a great baseline to shoot for. Also there are a host of robust tools that help measure how well you’re meeting those criteria. Automated tests, like end-to-end testing, are effective in scanning for static accessibility violations, while browser extensions — like Wave — and UX dev tools are also available. Newskit also has a web page of testing tools.

The four required tests before shipping include: contrast and color testing, interactive elements, keyboard interaction, and zoom level. It's recommended that the technical stuff be removed before testing with disabled people to minimize the cost of usability testing.

Proactivity goes a long way

No one is born an accessibility expert or advocate. It's important to take initiative and encourage others to do the same. Everyone knows that accessibility is the right thing to do, but it still needs a lot of proactive effort from the people in the organization, whether from a bottom up or top down approach.

“Be the change you want to see in your organization."

Documenting is a team game

The panel learned from experience that documenting and building your design system needs to involve everyone. Designers and engineers need to be comfortable contributing and documenting components, best practices, behaviors and more in your design system.

Educate and find the success metric that makes sense to your organization

Accessibility is unlikely to be a very straightforward business metric that metric that an organization would care about. It's important that you educate your organization and team on the importance of accessibility. Personal stories and real-world examples can go a long way. It's important to find the right balance and fit for your team to measure and track is essential. Work with the advocates in your team to find how accessibility can link to your KPIs and improve on it.

Here are a few useful links provided by the panelists:

And you can watch the full panel discussion to learn more. You can also find a transcripted recording here.

Get started with Supernova today

Unlock the full potential of your design system with Supernova, empowering you to drive innovation, collaboration, and seamless scalability.

10 Most Popular Content Blocks to Document Your Design System Guidelines

Use tables, component checklists, shortcut links, and more to write easy-to-understand guidelines for your design system.

Top Design System Documentation Sites Created With Supernova

Explore top design systems built using Supernova including Skyscanner's Backpack, Okta's Odyssey, and Mozilla's Acorn. Learn how Supernova enhances collaboration, scalability, and integration in design systems.

Four Essential Principles to Scaling Your Design System

Explore key principles for building a scalable design system: automation, clear communication, feedback, and contributions. Enhance efficiency and collaboration for a design system that evolves with your needs.

Get early access to Forge