Accessible Code Patterns and Libraries
Pattern Libraries for Developers
- Cauldron – Deque design pattern
- ARIA Authoring Practices Guide (APG)
- Bootstrap Accessibility
- W3C Developing for Web Accessibility
Deque University ARIA Widgets Code Library (Beta)
- CSS-Tricks – Responsive Data Tables
- CSS-Tricks – Accessible Simple Responsive Tables
- Adrian Roselli – A Responsive Accessible Table
If you’re using a framework, there may be responsive table classes already available. For example, Bootstrap’s
.table-responsive class triggers horizontal scrolling on small screens. That doesn’t address all potential accessibility issues, so you would also want to make sure your table is well-constructed.
There are also interesting solutions on CodePen. This Simple Responsive Table in CSS example switches table rows into a card view on small screens.