Lost in Space: Web Apps and A11Y
summary
Shows practical accessibility fixes for web apps: uses the Ambient Light Sensor to switch to dark mode below ~50 lux, adds a high-contrast toggle via CSS variables, and provides a demo and GitHub code. Implements keyboard patterns including tabindex=-1, a focus trap and arrow-key focus list, and automates QA with axe and Lighthouse plus unit tests for a dropdown, finding and fixing issues like tabindex>0 and contrast failures.
AI-written summary · about
chapters (16)
- 0:00Web accessibility intro
- 1:26Why accessibility matters
- 2:30Accessibility as UX
- 5:41Color blindness testing
- 7:50Ensuring contrast
- 9:18Ambient lighting adaption
- 13:40Dark mode support
- 14:46Font size and spacing
- 16:55Keyboard navigation
- 21:22Focus trap in modals
- 23:52Focus lists for navigation
- 25:40Screen reader testing
- 26:20Lighthouse audits
- 27:07axe-core testing
- 28:50Live accessibility demo
- 37:43Summary
