Component examples

Accessible hiding
Elements not visible on the screen but accessible to assistive technology.
Handling forms
Creating accessible forms.
Dialog box 1/2
Example of an accessible dialog (part 1).
Dialog box 2/2
Example of an accessible dialog (part 2).
Dropdown menu
Create an accessible drop-down menu.
Make a screen reader speak using Javascript
Sample code to make screen reader speech.
Chatbot accessibility best practices
Create an accessible chatbot.
Create accessible “tags” 1/2
Sample code to make accessible tags (part 1).
Create accessible “tags” 2/2 (examples)
Sample code to make accessible tags (part 2) examples.
Hiding technical iframes
Hidding iframes to assistive technology.
ARIA attributes that can save you
Some ARIA attributes to know.
ARIA lists (listbox) 1/3
Example of ARIA list (part 1).
ARIA lists (listbox) 2/3 (with checkboxes)
Example of ARIA list (part 2).
The listbox and ARIA patterns 3/3 (keyboard navigation)
Example of ARIA list (part 3).
File Explorer (cloud)
Example of accessible file explorer.
Live regions, dynamic content, handling focus and ARIA
Management of areas that update dynamically in your pages.