Web Accessibility Basics: What Every Developer Should Know in 2026

1 in 4 adults has a disability. If your site doesn't work for them, you're excluding 25% of potential users — and increasingly, breaking the law. Here's the practical minimum for web accessibility in 2026.

The big four (cover 90% of issues)

1. Semantic HTML

Use the right element for the job. <button> for actions, <a> for links, <nav> for navigation, <main> for main content, <h1>–<h6> in order. Screen readers use these to navigate. A <div onClick> is invisible to assistive technology.

2. Alt text on images

Every <img> needs an alt attribute. Descriptive for content images ("Team meeting in a modern office"). Empty (alt="") for decorative images. "Image" or "photo" as alt text is worse than nothing.

3. Keyboard navigation

Every interactive element must be reachable and operable with Tab, Enter, and Escape. Test by unplugging your mouse and navigating the entire page with keyboard only. If you can't reach something, neither can a screen reader user.

4. Color contrast

Text must have at least 4.5:1 contrast ratio against its background (WCAG AA). Use a contrast checker — your eye isn't a reliable instrument. Light gray text on white is the #1 contrast failure on the web.

Quick wins

• Don't disable zoom. user-scalable=no and maximum-scale=1 in the viewport meta prevent zooming, which is an accessibility requirement for low-vision users.
• Label all form inputs. Every <input> needs a visible <label>. Placeholder text is not a label — it disappears on focus.
• Focus indicators. Don't remove :focus outlines. If you customize them, make them visible (e.g., focus:ring-2 focus:ring-primary).
• Skip navigation link. A hidden "Skip to main content" link at the top of the page lets keyboard users bypass the header nav.

Testing

• Lighthouse accessibility audit — catches the most common issues automatically.
• axe DevTools browser extension — more detailed than Lighthouse for accessibility-specific testing.
• Keyboard-only navigation — the single best manual test. Tab through the page. Can you reach everything? Can you see where focus is?
• Screen reader testing — VoiceOver (Mac), NVDA (Windows). Test at least once before shipping.

AI builders and accessibility

AI-generated sites handle the basics well: semantic HTML, heading hierarchy, alt text prompts, and responsive layouts. Where they fall short: complex ARIA patterns (live regions, composite widgets), keyboard trap prevention, and skip-navigation links. Always do a Lighthouse audit and keyboard test on AI-generated output before shipping to production.