The latest articles on DEV Community by Roshan Madusanka (@mancha). https://dev.to/mancha https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F4245012%2F60b96ab6-c662-491c-9d11-a3b0262f985c.png https://dev.to/mancha en Roshan Madusanka Sat, 14 Nov 2026 19:46:43 +0000 https://dev.to/mancha/i-built-a-website-accessibility-scanner-that-explains-every-fix-in-plain-english-157a https://dev.to/mancha/i-built-a-website-accessibility-scanner-that-explains-every-fix-in-plain-english-157a <p>Most accessibility scanners tell you what is wrong in a language only a specialist reads: <code>color-contrast</code>, <code>label</code>, <code>aria-required-children</code>, plus a link to a WCAG criterion. That's fine if you live in this world. It isn't much help if you run a small business site, or you build sites for clients and need to tell them what to change.</p> <p>So I built <strong>AccessLens</strong>: you enter a URL, and it tells you what's wrong, how much it matters, and how to fix it, in plain English.</p> <h2> What it does </h2> <ul> <li>Opens your site in a real browser (Playwright) and runs axe-core against WCAG 2.1</li> <li>Gives the site a score out of 100</li> <li>Ranks the problems by how much they matter, so you know what to fix first</li> <li>Explains each problem in plain language instead of a rule ID</li> <li>Detects Shopify, WordPress, Wix and Squarespace sites and gives step-by-step fix instructions for those platforms</li> </ul> <h2> How it's built </h2> <ul> <li>Next.js (App Router, TypeScript) and Tailwind</li> <li>PostgreSQL with Drizzle ORM</li> <li>Playwright and axe-core for the scanning</li> <li>No Redis or job queue. A scan runs as a background task after the response is sent, and the frontend polls for the result. It's the simplest thing that works at low volume.</li> <li>It runs on a small VPS, because Playwright plus a real Chromium doesn't fit serverless very well</li> </ul> <h2> What it can't do </h2> <p>Automated scanning only catches part of the accessibility problems on a site. It can't tell whether your alt text is actually meaningful, or whether the keyboard experience makes sense. Think of a scan as a starting point, not a compliance certificate.</p> <h2> Try it </h2> <p>It's in early access and free to try: <a href="https://scanner.analytihq.com/?utm_source=devto&amp;utm_medium=post&amp;utm_campaign=showdev" rel="noopener noreferrer">scanner.analytihq.com</a></p> <p>I'm Roshan, a .NET and RPA developer from Sri Lanka, and this is my first product aimed at web teams. I'd love your feedback:</p> <ul> <li>What would you want a scanner like this to check that the usual ones miss?</li> <li>If you build sites for clients, what would make a report ready to send to a client?</li> </ul> showdev webdev a11y nextjs