Who is afraid of ARIA
•
5 likes•1,306 views
This document discusses ARIA (Accessible Rich Internet Applications) and how to use it to make web content and applications more accessible. It recommends only using ARIA when necessary to fix inaccessible HTML, not as a replacement. The presentation provides examples of how to use various ARIA attributes like aria-expanded, aria-live, and aria-labelledby to provide feedback on interactions, changes, and form field labels. Resources for learning more about ARIA best practices are also included.
Report
Share
Who is afraid of ARIA
- 1. Who’s afraid of ARIA? Rian Rietveld WordCamp US 2018
- 3. Rian Rietveld @RianRietveld Find me on twitter Senior Accessibility Consultant at Level Level Teacher at the Level Level Academy
- 5. In this talk What is ARIA First rule of ARIA Examples of how to use ARIA Good resources
- 6. WAI-ARIA WAI = Web Accessibility Initiative ARIA = Accessible Rich Internet Applications Suite
- 7. ARIA defines a way to make Web content and Web applications more accessible to people with disabilities.
- 8. It’s all about feedback What happens on the page? What does this mean? How can I interact?
- 9. First rule of ARIA… Don’t use ARIA!
- 10. Don’t use ARIA to fix meaningless or incorrect HTML5
- 18. Semantics gives it all for free
- 20. It’s all about feedback What happens on the page? What does this mean? How can I interact?
- 21. How to use ARIA Examples!
- 22. aria-expanded Is this open or closed?
- 24. aria-live Tell me what’s changing
- 25. Demo aria-live
- 28. aria-label and the .screen-reader-text What you hear is what you get
- 29. Demo aria-label
- 30. aria-describedby and aria-labelledby How do I fill out this form?
- 32. Resources
- 36. Free online ARIA Widgets Code Library at dequeuniversity.com
- 38. Make it work before you make it nice