Ship dynamic features that still work when JavaScript doesn't.
This board is a review checklist for web professionals: 17 checks to run over a dynamic page or component before the feature ships, covering the static foundation beneath it, what happens when it fails, whether anyone notices its updates, and whether screen reader and keyboard users can use it at all.
Static HTML foundation:
Essential content, links and metadata arrive in the initial HTML
The page is usable, not merely viewable, with JavaScript unavailable
Dynamic features layer on top of a working baseline rather than replacing it
Nothing essential is buried in JavaScript-only widgets that crawlers cannot reach
Graceful degradation:
Every request has explicit error handling, so failure is never silent or a perpetual spinner
A functional fallback exists if the dynamic feature fails entirely
Back and forward buttons behave as expected after dynamic updates
Elements that look alike behave alike
Making updates visible:
Feedback appears next to whatever the user just acted on
Updates use size, contrast or movement to attract attention
Transient messages leave a persistent indicator behind
No interaction requires watching two places at once
ARIA and screen reader accessibility:
Custom widgets carry appropriate ARIA roles
Structural areas use landmarks or HTML5 semantic elements
Dynamically updating areas are marked with aria-live
The build has been tested with a real screen reader
Keyboard-only navigation works throughout, with focus never lost or trapped
How to use the board:
To take your own copy, open Board > Details > Duplicate. A free Miro account is all you need.
To tick an item, double-click its box and type x.
Duplicate the card for each dynamic feature, component or sprint.
This template accompanies the Interaction Design Foundation course UX Essentials: Accessibility, SEO and Dynamic Interfaces.
