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
Reference projects and examples
Some a11y-focused, inclusively designed web components:
If JavaScript is disabled, all panels are shown interleaved with the respective tabs. The tabs now function as headings.
Add Responsive-Friendly Enhancements to `details` with `details-utils`
Over time I’ve collected a bunch of add-on utilities to enhancewith new features and functionality. […] I’ve decided to finally package thosehelpers up and formally release them as a web component!
