A Simple Web Accessibility Checklist for Developers

Accessible websites work for people who use screen readers, keyboards or magnification, and they are usually easier for everyone to use. You do not need to be an expert to start.

1. Use semantic HTML

Use header, nav, main, button and proper headings instead of generic divs. Assistive technology relies on this structure.

2. Write useful alt text

Describe what an image shows or why it matters. Decorative images should have an empty alt attribute.

3. Keep enough color contrast

Body text should have a contrast ratio of at least 4.5 to 1 against its background. Check colors with a contrast tool.

4. Support the keyboard

Everything clickable must be reachable with the Tab key, and the focused element must be clearly visible. Never remove focus outlines without a replacement.

5. Label every form field

Connect each input to a visible label using the for attribute, and explain errors in text, not only with color.

6. Use a logical heading order

Use one h1 and nest h2 and h3 in order. Do not choose headings for their size.

7. Make links descriptive

"Read the pricing guide" is clearer than "click here," especially for screen reader users who scan a list of links.

8. Respect user settings

Let text scale, support reduced motion with prefers-reduced-motion, and avoid auto-playing media.

9. Test with tools and people

Automated checkers find many issues, but a quick keyboard-only test and a screen reader test find more.