×
Copy
Open
Link
Embed
Share
Beginning
This slide
Copy link URL
Copy link URL
Copy iframe embed code
Copy iframe embed code
Copy javascript embed code
Copy javascript embed code
Share
Tweet
Share
Tweet
Slide 1
Slide 1 text
How I Work: Accessibility By Marcy Sutton Smashing TV May 10, 2018
Slide 2
Slide 2 text
Accessibility in JavaScript- Heavy Applications • Client-side view changes • Custom UI components • Interactive layers • Toasts & notifications • Virtual DOM • Automated Testing
Slide 3
Slide 3 text
POUR me a coffee ☕ https://www.w3.org/WAI/WCAG21/Understanding • Perceivable • Operable • Understandable • Robust
Slide 4
Slide 4 text
No content
Slide 5
Slide 5 text
Accessibility Basics: Resources • Deque University • WebAIM • Inclusive Components • Egghead Course • Udacity course
Slide 6
Slide 6 text
Demos! https://wakamaifondue.com/ https://github.com/glowroot/glowroot/tree/master/ui https://github.com/chrisheninger/rental-resume.com
Slide 7
Slide 7 text
Automated Accessibility Testing What does it cover? • HTML & ARIA syntax, relationships • Accessible naming/text alternatives* • Color contrast* • Page-level requirements • Keyboard support**
Slide 8
Slide 8 text
Accessibility Testing APIs • axe-core • Tenon.io • WAVE • eslint-plugin-jsx-a11y
Slide 9
Slide 9 text
Wrap It Up • A11y + JavaScript ❤ • The basics matter • Get skilled at focus management • Test, test, test! https://www.smashingmagazine.com/2015/05/client- rendered-accessibility/