Anuradha Kumari
Making Interactions Accessible to All Users
#1about 3 minutes
Understanding web interaction and assistive technologies
Web accessibility ensures that applications are usable by everyone, including those who rely on assistive technologies like screen readers and keyboards.
#2about 11 minutes
Implementing accessible buttons and links
Avoid removing the default focus outline and use semantic HTML, visually hidden text for icon buttons, and `aria-pressed` for toggle states.
#3about 6 minutes
Building accessible forms and announcing dynamic updates
Associate labels with inputs using the `for` attribute, provide context with `aria-describedby`, and announce validation errors using `aria-live` regions.
#4about 4 minutes
Creating accessible modals with focus management
Implement focus trapping to keep keyboard users within a modal and leverage the native HTML `<dialog>` element for built-in accessibility features.
#5about 1 minute
Summary of key accessibility best practices
A recap of essential practices including preserving focus outlines, using semantic HTML, providing text descriptions, and announcing dynamic messages.
#6about 4 minutes
Q&A on accessibility culture and implementation
Discussion on handling disabled buttons, getting organizational buy-in for accessibility, and integrating it as a continuous process in development.
Related jobs
Jobs that call for the skills explored in this talk.
Eltemate
Amsterdam, Netherlands
Intermediate
Senior
TypeScript
Continuous Integration
+1
Douglas GmbH
Düsseldorf, Germany
Intermediate
Senior
TypeScript
React
Matching moments
03:58 MIN
Making accessibility tooling actionable and encouraging
Developer Time Is Valuable - Use the Right Tools - Kilian Valkhof
03:31 MIN
The value of progressive enhancement and semantic HTML
WeAreDevelopers LIVE – You Don’t Need JavaScript, Modern CSS and More
05:59 MIN
Building an accessible accordion with details and summary
WeAreDevelopers LIVE – You Don’t Need JavaScript, Modern CSS and More
06:09 MIN
Creating a modal with the native HTML dialog element
WeAreDevelopers LIVE – You Don’t Need JavaScript, Modern CSS and More
03:16 MIN
Improving the developer feedback loop with specialized tools
Developer Time Is Valuable - Use the Right Tools - Kilian Valkhof
02:33 MIN
Why you might not need JavaScript for everything
WeAreDevelopers LIVE – You Don’t Need JavaScript, Modern CSS and More
09:00 MIN
Navigating the growing complexity of modern CSS
WeAreDevelopers LIVE – You Don’t Need JavaScript, Modern CSS and More
03:35 MIN
Building a one-time code input with semantic HTML
WeAreDevelopers LIVE – Frontend Inspirations, Web Standards and more
Featured Partners
Related Videos
27:16Mastering Keyboard Accessibility
Tanja Ulianova
29:03Decoding web accessibility through audit
Anuradha Kumari
29:59The What, Why, Who and How of accessibility on the web
Konstantin Tieber
25:33Accessibility with Web Components
Manuel Mauky
55:32ARIA: the good parts
Hidde de Vries
31:30Accessibility powered by AI
Ramona Domen
56:01Preventing Accessibility Issues Instead Of Fixing Them
Dirk Ginader
30:07Accessibility in React Application
Julia Undeutsch
Related Articles
View all articles
From learning to earning
Jobs that call for the skills explored in this talk.
Visonum GmbH
Remote
Junior
Intermediate
React
Redux
TypeScript
Articulate Marketing
Remote
Figma
WordPress