Skip to main content
Back to help

Guide

Using the Visual Page Inspector

Review full-page screenshots, contrast heatmaps, and the screen reader map for any audited page.

4 min read

1

Open the inspector from any page card

In a report, open the Pages section and select Inspect on any page card. You can also jump straight to a page's visuals from a finding using the Visuals button.

2

Compare device viewports

Switch between Desktop, Tablet, and Mobile tabs to see how the page actually rendered at each size during the audit. Screenshots are full-page, so scroll to review everything below the fold.

3

Toggle the contrast heatmap

On the Desktop tab, enable Show Contrast Failures to overlay WCAG AA failures directly on the screenshot. Each red box marks the failing element and shows its measured ratio against the required one.

4

Read the Screen Reader view

The Screen Reader tab has two modes. Visual Map highlights every element assistive technology announces, labelled with the exact text users hear. Images flagged 'No alt text!' are invisible to screen readers. Outline Tree shows the interactive ARIA structure.

5

Zoom into details

Click any screenshot to open the viewer, then use the scroll wheel or the zoom controls to magnify up to 800% and drag to pan. Double-click toggles between fit and 3x zoom.

Cookie Consent Preferences

We use cookies to enhance your browsing experience, serve personalized content, and analyze our traffic. By clicking "Accept All", you consent to our use of all cookies. You can manage your preferences or read our Cookie Policy for details.