I've built a good handful of accessible markup patterns and widgets at this point. Most of which were bespoke and incorporated into websites/products. But, there are a baseline patterns I was able to use over and over again, and the following represent the most common widgets that I was able to distill into basic examples (i.e., vanicall html/css/js). Each was based on testing with users, UX and design needs from those past projects, and from following normative specifications & informative notes.
Here's a listing of all the ones I've actually put enough effort into making public with explainers, demos n' such. At this point, I'm not likely to continue adding to this list, or making updates to what I've shared. These remain public because I think it's important to have free resources to reference for making common accessible patterns.
- Accordions (v3)
- ARIA Links (v2)
- ARIA Buttons (v2)
- Breadcrumb Navigation (v1.1)
- Clear text field buttons (v1)
- Disclosure Widgets (v2.0.1)
- Landmarks Demonstration
- Modal Dialogs (v3 - archived)
- Switch Toggle Web Component (v0)
- Switch Toggles (v2.0.1)
- Tab Widgets (v2)
- Tooltips (v1)
- Various Styled Form Controls