The Shadow DOM makes web components powerful but breaks accessibility. Discover the emerging AOM specification that will finally provide a native solution.
#1about 7 minutes
Understanding web components and their core technologies
Web components offer a framework-agnostic way to build reusable UI with standards like Custom Elements for behavior and Shadow DOM for encapsulation.
#2about 5 minutes
Using ARIA attributes to make web components accessible
Custom elements require manual ARIA attributes to be recognized by assistive technology, but this approach has drawbacks like host manipulation and ID scoping issues.
#3about 4 minutes
Introducing the upcoming Accessibility Object Model (AOM)
The Accessibility Object Model (AOM) provides a JavaScript API to define default accessibility properties without directly modifying the host element's attributes.
#4about 3 minutes
Implementing custom keyboard navigation and focus management
Developers must manually implement keyboard interactions and manage focus flow within components to ensure they are navigable without a mouse.
#5about 5 minutes
Exploring the limitations of extending native HTML elements
Extending native HTML elements to inherit accessibility is an option, but it is severely limited by the lack of Shadow DOM and poor browser support in Safari.
Related jobs
Jobs that call for the skills explored in this talk.
The Web We Broke (And Why AI Agents Are Paying the Price) - AgentCon BerlinThis is the accompanying post to the talk Chris Heilmann gave at AgentCon in Berlin on 19/05/2026, you can also see the slides and listen to it in this screencast:
Thirty years of developer shortcuts, bloated JavaScript, and inaccessible HTML have l...
Chris Heilmann
Building a "shoutout" component in plain HTML/CSS/JavaScriptEvery Wednesday we meet at noon to talk about a lot of tech news, tools and resources in something we call WeAreDevelopers Live . We go live on YouTube and afterwards we cut out short videos to post on social media. What we needed was an obvious “sho...
Dev Digest 215: Agent Memory, JS2026, Googlebot Analysis & Canvas❤️HTMLInside last week’s Dev Digest 215 .
🗿 Make AI talk like a caveman
🧠 A guide to context engineering for LLMs
🤖 Simon Willison on agentic engineering
🔐 Axios supply chain attack post mortem
🛡️ Designing AI agents to resist prompt injection
🎨 HTML in c...
From learning to earning
Jobs that call for the skills explored in this talk.
27:16
31:38
29:59
30:07
56:01
55:32
46:39
41:54
