Fernside Studio
Background
Archive
Journal Entry

AI and Accessibility: Making Your Website Work for Everyone

Documented
Capacity
11 MIN READ
Domain
AI & Automation

AI tools promise to make web accessibility easier, faster, and cheaper. Some of those promises are genuine—AI can accelerate alt text generation, flag colour contrast violations, and automate basic audits. But other claims, particularly from overlay tools like AccessiBe, led to a £1 million FTC fine in 2025 for deceptive advertising.

According to Deque’s automated testing research, automated tools identify roughly 57% of digital accessibility issues by volume. That’s valuable—but it means 43% of barriers require human judgment, manual testing, and thoughtful design decisions. AI accelerates accessibility work; it doesn’t replace the need to build inclusively from the start.

For small businesses, the opportunity is clear: use AI to catch obvious mistakes faster, then invest time where it matters most—designing experiences that work for everyone, not just retrofitting compliance after launch.

Where AI Actually Helps With Accessibility

AI tools excel at repetitive, pattern-based tasks. They struggle with context, intent, and subjective judgment. Understanding this boundary helps you deploy AI strategically.

1. AI-Powered Alt Text Generation

Writing descriptive alt text for dozens or hundreds of images is time-consuming. AI tools like AltText.ai and built-in features in WordPress, Shopify, and content management systems can now generate baseline descriptions in seconds.

The accuracy is genuinely impressive for straightforward images—product shots, landscapes, team photos. Research on AI alt text generators shows that modern vision models capture relevant details without human intervention. Claude’s vision capabilities, in particular, produce thoughtful and contextually aware descriptions.

But AI still struggles with nuance. It can describe what an image shows but often misses why it’s included. A photo of a founder holding a laptop might be described as “person with computer” when the context—showcasing approachability or demonstrating a service—requires more specificity.

Best practice: Use AI to generate first-draft alt text, then review and refine high-priority images manually. Homepage heroes, key product shots, and brand-defining visuals deserve human attention. Archive photos and secondary illustrations can often use AI-generated text as-is, provided you’ve spot-checked for accuracy.

For more on building sites that feel premium through thoughtful details like alt text, see our guide on accessibility wins that elevate your site.

2. Automated Colour Contrast Audits

Low contrast text is the number one accessibility violation on the web, affecting 83.6% of websites. It’s also one of the easiest to fix once identified.

AI-powered tools like Lighthouse, axe DevTools, and browser extensions flag contrast violations instantly. They test your colour palette against WCAG AA standards (4.5:1 for body text, 3:1 for large text and interactive elements) and highlight problem areas.

This is precisely the kind of task AI handles perfectly: objective, rule-based testing with clear pass/fail criteria. You don’t need human judgment to determine whether #767676 text on a #FFFFFF background meets contrast requirements—the maths either works or it doesn’t.

Practical tip: Run contrast checks during design, not after launch. Most design tools (Figma, Sketch) include contrast-checking plugins. Catching violations at the mockup stage prevents rework later.

At Fernside Studio, our monochrome aesthetic actually simplifies contrast: black text on white backgrounds, white text on black sections, and careful testing for any mid-grey accents. The result meets WCAG standards without compromising visual clarity. Every Studio Site we build includes contrast validation as standard.

3. Accessibility Audits and Automated Testing

Tools like Lighthouse, axe DevTools, and WAVE scan pages and generate reports listing accessibility violations. They catch missing alt text, unlabeled form fields, improper heading hierarchy, and broken ARIA attributes.

Industry research shows that automated tools reliably test only 25 to 33% of WCAG criteria. But they detect 40–57% of actual issue volume because some violations (like missing alt text) appear repeatedly across a site.

This makes automated audits valuable for baseline checks. Run them weekly during active development. Fix the obvious issues—missing labels, skipped heading levels, empty links—immediately. Save manual testing for complex interactions like custom dropdowns, modal dialogs, and dynamic content updates.

Best practice: Treat automated audits as first-pass diagnostics, not certification. If Lighthouse scores your site 95/100 for accessibility, that’s encouraging—but it doesn’t guarantee usability for screen reader users or keyboard-only navigation.

4. AI-Assisted Caption and Transcript Generation

Video content requires captions for deaf and hard-of-hearing users. Audio content needs transcripts. Manually transcribing 20 minutes of video takes hours.

AI transcription tools like Otter.ai, Descript, and YouTube’s auto-captioning generate accurate transcripts in minutes. According to accessibility tool testing, modern speech-to-text models achieve 90%+ accuracy for clear audio in standard accents.

The remaining 10% still requires human correction—especially for technical terminology, branded terms, or speakers with strong accents. But starting from a 90% accurate draft is exponentially faster than transcribing from scratch.

Practical tip: If you host video walkthroughs or recorded demos on your site, run them through an AI transcription tool, review the output for accuracy, then publish both video and text versions. This helps not only accessibility but also SEO—search engines index your transcript content, making video discoverable through text search.

We covered embedding video effectively in our post on video walkthroughs on your website.

5. Keyboard Navigation Testing Tools

Not everyone uses a mouse. Screen reader users, people with motor impairments, and keyboard power users navigate sites entirely via Tab, Enter, and arrow keys.

Testing keyboard navigation manually is straightforward but time-consuming: press Tab repeatedly, check that focus indicators are visible, ensure every interactive element is reachable. AI tools can’t fully automate this—they can’t judge whether focus order feels logical—but they can flag missing tabindex attributes, invisible focus states, and keyboard traps where users get stuck in a component.

Tools like axe DevTools and Pa11y detect technical keyboard issues. You still need to manually test the experience, but automated checks catch structural problems early.

The Limits of AI Accessibility Tools

AI accelerates accessibility work, but it can’t replace thoughtful, inclusive design. Here’s where AI falls short—and why human judgment remains essential.

AI Can’t Understand Context

An AI might describe a photo as “person standing in front of building.” If that person is your founder and the building is your office, the alt text should say so. If the image is purely decorative, the alt text should be empty (alt="") so screen readers skip it entirely.

These decisions require understanding the image’s purpose within the page—something AI can’t infer reliably.

AI Can’t Test Real Usability

Automated tools check for technical compliance: Does this button have a label? Is heading hierarchy logical? But they can’t assess whether your site feels effortless to navigate, whether form error messages are genuinely helpful, or whether your custom dropdown confuses screen reader users.

Accessibility experts agree that between 20% and 40% of accessibility issues can be found through automation alone. The rest require manual testing with assistive technology and, ideally, feedback from users with disabilities.

AI Overlays Often Make Things Worse

Overlay tools—plugins that claim to “make your site accessible instantly”—are controversial for good reason. Products like AccessiBe, UserWay, and similar services inject JavaScript that supposedly fixes accessibility issues without touching your site’s code.

In January 2025, the FTC fined AccessiBe £1 million for deceptive advertising. The agency found that AccessiBe’s claims—that its overlay could “make any website compliant with WCAG”—were false. The tool could not, in fact, automatically fix complex accessibility barriers.

More than 400 blind people, accessibility advocates, and developers signed an open letter calling on companies to stop using overlay tools. Their core argument: overlays don’t fix underlying issues. They add another layer of technology that often interferes with the assistive tools disabled users already rely on.

Digital accessibility lawsuit data shows that 25% of all lawsuits in 2024 targeted websites using overlays—because those overlays were cited as barriers to access, not solutions.

Bottom line: Don’t use accessibility overlays. They promise quick fixes but deliver ongoing liability and frustrated users. The real solution is building accessibility into your site’s structure from the start.

What Every Small Business Site Needs

AI tools help you move faster, but they don’t define what “accessible” means. That comes down to core principles every site should meet, regardless of tooling.

1. Proper Heading Structure

Use headings (<h1>, <h2>, <h3>) to create a logical content hierarchy. Screen readers let users jump between headings to navigate quickly. Skipping levels (H1 → H3 without an H2) breaks that navigation flow.

Automated tools catch heading errors easily. Just fix them.

2. Descriptive Alt Text for Images

Every meaningful image needs alt text. Decorative images (borders, spacers, purely aesthetic graphics) should use empty alt attributes: alt="".

Write naturally. Describe the image as if explaining it over the phone. Don’t keyword-stuff or write “image of”—screen readers already announce it’s an image.

3. Keyboard Navigation That Works

Tab through your site without a mouse. Can you reach every link, button, and form field? Are focus indicators visible? Can you submit forms and open menus using only the keyboard?

If not, fix it. This benefits not only users with disabilities but also power users who navigate faster via keyboard.

4. Sufficient Colour Contrast

Text must meet WCAG contrast ratios: 4.5:1 for normal text, 3:1 for large text and interactive elements. Use browser DevTools or plugins like WebAIM’s Contrast Checker to test.

If your elegant grey-on-grey palette fails, adjust slightly. You don’t need to abandon your aesthetic—just ensure readability.

5. Form Labels and Error Messages

Every input needs a visible, associated <label>. Placeholder text is not a substitute—it disappears when users start typing.

Error messages should explain what went wrong and how to fix it. “Invalid email” is unhelpful. “Email must include an @ symbol” is clear.

6. Responsive Design That Scales

Responsive design isn’t just about mobile—it’s about supporting users who zoom text to 200% or rely on larger default font sizes. Your layout should adapt gracefully without breaking or hiding content.

If your site doesn’t work on mobile, it’s also failing desktop users with vision impairments who zoom aggressively.

How Fernside Studio Builds Accessible Sites by Default

We treat accessibility as a baseline feature, not an optional add-on. Every Studio Site we build includes:

  • Semantic HTML structure that screen readers and search engines understand
  • Keyboard navigation support with visible focus states
  • Tested colour contrast meeting WCAG AA standards
  • Descriptive alt text written during the build, not retrofitted
  • Accessible forms with proper labels and clear error handling

Our Astro + Cloudflare Pages stack makes this easier. Astro generates clean, semantic HTML by default. No JavaScript framework bloat interfering with assistive technology. No client-side routing breaking screen reader navigation. Just fast, accessible markup that works for everyone.

We also use AI strategically: automated contrast checks during design, Lighthouse audits on every deploy, and AI-generated alt text as a starting point for secondary images. But we never rely on AI alone—every site undergoes manual keyboard testing and real-device checks before launch.

Starting from £2,400, our Studio Sites combine calm monochrome design with accessible structure and performance optimisation. You don’t pay extra for accessibility—it’s built in.

For teams evaluating AI tools for accessibility or workflow automation, our AI consultancy service helps you choose tools strategically, integrate them without disruption, and avoid the expensive mistakes (like overlays) that waste budget and create liability.

Use AI Where It Helps, Build Thoughtfully Everywhere Else

AI tools are genuinely useful for web accessibility—they catch obvious violations faster, generate baseline alt text, and automate repetitive audits. But they’re assistants, not replacements for thoughtful design.

The small businesses winning with accessible websites aren’t relying on overlays or chasing automated perfection scores. They’re building inclusively from the start: clear structure, readable text, logical navigation, and real testing with real users.

If your current site fails basic accessibility checks, start with manual fixes to the fundamentals: contrast, alt text, heading structure, keyboard support, form labels. Then layer in AI tools to maintain quality as you add content and features.

And if you’re building a new site or refreshing an existing one, make accessibility a baseline requirement from day one. It’s easier, cheaper, and more effective than retrofitting later.

The businesses winning online aren’t waiting to fix accessibility — they’re building it in from the start. We only take on a handful of builds each month, and slots fill quickly. Check availability and we’ll confirm your earliest project start within 24 hours. Don’t let another quarter pass with a site that’s turning away 16% of your potential customers.

Sources

Say hello

Quick intro