My Accessibility Journey The Quest for an Accessible Components Library
summary
A component library approach enforces accessibility at the component level and prevents regressions across five products, using React + TypeScript components hosted in Storybook and tested with Cypress in a CircleCI pipeline. The repo holds ~40 components, ~170 stories/tests, and a seven‑developer team; automated accessibility checks (built into the Cypress run) flag issues like missing alt text or poor color contrast, caught a failing contrast on a secondary button, was fixed, and the CI then passes.
AI-written summary · about
chapters (13)
- 0:00Intro
- 3:30What is Accessibility
- 5:43Where to start
- 10:42Components Library
- 12:35Button Accessibility
- 14:45Button Code
- 16:34Button Tag
- 18:19Create Button
- 19:41Test Button
- 20:41Accessibility Testing
- 23:32Testing Results
- 25:12Pipeline
- 26:53Summary
related talks
50mAccessible Component Libraries: The Foundation of Accessibility at Scale
15mSweet, savory, and fresh! Accessible design system Storybook tests
53mAutomating Accessibility Assurance
10mCrafting Accessible Components for Component Libraries
23mBuilding Accessible Components: Best Practices and Business Buy-In
21mBuilding an Accessibility Culture
26mProven ways to make your website accessible in 2023
25mAccessibility in the Age of Components