Browser Bookmarklets

Overview

Bookmarklets are special browser bookmarks—ideally used in Chrome—that run small bits of code when clicked. You can use them while viewing a web page to highlight or analyze specific elements, such as headings or form labels. This makes it easier to check that your headings are properly ordered and your forms are accessible.

How to Create a Bookmarklet

1. Create a new bookmark:

   • On your Bookmarks bar, right-click (or Control + click on Windows / Command + click on Mac). A menu should appear.

   • Choose Add Page (or Add Bookmark, depending on your browser).

2. Add the bookmarklet code:

   • In the URL or Address field, delete any existing link.

   • Paste the bookmarklet code (provided below) instead.

   • In the Name field, give your bookmarklet a clear name, such as “Headings”.

3. Stay organized:

   • (Optional) Create a folder named Bookmarklets to group all your bookmarklets together for easy access.

Headings

javascript:if(window.a11yHeadings)window.a11yHeadings.run()%3Belse%7B(function()%7Bvar link%3Ddocument.createElement(%27link%27)%3Blink.rel%3D%27stylesheet%27%3Blink.type%3D%27text/css%27%3Blink.href%3D%27https://accessibility-bookmarklets.org/build/styles.css%27%3Bdocument.getElementsByTagName(%27head%27)%5B0%5D.appendChild(link)%3Bvar script%3Ddocument.createElement(%27script%27)%3Bscript.type%3D%27text/javascript%27%3Bscript.src%3D%27https://accessibility-bookmarklets.org/build/headings.js%27%3Bdocument.getElementsByTagName(%27head%27)%5B0%5D.appendChild(script)%3B%7D)()%3B%7D

Landmarks

javascript:if(window.a11yLandmarks)window.a11yLandmarks.run()%3Belse%7B(function()%7Bvar link%3Ddocument.createElement(%27link%27)%3Blink.rel%3D%27stylesheet%27%3Blink.type%3D%27text/css%27%3Blink.href%3D%27https://accessibility-bookmarklets.org/build/styles.css%27%3Bdocument.getElementsByTagName(%27head%27)%5B0%5D.appendChild(link)%3Bvar script%3Ddocument.createElement(%27script%27)%3Bscript.type%3D%27text/javascript%27%3Bscript.src%3D%27https://accessibility-bookmarklets.org/build/landmarks.js%27%3Bdocument.getElementsByTagName(%27head%27)%5B0%5D.appendChild(script)%3B%7D)()%3B%7D

Forms

javascript:if(window.a11yForms)window.a11yForms.run()%3Belse%7B(function()%7Bvar link%3Ddocument.createElement(%27link%27)%3Blink.rel%3D%27stylesheet%27%3Blink.type%3D%27text/css%27%3Blink.href%3D%27https://accessibility-bookmarklets.org/build/styles.css%27%3Bdocument.getElementsByTagName(%27head%27)%5B0%5D.appendChild(link)%3Bvar script%3Ddocument.createElement(%27script%27)%3Bscript.type%3D%27text/javascript%27%3Bscript.src%3D%27https://accessibility-bookmarklets.org/build/forms.js%27%3Bdocument.getElementsByTagName(%27head%27)%5B0%5D.appendChild(script)%3B%7D)()%3B%7D