Accesserty DevCheck bởi Accesserty

Accesserty DevCheck helps people review web accessibility earlier, directly in the browser.

It is built for designers, QA testers, frontend developers, PMs, content and operations staff, and anyone who needs to understand whether a page remains usable for people with different access needs.

DevCheck organizes its tools into four tabs: Simulation, Review, Scan, and AI Check.

What you can do with DevCheck:

1. Simulate accessibility barriers such as color vision differences, low vision, text spacing issues, visual field loss, dyslexia-like reading difficulty, and touch target conflicts.
2. Use manual review lenses that draw the page's structure for you to judge:
   a. Focus path: keyboard focus order with numbered markers, connecting lines, a mini map, and orange review hints for possible jumps.
   b. Heading structure: an h1–h6 outline with level badges on the page, including screen-reader-only headings that are invisible to sighted reviewers, plus hints for skipped levels, multiple h1s, and empty headings.
   c. Landmark regions: header/nav/main and other landmarks drawn as labeled regions, with hints for missing or duplicated main, same-type landmarks without distinguishing names, and content that sits outside every landmark.
3. Run automated axe-core accessibility checks on the current webpage, covering WCAG 2.0, 2.1, and 2.2 A/AA rules plus best practices. Rule descriptions display in Traditional Chinese when the browser language is Chinese.
4. Review categorized WCAG-related findings directly on the page.
   Run AI-assisted semantic checks for link purpose, language marking, image alt text quality, and suggested alt text improvements.
5. Check selected local PDF files for common accessibility signals, including document language, tags, outlines, links, images, and form fields.
6. Test public websites, internal environments, authenticated states, and localhost pages during development or review.
7. DevCheck is not a replacement for manual accessibility review or assistive technology testing. It helps people find common issues earlier, discuss accessibility with more concrete context, and improve before release.
8. Try a screen magnifier simulation (×2 / ×3 / ×4) that enlarges a local region and follows your mouse and keyboard focus, modeling an OS-level magnifier rather than browser page zoom, so you can see how a fixed layout behaves when it cannot reflow to fit.

Review lenses are manual review aids. Orange marks are things to review, not confirmed WCAG failures.

Simulations, review lenses, axe-core checks, and PDF checks run locally in the browser.

AI Semantic Check is optional and user-triggered. It sends extracted page text and selected images to Google Gemini, either directly with the user's own Gemini API key or through Accesserty's limited free proxy. It does not send full DOM, browsing history, form values, PDF files, or scan results.