ARIA (in full: WAI-ARIA, means the Accessible Rich Internet Applications suite of web standards. HTML5 attributes to enhance the accessibility of your web application for people that use the web in another way, for example without a mouse and their eyes. It especially helps with dynamic content and advanced user interface controls developed with Ajax, HTML, JavaScript, and related technologies.
You can find the official documentation at in the W3C docs on WAI-ARIA
First rule of ARIA: Don't use ARIA!
Topics
Roles and landmarks
Give structure and meaning to HTML5 elements.
Structure your HTML5 with landmarks and roles
Add context en content
Don't make users guess what the content is.
- aria-hidden and the .screen-reader-text CSS class
- aria-label
- aria-labelledby
- aria-describedby
Dynamic content
Explain what's going on and how it works.
- aria-expanded for a toggle button
- aria-live, announce content has changed on a page
Resources
Please try this at home
Preferred combination for testing: