Upgrade to Pro — share decks privately, control downloads, hide ads and more …

Smashing TV - How I Work: Accessibility

Smashing TV - How I Work: Accessibility

Marcy Sutton

May 10, 2018
Tweet

More Decks by Marcy Sutton

Other Decks in Programming

Transcript

  1. How I Work: Accessibility By Marcy Sutton Smashing TV May

    10, 2018
  2. Accessibility in JavaScript- Heavy Applications • Client-side view changes •

    Custom UI components • Interactive layers • Toasts & notifications • Virtual DOM • Automated Testing
  3. POUR me a coffee ☕ https://www.w3.org/WAI/WCAG21/Understanding • Perceivable • Operable

    • Understandable • Robust
  4. None
  5. Accessibility Basics: Resources • Deque University • WebAIM • Inclusive

    Components • Egghead Course • Udacity course
  6. Demos! https://wakamaifondue.com/ https://github.com/glowroot/glowroot/tree/master/ui https://github.com/chrisheninger/rental-resume.com

  7. Automated Accessibility Testing What does it cover? • HTML &

    ARIA syntax, relationships • Accessible naming/text alternatives* • Color contrast* • Page-level requirements • Keyboard support**
  8. Accessibility Testing APIs • axe-core • Tenon.io • WAVE •

    eslint-plugin-jsx-a11y
  9. 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/