Accessibility: Why it Matters to Everyone

Overview of website accessibility and how devs can make their site more accessible.

Transcript

1. It Matters to Everyone
   KAITLYN MARTINEZ
   Accessibility:
   

   View Slide

2. Why is Accessibility
   Important?
   

   View Slide

3. You can be
   sued for
   having
   inaccessible
   content
   

   View Slide

4. Akin to
   accessible
   entrances to
   a business
   

   View Slide

5. Not just for
   permanent
   disabilities
   

   View Slide

6. Impacts all
   disciplines:
   development
   content
   design
   

   View Slide

7. WCAG 2.1
   Web Content Accessibility Guidelines
   

   View Slide

8. ● Forms with Labels
   ● Alt Tags
   ● Header tag Order
   ● Adjacent images and buttons
   ● Naming regions and landmarks
   ● HTML5
   ● Meaningful content sequence
   ● Use of Color
   ● Keyboard Functionality
   ● Keyboard Traps
   ● Timing
   ● Bypass Blocks
   ● Page Titles
   ● Focus Order
   ● Link Purpose
   ● Page Language
   ● Error Identification
   ● Valid HTML
   Accessibility Levels
   A
   

   View Slide

9. ● All ‘A’ Requirements
   ● Contrast Minimum
   ● Resizing of text
   ● Images of text
   ● Visible focus
   ● Consistent Navigation
   ● Error Suggestion
   Accessibility Levels
   AA
   

   View Slide

10. Demo
    

    View Slide

11. TESTING TOOLS
    

    View Slide

12. WAVE
    1
    2
    3
    4 Google Chrome Accessibility Audit
    Siteimprove
    Color Contrast Checker
    

    View Slide

13. Thank You
    KMARTINEZ@CLICKRAIN.COM
    

    View Slide

14. Resources
    WCAG 2.1
    https://www.w3.org/WAI/WCAG21/quickref/
    Web Aim Color Contrast Checker
    https://webaim.org/resources/contrastchecker/
    WAVE Extension
    https://chrome.google.com/webstore/detail/wave-evaluation-tool/jbbplnpkjmmeebjpijfedlgcdilocofh?hl=en-US
    Siteimprove Extension
    https://chrome.google.com/webstore/detail/siteimprove-accessibility/efcfolpjihicnikpmhnmphjhhpiclljc?hl=en-US
    Google Chrome Accessibility Tools
    https://chrome.google.com/webstore/detail/accessibility-developer-t/fpkknkljclfencbdbgkenhalefipecmb?hl=en
    

    View Slide