Testing bookmarklets

A bookmarklet is a web browser bookmark with JavaScript commands that add new features. These small JavaScript snippets are stored as a bookmark URL and executed when clicked.

To use them:

Drag a bookmarklet to your browser's Bookmarks Bar.
Open the web page you want to inspect.
Click the bookmarklet.
Press Esc to remove the overlay.

Intopia bookmarklets

Bookmarklet	Test page
Highlight headings Highlights all heading levels (H1–H6) with distinct colours. Flags empty headings and duplicate `<h1>` elements.	Testing headings
Highlight image alternatives Highlights all images. Distinguishes between meaningful `alt` text, empty `alt` and missing `alt`.	Testing images
Highlight lists Highlights native list elements and ARIA list roles with distinct colours per type.	Reviewing lists
Highlight captions and headers Highlights accessibility features within tables. Flags header cells with and without `scope`, and tables missing a `<caption>`. Click to activate, then press `1` through `3` in order to step through `<table>`, `<caption>` and `<th>` elements individually.	Testing tables
Highlight ARIA table roles Highlights ARIA roles relating to tables. Click to activate, then press `1` through `6` in order to step through the role hierarchy from container to cell.	Testing ARIA tables
Highlight landmarks Highlights all landmark regions with distinct colours per role. Shows accessible name where present.	Reviewing landmarks
Highlight aria-label Highlights all elements with `aria-label`. Flags empty values and use on roles where author-provided names are prohibited.	Testing aria-label
Highlight aria-labelledby Highlights elements with `aria-labelledby` and their targets. Flags missing, hidden and self-referencing IDs.	Reviewing aria-labelledby
Highlight aria-describedby Highlights elements with `aria-describedby` and their targets. Flags missing, hidden and self-referencing IDs.	Testing aria-describedby
Highlight name mismatches Highlights links and buttons where the visible label and accessible name don’t match.	Testing name mismatches
Highlight name-prohibited roles Highlights elements with `aria-label` or `aria-labelledby` on roles that must not have an author-provided name.	Testing name-prohibited roles
Highlight form field names Highlights form fields and their accessible names. Flags fields with no name, and fields where the name comes from an unreliable source such as `placeholder` or `title`.	Testing form labels
Highlight buttons Highlights all buttons and their accessible names. Flags buttons with no accessible name.	Testing buttons
Highlight fieldsets Highlights `<fieldset>`, `<legend>` and `radiogroup` elements. Flags `<fieldset>` elements missing a `<legend>`.	Testing fieldsets
Highlight required fields Highlights required form fields. Distinguishes between native `required`, `aria-required`, and redundant combinations.	Testing required fields
Highlight aria-invalid Highlights all `aria-invalid` states with distinct colours: `true`, `grammar`, `spelling` and `false`.	Testing aria-invalid
Highlight autocomplete Highlights `autocomplete` attributes. Flags valid, generic and invalid values with distinct colours.	Testing autocomplete
Highlight shadow DOM Highlights open shadow DOM hosts and custom elements. Flags where shadow DOM cannot be confirmed.	Testing shadow DOM
Track focus order Tracks each focusable element on the page. Click to activate, then `TAB` through the page. Each element is numbered in order. `ESC` to stop.	Testing focus order

Other bookmarklets

Reveal Focus Order via A11y Tools

Show focus styles via A11y Tools

Contrast Checker Via WebAim

WTFocus via A11y Tools