Empathy-Driven Development

on YouTube ↗39m

" summary

A public repo with a broken web app houses concrete fixes: visible labels replace placeholders so form inputs get announced, a card-flip div becomes a button with a focus trap and close action, and SPA title changes emit an aria live region so screen readers know views change. Automated tests run with axe-core and Selenium (Cypress optional); many issues clear but a few keyboard tests remain failing. The code changes are implemented and largely functional.

AI-written summary · about

" chapters (10)

1. 0:00Start
2. 1:37Login Form
3. 2:34Technical Accessibility
4. 7:18Visual Studio Code
5. 7:35Automated Testing
6. 9:10Integration Test
7. 15:12Integration Tests
8. 20:18Empathy Driven Development
9. 27:27Focus Trap
10. 28:44Focus Management

" related talks

• 26mEmpathy-Driven DevelopmentMarcy Sutton Todd · JSConf EU 2018
• 48mRadically Accessible Internet Applications 💯Marcy Sutton Todd · Beyond Tellerrand Munich 2018
• 18mDevelop your empathy to develop more accessible appsFanny Demey · Chicago Roboto 2021
• 28mMaking Single Page Apps accessibleJess Budd · Laracon AU 2019
• 27mCompassion-Driven Development: Building Accessible React UITae’lur Alexis · React Day Berlin 2019
• 17mAccessibility in Single Page ApplicationsRick Giner · Decompress AU 2016
• 35m"Single Page Access"Suz Hinton · DinosaurJS 2016
• 22mBetter accessibility with a user-centric viewMarianna Österlund · React Finland 2022