Skip to main content

WCAG Accessibility

Open in QuickMonitoring→ Sites → [Your Site] → Scans → Validation

WCAG (Web Content Accessibility Guidelines) compliance is increasingly a legal requirement, not just a best practice. QuickMonitoring checks each crawled page for common accessibility violations — missing alt text, poor color contrast, missing form labels, keyboard navigation issues. Automated checks won't catch everything, but they catch the most common violations reliably.

What you'll see​

Go to Sites → your site → Validation (sidebar) → filter "Accessibility".

Issues are tagged with their WCAG criterion, for example:

  • 1.1.1 Non-text Content — missing alt text on images
  • 1.4.3 Contrast (Minimum) — text that doesn't meet the contrast ratio requirement
  • 2.1.1 Keyboard — elements that aren't keyboard accessible
  • 4.1.2 Name, Role, Value — interactive elements missing accessible names

Each violation shows the element, the criterion violated, and what needs to change.

How to use it​

  1. Run a scan
  2. Go to Sites → your site → Validation (sidebar) → filter "Accessibility"
  3. Review violations — each shows the element, the criterion, and what to fix
  4. Prioritize critical violations (keyboard accessibility, alt text, form labels) over warnings (best-practice suggestions)

For client deliverables: export the accessibility report and include it in your QA handoff. It shows exactly what needs fixing before launch.

Pass condition​

✅ You've earned this achievement when the Accessibility filter in Validation shows results for at least one crawled page.

Common issues​

  • Color contrast failures on dark-mode themes — Contrast ratios are calculated against the actual rendered colors. If your site has a dark mode toggle, the crawler captures whatever the default state is. Contrast issues are real — fix them with adjusted color values, not opacity tweaks (opacity reduces contrast further).

  • "Missing alt text" on decorative images — Decorative images (dividers, backgrounds, purely visual icons) should have alt="" to explicitly mark them as presentational. Screen readers will then skip them. An empty alt attribute is correct and intentional — don't add filler text like alt="image".

  • Keyboard accessibility failures on custom components — Custom dropdowns, modal dialogs, and carousels built without ARIA roles often fail keyboard navigation checks. These require code changes, not just HTML attribute additions.

  • High violation count on a page with a form — Forms are a common source of accessibility failures. Missing <label> elements, placeholder-only labels, and inputs without associated labels all fail WCAG 1.3.1 and 4.1.2. Fix the form markup — don't rely on placeholders to label fields.