← Lab

Accessibility diff between builds

Interactives + accessible names + focus order · local comparison, no server

Accessibility regressions are usually found once they’re in production: a button loses its accessible name, focus starts skipping the menu… This workflow catches them earlier: capture a snapshot on the old site, deploy, capture another on the new one, and compare.

⬇︎ Snapshot — drag me to bookmarks— open it on your site and it will download the snapshot JSON.Focus order approximated via tabindex + DOM; exact key-by-key capture lives in the CLI/skill version (a11ydiff.py, with Playwright).

Compare two snapshots

Snapshot format

JSON with elementos (key, tag, id, role, name, href, dom) and orden_foco. Without a stable id, renamed elements show up as removed + added: use stable ids for fine traceability.