Choose a tool

  • Landmark Visualizer

    Outlines every ARIA and HTML landmark region and flags ones missing an accessible name or duplicated.

  • Heading Hierarchy Validator

    Walks the heading outline in document order and flags any level that skips ahead.

  • List Identifier

    Flags empty lists, malformed markup, and list items that aren't inside a list at all.

  • Tab Order Visualizer

    Numbers every focusable element in tab order and flags positive tabindex values.

  • Text Contrast Checker

    Measures text contrast against its effective background and flags anything below WCAG AA minimum.

  • Image Alt Text Checker

    Checks every image for alt text and flags the ones missing it or marked incorrectly.

  • Input Label Checker

    Outlines every input, select, and textarea on the page, then labels each one with how it gets its accessible name.

About this toolkit

  • No installation. Each tool is a self-contained. All you need to do is drag the bookmarklet link to your bookmarks bar and it's ready to use on any site.
  • Nothing leaves your browser. Every check runs entirely client-side against the current page's DOM.
  • Click again to clear. Running a bookmarklet a second time on the same page removes its outlines and summary panel. Or, you can click the close button in the popup to clear the results. But sit tight, I have something else coming to improve this UX pattern :)
  • WCAG 2.2 mapped. Every tool's page lists the specific success criteria related to its bookmarklet, with a link to the W3C Understanding document.
  • These tools are a starting point, not a full audit. Bookmarklets are great for quick spot-checks that catch common issues, but they don't replace a full manual and assistive tech review.
  • Known issues. I know that the gold color used for the "flagged" status is problematic for some with weak color vision. I'm still working on a color option for it.
v.1.0