HelloA11Y Global Accessibility Awareness Day 2021

HelloA11Y Global Accessibility Awareness Day 2021

Connecting people through accessibility

Aditya Sujith Gudimetla

Aditya Sujith Gudimetla


How to create accessible JavaScript widgets with basic HTML components

Submitted May 15, 2021

The WAI-ARIA standard (https://www.w3.org/WAI/standards-guidelines/aria/) introduced concise requirements regarding accessible implementations of various interactive usage patterns. However, compatibility varies a lot between browsers and screen readers. As such, it’s still a pain to create accessible cross-browser/platform/device JavaScript widgets.

Instead of using WAI-ARIA, it’s possible to create most interactive usage patterns by dividing them into simple HTML form controls, connecting them with some JavaScript, styling them as wanted, and adding only a tiny bit of ARIA here and there for polishing. This results in widgets that rely on rock solid browser standard behaviour in most of their functionality. In my talk, I will show how to create sophisticated widgets (like autocompletes, tabs, date pickers, or accordions) using basic HTML, CSS, and JavaScript: they are compatible with each and every browser and assistive device (ie. screen reader). As such, they truly work for everyone - and are extremely cheap in terms of performance and maintenance.

About the Speaker
Joshua Muheim : I’m a senior full stack web developer. Since 2014, I worked for «Access for all» (http://access-for-all.ch/), Swiss Foundation for the use of technology for the disabled, where I was part of an inclusive team. I had the opportunity to hands-on learn everything related to accessibility, while we helped to audit and optimise hundreds of websites and mobile apps. I was initiator of and main contributor to the «Accessibility Developer Guide» (https://www.accessibility-developer-guide.com/), a comprehensive introduction to accessibility, aimed at developers. I just started working for Nothing AG (http://nothing.ch/), a lively UX focused product design agency located in Berne, Switzerland. Aligned with Nothing’s company ethos, which is creating products that truly serve humanity, we want to push accessibility both within our organisation as well as inside the UX, design and development communities.

Linkedin: https://www.linkedin.com/in/joshua-muheim-41939494/
Twitter: https://twitter.com/NothingAgency


{{ gettext('Login to leave a comment') }}

{{ gettext('Post a comment…') }}
{{ gettext('New comment') }}
{{ formTitle }}

{{ errorMsg }}

{{ gettext('No comments posted yet') }}

Hosted by