Accessibility for the rest of us
Outline
- Introduction
- Greeting
- Learning objectives
- What is accessibility
- Why accessibility matters
- Accessibility standards
- Accessibility principles
- Common tasks
- Best practices
- About Me
- Talk disclaimer
- I’m not an expert
- But you don’t need to be an expert
- This is going to be what everyone can do to make accessible products
- What is accessibility
- Definition
- Illustration
- Connection to disabilities
- Categories
- Summary: Accessibility is about making products that work for everyone
- Why accessibility matters
- Better overall
- Reach more users
- Comply with laws
- Accessibility standards
- WCAG
- Organization
- Ratings
- Example 1
- Example 2
- Principles
- Accessibility principles
- Perceivable
- Users must be able to detect the interface and content
- Guideline:
- Text alternatives
- Time-based media
- Adaptable
- Distinguishable
- Operable
- Users must be able to interact with the interface effectively
- Guidelines:
- Keyboard accessible
- Enough time
- Seizures and physical reactions
- Navigable
- Input modalities
- Understandable
- Users must be able to comprehend the interface and how to use it correctly
- Guidelines:
- Readable
- Predictable
- Input Assistance
- Robust
- Users must be able to access your content on a variety of devices, clients, and/or browsers
- Guidelines:
- Compatible
- Review
- Out of order, but
- Users need to be able to access it, perceive it, understand it, and use it
- Perceivable
- Common tasks
- Color
- Sufficient contrast
- Complement content
- Best HTML
- Links for navigating
- Buttons for interactions
- Descriptive tags
- Labeling
- Alternate text
- Form labels
- Descriptive buttons/links
- Wise use of ARIA
- Page structure
- Use landmarks
- Heading order
- DOM hierarchy
- Focus management
- Transferring focus
- Storing DOM references
- Trapping focus
- Advocating for the user
- Talk about accessibility
- Be the voice of whoever is not in the room
- Summary
- These common tasks span from easy to complex, but they are all things that every developer can do
- Color
- Best practices
- Prioritize accessibility
- Measure twice
- Design system
- Component library
- Add accessibility targets and acceptance criteria
- Chart your progress
- Prevent
- Follow W3C’s lead
- Get comfortable with resources
- Reference examples
- Audit
- Automated
- Manual
- Accessibility-focused testing
- Unit testing
- E2E testing
- No new errors
- Fixes every sprint
- Add to acceptance criteria
- Build automated checks into CI/CD
- Advocate
- Summary
- There isn’t one thing that you can do that will make all of your problems go away. This is a multi-pronged approach that will slowly make your product more accessible over time.
- Prioritize accessibility
- Closing
- Review learning objectives
- Challenge: Go out and commit to making your product more accessible
- Choose two of the best practices above
- Reminder: You don’t have be an expert; everyone can make accessible products.
- Resources
Key terms
- Accessibility
- Accessible
- Web Content Accessibility Guidelines (WCAG)
References
- Americans With Disabilities Act of 1990. https://www.ada.gov/pubs/adastatute08.htm
- CDC. (2019). Disability Impacts All Of Us [infographic]. U.S. Department of Health & Human Services. https://www.cdc.gov/ncbddd/disabilityandhealth/infographic-disability-impacts-all.html
- Deque. Axe: Accessibility testing tools and software. https://www.deque.com/axe/
- Dodson, Rob. How to do an accessibility review. Web Fundamentals. https://developers.google.com/web/fundamentals/accessibility/how-to-review
- Glover Blackwell, Angela. (2017). The Curb-Cut Effect. Stanford Social Innovation Review. https://ssir.org/articles/entry/the_curb_cut_effect
- GoogleChrome. lighthouse. GitHub. https://github.com/GoogleChrome/lighthouse
- Higgins, Tucker. (2019). Supreme Court hands victory to blind man who sued Domino’s over site accessibility. CNBC. https://www.cnbc.com/2019/10/07/dominos-supreme-court.html
- Matuzovic, Manuel. (2019). Building the most inaccessible site possible with a perfect Lighthouse score. https://www.matuzo.at/blog/building-the-most-inaccessible-site-possible-with-a-perfect-lighthouse-score/
- Melendez, Steven. (2019). Ninth Circuit court: Domino’s pizza website is bound by ADA. Fast Company. https://www.fastcompany.com/90293399/ninth-circuit-court-dominos-pizza-website-is-bound-by-ada
- Romo, Amberley. (2020). A11y Friday. https://a11y.coffee/a11y-friday/
- Romo, Amberley. (2020). Start Testing for Web Accessibility. https://a11y.coffee/start-testing/
- W3C. Collapsible Dropdown Listbox Example. WAI-ARIA Authoring Practices 1.1. https://www.w3.org/TR/wai-aria-practices-1.1/examples/listbox/listbox-collapsible.html
- W3C. (2018). Web Content Accessibility Guidelines (WCAG) 2.1. https://www.w3.org/TR/WCAG21/
- WebAIM. (2019). Alternate text. https://webaim.org/techniques/alttext/
- WebAIM. (2020). The WebAIM Million. https://webaim.org/projects/million/