VisualQ
Accessibility

Accessibility viewer

Review and triage accessibility issues found by automated audits.

The Accessibility Viewer displays the results of accessibility audits in a structured, actionable format.

Accessing the viewer

  • From the Tests tab, click the accessibility icon on a run that includes a11y results
  • Direct URL: /projects/[slug]/a11y-viewer?runId=[runId]

Viewer layout

The accessibility viewer includes:

  • Scenario sidebar — navigate between tested scenarios
  • Viewport toggles — switch between phone, tablet, and desktop results
  • Score gauge — overall accessibility score with key performance indicators
  • Screenshot — annotated screenshot with clickable bounding-box overlays highlighting issues

Analysis tabs

The viewer provides four analysis tabs:

Violations

Lists all accessibility violations found, grouped by rule. Each violation shows the rule ID, description, impact level, and affected elements.

Elements

A searchable and sortable table of all affected elements. Filter by impact level (critical, serious, moderate, minor) and sort by selector, rule, or impact.

All Rules

A comprehensive list of all rules evaluated during the audit, including passed rules. Expandable rows show remediation guidance with before/after code snippets.

WCAG

Conformance summary organized by WCAG level (A, AA, AAA) and principle groups (Perceivable, Operable, Understandable, Robust).

Severity levels

LevelMeaning
CriticalBlocks access for users with disabilities
SeriousSignificantly impacts usability for assistive technology users
ModerateCauses some difficulty but has workarounds
MinorBest practice violation with minimal impact

Keyboard shortcuts

The viewer supports keyboard shortcuts for efficient navigation. Press ? to see the full list.

Exporting results

Export your accessibility audit results in multiple formats:

  • JSON — structured data for programmatic processing
  • CSV — spreadsheet-compatible format
  • Print — printer-friendly report

Trend chart

The trend chart shows how your accessibility score and violation count change over time. It requires at least 2 completed runs and displays delta badges showing improvement or regression between runs.

Tips

  • Focus on critical and serious issues first
  • Use the CSS selectors to locate elements in your codebase
  • Run a11y tests regularly to track progress over time
  • Use the WCAG tab to systematically address conformance gaps

On this page