Website accessibility isn't a nice-to-have feature anymore. It's a legal requirement under the Americans with Disabilities Act, a real issue for millions of users who depend on accessible sites to do business, and increasingly the foundation of good user experience and SEO. This is a practical guide to understanding WCAG compliance, what it actually means, and how to audit and fix your site.
Why accessibility matters now
There are three reasons to care about accessibility: people, law, and business sense.
People: About 26% of Americans have a disability. Some are temporary (a broken arm, post-surgery), some are permanent (blindness, hearing loss, cerebral palsy), some are situational (too much glare on a phone screen, loud background, low battery). Accessible design works for all of them. It's not a ramp for wheelchairs; it's a ramp that everyone uses.
Law: The ADA applies to any website serving the public. The Department of Justice has settled dozens of cases. Class-action lawsuits have reached millions in damages. Your state probably has its own accessibility laws too. No regulator is hunting small businesses yet, but most litigation starts with a user complaint. The risk is real and growing. Our accessibility services help businesses audit and fix this before it becomes a legal emergency.
Business: Accessible sites are faster, more mobile-friendly, easier to navigate, and rank better in search. The technical practices that make a site accessible (semantic HTML, alt text, proper headings, keyboard support) overlap almost entirely with good SEO and UX. Fix accessibility and you fix speed, structure, and usability all at once.
What WCAG 2.1 AA actually means
WCAG stands for Web Content Accessibility Guidelines, published by the W3C. There are three levels: A (minimum), AA (middle), and AAA (strictest). Most ADA lawsuits reference AA standard. Most regulations enforce AA. It's the practical sweet spot.
WCAG 2.1 AA means:
- Vision: Text is large enough to read, color contrast is strong enough (4.5:1 for regular text), and images have text descriptions. Videos have captions and audio descriptions.
- Hearing: All audio has captions or transcripts. Videos with sound have captions burned in or always visible.
- Motor: Your entire site works with keyboard alone (no mouse required). Focus states are obvious. Buttons and links are large enough to hit. You can pause, stop, or hide auto-playing content.
- Cognitive: Instructions are clear. Pages have proper heading structure so screen readers can navigate quickly. Forms have labels. Error messages say what went wrong, not just "Error."
It's not about perfection. It's about removing barriers that block real people from using your site.
The practical WCAG checklist
Here are the most common issues we find and how to fix them:
| Issue | Why it matters | How to fix it |
|---|---|---|
| Missing or poor alt text on images | Screen readers can't describe the image. Users miss context. Search engines can't index the image. | Write alt text for every image. Be descriptive but concise (under 125 chars). Decorative images get alt="". |
| Low color contrast | People with low vision or color blindness can't read it. Fails WCAG AA (4.5:1 for text). | Use a contrast checker (WebAIM, Contrast Ratio). Aim for 4.5:1 or 7:1. Dark text on light background usually works. |
| Keyboard navigation broken | Users who can't use a mouse are stuck. Tab order jumps around randomly. Focus is invisible. | Test Tab through entire site. Fix tab order in HTML. Add :focus styles so focus is always visible. Make sure skip links work. |
| Form fields without labels | Screen readers can't tell the user what to type. Mobile users tap the wrong field. | Add |
| Missing or broken heading hierarchy | Screen readers use headings to navigate and understand structure. Random , order confuses both users and AI. | Use one per page. Use for subsections. Never skip heading levels. |
| No focus states visible | Keyboard users can't see where they are on the page. They tab blindly. | Add CSS for :focus and :focus-visible. Make focus borders obvious (color, outline). Don't remove the default focus ring without replacing it. |
| Videos without captions | Deaf and hard-of-hearing users miss dialogue and sound cues. Bad for mobile (sound often muted). | Add burned-in captions (YouTube's auto-captions are a start but need review). Add audio descriptions for visual-only content. |
| Link text is generic ("Click here") | Screen readers read links out of context. "Click here" tells the user nothing. PDF links need a hint: "PDF, 2.3 MB". | Write descriptive link text. "Learn more about web accessibility" beats "Learn more." Add file type and size for downloads. |
Overlay widgets (the little icons that claim to fix accessibility automatically) are not real compliance. Courts and the Department of Justice have ruled that widgets cannot fix underlying code problems. They may help some users with some issues, but they won't pass an audit or a legal defense. Accessibility is fixed in the code, not by a plugin. If a vendor tells you their overlay meets ADA requirements, they're not being honest.
How to test your site
Testing happens in layers. Start with automated tools, then move to manual testing:
- Automated scanning (40% of issues): Use WAVE, Axe DevTools, Lighthouse, or NVDA. They catch missing alt text, low contrast, and broken structure quickly. These are free and take 15 minutes. Do this first.
- Keyboard testing (critical): Close the mouse. Navigate your entire site with Tab, Shift+Tab, Enter, and arrow keys. If you get stuck or can't see focus, that's a failure. Keyboard access is non-negotiable.
- Screen reader testing (essential): Use NVDA (free, Windows) or VoiceOver (built into Mac and iOS). Listen to how your site sounds when read aloud. Are form fields labeled? Are headings clear? Does a screen reader user understand the page?
- Contrast and mobile testing: Check text contrast with WebAIM Contrast Checker. Test on mobile, in sunlight, and at small screen sizes.
- Professional audit (recommended): Pay for a WCAG expert to audit your site and write a detailed report. They'll catch the 60% of issues automation misses. This costs $500 to $5,000 depending on site size, but it's insurance against lawsuits and a roadmap to real compliance.
Automated tools are fast but incomplete. Manual testing is slower but catches real-world problems. An expert audit is the gold standard. Our accessibility services include professional audits, remediation roadmaps, and implementation support.
The honest note on legal exposure
The ADA applies to websites. Non-compliance can trigger demand letters, lawsuits, and settlements reaching six or seven figures. Most lawsuits start when someone can't use your site. The smart move: fix it now, while it's a line-item cost, not a legal emergency and a PR crisis.
What matters in court is good faith. You don't need 100% perfect WCAG AA compliance to be safe. You need to show you've audited the site, found the barriers, fixed them, and keep improving. Document your effort. Get a professional audit. That's a legal defense. Ignoring accessibility entirely is what draws litigation.
Audit your site today
Get a professional accessibility audit and a clear roadmap to WCAG AA compliance. We'll identify barriers, prioritize fixes, and support implementation.
Request an AuditAccessibility is ongoing
A one-time audit is a start, but accessibility is ongoing. New content can break it. Browser updates can expose issues. The standard keeps evolving. The best businesses treat accessibility like they treat security: a foundational practice, built into how you code and write, not a one-time fix.
Start with the checklist above, run automated tests, test with a keyboard and screen reader, and get a professional audit. Then fix the big things first. As you improve, you'll find smaller issues. Build accessibility into your development process, and you'll stay compliant without constant effort.