Accessible JavaScript: it's easier than you think!
summary
Clear, actionable checklist: implement 3 types of JavaScript functionality (binding, non-interactive, custom), follow 10 accessibility principles (text alternatives, keyboard support, programmatic structure, logical focus order, timing, consistent labels, error text), use AccessibilityOz fact sheets and W3C APG patterns, test flicker with the PET photosensitivity tool (red ≤3 Hz, others ≤5 Hz, ≤2s total), avoid CAPTCHA, ensure form validation triggers on submit and focus moves to first error, live demo code is copy‑paste ready.
AI-written summary · about
chapters (22)
- 0:00Introduction to Accessible JavaScript
- 0:29Accessibility Principles for JavaScript
- 1:21JavaScript Accessibility Resources
- 3:14Binding Functionality to Interactive Components
- 3:43Non-Interactive Functionality
- 4:04Creating Custom Components
- 4:33Text Alternatives and Assistive Technologies
- 5:54Issues with CAPTCHA and Alternatives
- 7:18Dynamic Content and Progress Meters
- 9:54Keyboard Accessibility
- 16:27Labels and Field Sets
- 19:10Accordions and Expandable Menus
- 20:54Maintaining Logical Focus Order
- 24:54Focus Order in Dynamic Content
- 25:04Examples of Focus Order
- 26:34Principle Five: Sensory Characteristics
- 27:22Principle Six: Timed Activities
- 32:37Principle Seven: Mechanisms for Interaction
- 34:11Principle Eight: Predictable Navigation
- 37:16Principle Nine: Consistent Components
- 38:30Principle Ten: Error Identification
- 43:04Conclusion and Additional Resources
related talks
30mAccessible.JS
35mAccelerating accessibility in web
33mAccessibility and JS: side-by-side
01h 05mAccessibility Testing 101
48mCoding For Accessibility Best Practices from the Front Lines
26mAccessibility Is a Marathon, not a Sprint
35mInaccessible websites? - it's you, not JavaScript
32mBetter Accessibility with JavaScript