Planning for a11y
- 1. Planning for A11Y Jeff Mcwherter
- 2. Accessibility is not a barrier to innovation
- 3. Perspective • Visual Disabilities • Cognitive Disabilities • Motor Disabilities
- 7. Guidelines • WCAG 2.0 A, AA,AAA • Custom Guidelines
- 8. 1.3.1 Level A Info and Relationships—Information, structure, and relationships conveyed through presentation can be programmatically determined or are available in text. WCAG 2.0 Standards To Note
- 9. 3.1 Level AA When an appropriate markup language exists, use markup rather than images to convey information. If possible, use text rather than an image. Try to avoid putting essential text within an image, and avoid using only images for navigation WCAG 2.0 Standards To Note
- 10. 9.3 Level AA For scripts, specify logical event handlers rather than device-dependent event handlers. This checkpoint requires that no assumptions are made about the input devices. Choose to use event handlers such as onfocus and onselect, and try to stay away from event handlers such as onclick and onkeypress. WCAG 2.0 Standards To Note
- 11. 1.2.6 Level AAA Sign Language (Prerecorded)–Sign language interpretation is provided for all prerecorded audio content in synchronized media. This checkpoint requires that sign language “bubbles” display during audio/video playback. WCAG 2.0 Standards To Note
- 12. 3.4 Level AAA Use relative rather than absolute units in markup language attribute values and style sheet property values.If possible, design using flexible widths. Units such as PX, PT, and CM don’t allow for change. WCAG 2.0 Standards To Note
- 13. 10.5 Level AAA Render adjacent links distinctly, include nonlink, printable characters (surrounded by spaces) between adjacent links. This accessibility point is making the point that neighboring links should be discernible by Section A | Section B | Section C | Section D | Section E WCAG 2.0 Standards To Note
- 14. 2.2.1 Level A Timing Adjustable For each time limit that is set by the content, at least one of the following is true: Turn off: The user is allowed to turn off the time limit before encountering it; Adjust: The user is allowed to adjust the time limit before encountering it over a wide range that is at least ten times the length of the default setting; Extend: The user is warned before time expires and given at least 20 seconds to extend the time limit with a simple action (for example, “press the space bar”), and the user is allowed to extend the time limit at least ten times; Real-time Exception: The time limit is a required part of a real-time event (for example, an auction), and no alternative to the time limit is possible; Essential Exception: The time limit is essential and extending it would invalidate the activity; 20 Hour Exception: The time limit is longer than 20 hours. WCAG 2.0 Standards To Note
- 15. Design • Contrast • Don’t Rely on Color To Convey Information • Be Mindful of Animations, Parallax, and Video
- 16. Design - Visual Focus :focus {outline: 0;}
- 17. Design - Hover
- 18. It is a common misconception that people with disabilities don't have or 'do' JavaScript, and thus, that it's acceptable to have inaccessible scripted interfaces, so long as it is accessible with JavaScript disabled. A 2012 survey by WebAIM of screen reader users found that 98.6% of respondents had JavaScript enabled
- 19. ARIA • Landmarks • Forms • Live Regions
- 20. ARIA - Tab List
- 22. ARIA - Hidden
- 23. ARIA - Alert You are not connected to the internet
- 24. ARIA - Form Your username Your password
- 25. ARIA • aria-haspopup="true" • aria-label = “submenu” • aria-expanded=“false" •aria-controls=“collapsible-0"
- 26. Tools • Screen Readers • Automated Guideline Evaluation •Human Testing
- 28. Code Examples Found here www.gravityworksdesign.com/Presentations/Planning-For-A11y.zip