AngularJS Accessibility

on YouTube ↗29m

" summary

Examines concrete accessibility fixes for Angular apps: ngAria hooks into ngModel and dynamically adds tabindex and aria-checked, Material components add role/tabindex and warn when aria-labels are missing, and chrome://accessibility reveals when disabled on a custom element doesn't register so use aria-disabled or a native element. Shows a Virgin America demo that fails keyboard and screen‑reader focus, implements an aria-live polite region for announcements, and adds unit tests that assert keyboard interaction (arrow keys, focus changes) actually work.

AI-written summary · about

" chapters (6)

1. 0:00Start
2. 0:59What is Accessibility? Everyone can perceive, understand, navigate, and interact with the Web, and they can contribute to the Web
3. 1:50Angular Accessibility
4. 2:56Step 1 to writing meaningful HTML Use Semantic Elements
5. 8:15Application Role Disables a screen reader's "virtual cursor"
6. 23:38Unit Testing Labels ARIA Roles Watched ARIA Properties Interactions

" related talks

• 49mAccessible Angular.jsMarcy Sutton Todd · GOTO Amsterdam 2015
• 25mAccessibility! is! important!Emma Twersky, Zach Arend · ng-conf 2022
• 31mReaching Out with AngularNoam Kfir · AngularUP 2017
• 29mAngular Accessibility Adventures: Navigating the Web for EveryoneMaria Korneeva · NG-BE 2024
• 26mAccessibleJSJemima Abu · GOTOpia Chicago 2021
• 26mWeb Accessibility 101: An Introduction to A11YLeonardo Graterol · NG Bolivia 2019
• 01h 00mBuild more accessible apps in AngularEmma Twersky · Google I/O 2022
• 31mARIA Was Made For This Accessiblility of JavaScript MVCsMarcy Sutton Todd · CascadiaJS 2014