Web accessibility: the essential checklist for your company website

An accessible website works for people with visual, hearing, motor or cognitive disabilities, and also for someone on a phone in bright sunlight or with one hand busy. Accessibility improves the experience for everyone.

1. Semantic structure

Use the right HTML elements: header, nav, main, footer, headings in logical order, lists for lists and buttons for actions. Screen readers rely on this structure to navigate.

2. Alt text for images

Informative images need a short, objective description. Purely decorative images should have an empty alt so they are skipped. Avoid starting with “image of”.

3. Color contrast

Normal text needs a contrast ratio of at least 4.5:1 against its background, and large text 3:1. Don’t rely on color alone to convey information, such as showing an error only in red.

4. Keyboard navigation

Try moving through the site using only the Tab key:

• is the order logical?
• is focus always visible?
• can menus and dialogs be opened and closed with the keyboard?
• is there a link to skip straight to the main content?

5. Forms

Every field needs an associated label, clear error messages and an indication of what’s required. Don’t wipe what the person typed when an error occurs.

6. Video and audio

Provide captions and, when possible, a transcript. Avoid autoplay with sound.

7. Motion and timing

Respect the reduced-motion preference and don’t put short time limits on important actions without a warning and a way to extend them.

How to test

1. Run an automated audit, which catches many contrast and labeling issues.
2. Navigate using only the keyboard.
3. Test with a screen reader, such as NVDA or VoiceOver, at least on the main pages.
4. Zoom the browser to 200% and check that nothing breaks.

The cost-benefit

Building accessibility in from the start costs little. Fixing it later, on a finished site, costs far more. Including these requirements in the initial spec is the cheapest way to get it right.