Maintaining Accessibility in Vue Components
summary
Overview of legal pressure: the European Accessibility Act creates obligations that can carry fines up to 60,000 euros and even prison time for repeated failures. Practical claims: ship semantically correct HTML in Vue components, test accessibility early with component and end-to-end tests, and automate scans with axe/axe-core (automation covers roughly 30% of WCAG issues). Concrete bug and fix: a thumbs-up SVG button lacks a label (missing labels on SVG-only buttons), add aria-label or visible label to restore keyboard and screen‑reader access; use Cypress to catch regressions.
AI-written summary · about
chapters (10)
- 0:00Accessibility in Vue intro
- 1:46Why accessibility matters
- 3:17European Accessibility Act
- 5:41Common accessibility issues
- 7:05Shift left testing
- 9:51Manual testing & feedback
- 11:59Debugging Vue components
- 16:11Automated testing tools
- 21:22Key takeaways
- 24:11Q&A
related talks
41mBuilding Accessible Vue Components
30mWeb Accessibility with VueJS
48mFind and Fix Your Accessibility Problems
22mFrom a Workshop to a Wake-Up Call: My Journey into Accessibility
13mA11y Broke My Build
35mMedia for everyone - how to make your Vue Apps accessible for all users
31mAccessibility with Vue
46mA11Y with Vue - Can everyone reach your application?