Design for all » Inclusive usability » Web components
Web components are a popular technique to build encapsulated HTML building blocks. To make them universally accessible, they have to be carefully designed.
At its core, the key design concept for an accessible, progressively enhanced web component is actually rather straightforward:
Web Components as Progressive Enhancement
cloudfour.com/thinks/web-components-as-progressive-enhancement/
Reference projects and examples
Some #a11y-focused, inclusively designed web components:
HowTo: Components – howto-tabs
Add Responsive-Friendly Enhancements to `details` with `details-utils`
ciampo/macro-carousel: Carousel as a Vanilla Web Component.
Filament Group Modal | A simple, accessible modal dialog web component
Critique
Why I don't use web components
Last edited: Nov 2022