Aria-label is used to provide accessible name for the interactive elements, when aria-label or aria-labelledby is used extensively on a web page the aria-label bookmarklet will come in handy to check if the accessible name provided for the interactive elements is descriptive and sufficient.

ARIA-Label Bookmarklet for Accessibility Testing

• If an element has an aria-label, it should get a yellow background and the label displayed in red.
• If an element has an aria-labelledby attribute, it should have a pink background and the object it is pointing to will be displayed in green.

ARIA-Label Bookmarklet Code

See the Pen ARIA-Label Bookmarklet by HolisticA11Y by HolisticA11Y (@HolisticA11YHub) on CodePen.

We hope these accessibility bookmarklets come in handy during your next accessibility audit.

References: ARIA-Label Bookmarklet