Accessibility Code Fix Guides
These guides cover the WCAG 2.1 AA issues that show up most often in automated scans, manual audits, and ADA demand letters. Each page walks through what the problem is, why it matters for real users, how WCAG addresses it, and how to fix it in HTML, CSS, or framework code with copy-pastable examples.
Every guide is written for developers and product teams who want to fix the underlying code rather than install an overlay widget. Pair these guides with manual keyboard testing and a screen reader pass before considering an issue resolved.
Real-label vs placeholder, fieldsets and legends, aria-describedby for help and error text, plus a manual testing checklist.
Replace clickable divs, fix hover-only menus, audit focus order, keep modals usable, and prevent keyboard traps.
Brand-friendly :focus-visible styles for buttons, links, inputs, navigation, and custom components without dropping outlines.
Decide between empty, descriptive, and functional alt text for product images, icons, logos, charts, and decorative graphics.
Practical contrast fixes for body text, buttons, links, placeholders, text-over-image hero sections, error states, and chart colors.
More fix guides are in the works. New pages are added as they pass an editorial quality review covering accuracy, code examples, manual testing steps, and source linking.
Run a free WCAG 2.1 AA scan on your site
ADA CodeFix scans your pages, identifies likely WCAG failures, and generates developer-reviewable code fixes — not vague descriptions, real HTML and CSS you can ship.
Scan My Site Free