Accesserty DevCheck bởi Accesserty

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

It is built for 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:

Simulate accessibility barriers such as color vision differences, low vision, text spacing issues, visual field loss, dyslexia-like reading difficulty, and touch target conflicts.
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.
Feel what a hand tremor does to pointing: the cursor shakes (light, medium or heavy, matched to the 24 px and 44 px target sizes in WCAG) and each click lands where the shaking cursor is, so small or crowded buttons get missed or the wrong one gets pressed. A panel counts the misses and shows the size of each missed target. Keyboard use is not affected.
Use the page with the sound off: silent mode mutes the tab, tells you each time the page makes a sound you cannot hear so you can check whether the screen showed the same information, and lists every video and audio with whether it has a captions track or needs a transcript.
Use manual review lenses that draw the page's structure for you to judge:
Focus path: keyboard focus order with numbered markers, connecting lines, a mini map, and orange review hints for possible jumps.
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.
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.
Accessible names: hover over an element or move to it with Tab to see its role, accessible name and where the name comes from, with hints when the visible label is not part of the name, a name looks like code, or links share a name but go to different places. Elements inside web components (open shadow roots) are included.
Reading preview: the page listed in reading order the way a screen reader roughly announces it, read aloud with voices installed on your device, plus heading, link, form-field and landmark lists that show repeated link text out of context. It is an approximation, not the output of a specific screen reader.
Forms: each field's accessible name and where it comes from, with lines to its label, description and error message and boxes around field groups; hints for a placeholder as the only name, a visible label replaced by aria-label, "required" shown only on screen or only in code, personal-data fields without autocomplete, errors not tied to their field, and fields inside web components that are not part of the form. "Try submitting" watches what the page does after you press its own submit button — whether errors are tied to fields, announced, and given focus. DevCheck never submits a form itself, and stops the browser's own submission while it watches.
Stop motion: pauses CSS and script animations, videos, animated images, SVG animations and marquees, then marks what still moves and whether a pause control is nearby, and tells you whether the site has styles for reduced motion.
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.
Review confirmed findings separately from items needing manual review, locate every affected instance where accessible, and copy a text summary into your existing issue tracker. DevCheck does not provide issue management.
Run AI-assisted semantic checks for link purpose, language marking, image alt text quality, and suggested alt text improvements.
Check selected local PDF files for common accessibility signals, including document language, tags, outlines, links, images, and form fields.
Test public websites, internal environments, authenticated states, and localhost pages during development or review.
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.

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. The reading preview speaks only with voices installed on the device and never sends page text to an online speech service.

AI Semantic Check is optional and user-triggered. It sends a bounded sample of visible page text, link-name metadata, and selected images that the page itself permits reading to Google Gemini, either directly with the user's own Gemini API key or through Accesserty's limited free proxy. The shared path also sends a random extension instance ID to Accesserty, and the service derives an IP hash, for quota enforcement. It omits dedicated page/destination/image-source URL fields and does not send the full DOM, browsing history, form values, PDF files or scan results. URLs in sampled text, names or images may still be sent.

Local tools are free. Shared AI has daily and rate limits; your own key uses Google's quotas, pricing and data terms. AI reports its sampling limits and cannot verify destination contents from a link name. Browser-internal/store pages are protected; refresh scans after page changes. PDF checks provide structure signals, not PDF/UA conformance.

AI naming metadata may include visually hidden ARIA-referenced text and SVG titles. Editable content and some CSS-hidden text are excluded. Clipped or off-screen text may still be sampled; this is not a sensitive-data detector. Under Google's unpaid-service terms, inputs and generated responses may be used for product/model improvement and processed by human reviewers. Using your own key does not itself change those terms; the project's billing status and applicable regional terms matter. Do not submit confidential, unauthorized, or personal information to unpaid AI services. See https://ai.google.dev/gemini-api/terms.

AI results distinguish complete, partial and unusable responses. Valid findings can remain available when other records are discarded; incomplete or unusable results do not mean the page has no issues. Shared quota counts submitted requests even when the AI result is incomplete or unusable. Copied/downloaded reports are created locally and can include the page URL and sampled content; review them before sharing.