Accessibility
WCAG, screen readers, keyboard navigation — designing for everyone, not just the majority.
What Web Accessibility Means
Web accessibility means your site is usable by everyone, including people with disabilities:
- Blind users:Use screen readers to read content aloud. Need semantic HTML and alt text on images.
- Low vision users:Use magnifiers or large fonts. Need sufficient color contrast and responsive text sizing.
- Deaf users:Can't hear audio/video. Need captions and transcripts.
- Hard of hearing users:Need captions for audio content. Subtitles for video.
- Motor disabilities:Can't use a mouse. Need full keyboard navigation and large click targets.
- Cognitive disabilities:Need simple language, clear structure, consistent navigation.
About 15% of the global population has some form of disability (per WHO). On the web, this includes temporary disabilities (broken arm, bright sunlight, loud environments) and situational disabilities (using phone with one hand while holding a baby).
Legal Landscape
Accessibility isn't optional — it's increasingly required by law:
ADA (Americans with Disabilities Act, USA)
Requires websites of businesses and public institutions to be accessible. Defined using WCAG 2.1 AA standard. Non-compliance can result in lawsuits and settlements ($10K-$50K+ per violation).
EAA (European Accessibility Act, EU)
Requires digital accessibility for websites and apps. WCAG 2.1 AA standard. Effective late 2025/2026. €20K+ fines per website/app per year.
Section 508 (USA Government)
Federal requirement for government websites and contractors. WCAG 2.1 AA minimum. Losing government contracts if non-compliant.
AODA (Accessibility for Ontarians with Disabilities Act, Canada)
Ontario provincial law. WCAG 2.1 AA required. $100K+ fines per incident.
Bottom line: If your site serves users in the US, EU, Canada, or other regulated jurisdictions, accessibility is legally required, not optional.
WCAG 2.1 and the POUR Principles
Web Content Accessibility Guidelines (WCAG) 2.1 is the standard. Built on four principles (POUR):
Perceivable
Users can perceive the content. This means text has sufficient color contrast, images have alt text, videos have captions, content isn't invisible or imperceptible.
Operable
Users can operate the interface. Full keyboard navigation, no keyboard traps, sufficient time to complete actions, no seizure-inducing flashing.
Understandable
Users can understand the content and interface. Clear language, consistent navigation, predictable behavior, helpful error messages.
Robust
Content works across browsers and assistive technologies. Valid HTML, semantic markup, ARIA used correctly.
Common Accessibility Failures
The most common accessibility problems:
- ✗Insufficient color contrast (text too light on light background)
- ✗Missing alt text on images
- ✗Images of text instead of real text
- ✗Form inputs without labels
- ✗Keyboard navigation broken (can't tab through links)
- ✗Links with generic text ("click here" instead of "Download PDF")
- ✗Auto-playing video/audio
- ✗Missing page language declaration
- ✗Buttons that don't look like buttons (accessibility is about predictability)
Platform Accessibility Status
| Platform | Native Accessibility | WCAG AA Support | Testing Tools | Developer Control |
|---|---|---|---|---|
| Wix | Partial (templates vary) | Some automatic | Limited | Very limited |
| Squarespace | Good (templates tested) | Good | Some | Limited |
| WordPress | Developer-dependent | Via plugins/themes | Good | Full |
| Webflow | Excellent (built-in focus) | Excellent | Good integration | Full |
| Custom Code | Developer responsibility | Full control | Full choice | Complete |
Testing for Accessibility
Automated tools catch 30-40% of accessibility issues. Manual testing catches the rest.
Automated Tools
axe DevTools, Lighthouse, WAVE: Browser plugins that scan pages and report issues. Good for catching obvious problems (missing alt text, low contrast). Can't catch all issues (e.g., semantic meaning, confusing instructions).
Manual Testing
Keyboard only: Navigate entire site without mouse. Can you access all functionality?
Screen reader testing: Use NVDA (Windows) or VoiceOver (Mac) to "read" the site. Does content make sense without seeing it?
Real User Testing
Recruit disabled users to test your site. Can they complete key tasks? What's confusing? Real feedback > theoretical compliance.
The Cost of Ignoring Accessibility
Accessibility failures cost money:
Legal Risk
ADA lawsuits average $35K-$50K in settlements. EAA fines: €20K+/year. Companies like Dominos ($300K+ lawsuit), Beyonce.com ($300K settlement), Nike ($1M+ estimated) have faced major costs.
Lost Revenue
15% of population has disabilities. Poor accessibility excludes this entire segment. If your conversion rate is 2%, and 15% can't access the site, you're losing 0.3% of potential revenue.
SEO Penalty
Google penalizes poor accessibility (inaccessible sites are hard to crawl). Missing alt text, broken semantic HTML, and poor structure all hurt rankings.
Reputation Damage
Inaccessible sites signal bad business practices. Users share negative experiences. Disability community is vocal and remembers non-compliant companies.
The Accessibility Checklist
Before launch, verify:
- ✓Color contrast is at least 4.5:1 for body text (test with WebAIM Contrast Checker)
- ✓All images have descriptive alt text
- ✓All form inputs have associated labels
- ✓Full keyboard navigation works (test with Tab key)
- ✓All links have descriptive text (not "click here")
- ✓HTML is semantic (proper headings, lists, buttons not divs)
- ✓Videos have captions and transcripts
- ✓No auto-playing audio or video
- ✓Page language is declared
- ✓Focus indicators are visible (don't remove the outline!)
The Business Case for Accessibility
Beyond legal requirements, accessibility is good business:
- Market:15% of global population, $4 trillion in spending power (per UN)
- Temporary disabilities:Broken arm, bright sunlight, loud environment. Accessibility helps everyone sometimes.
- Mobile accessibility:Many mobile best practices (large buttons, clear labels) overlap with accessibility requirements
- SEO:Accessible sites are better structured for search engines (proper headings, semantic HTML)