Making your website accessible

Updated October 2026.

What is web accessibility?

Web accessibility means that everyone can use a website, including people with disabilities that affect vision, hearing, movement or thinking. It also helps people in temporary situations: a broken arm, a phone in bright sunlight, a slow connection.

That is a lot of people. The World Health Organization estimates that 1.3 billion people, about 16% of the world’s population, live with a significant disability. Many of the fixes help everyone else too: clear headings, readable text and forms that work on a phone.

WCAG 2.2 is the standard to build to

The W3C’s Web Content Accessibility Guidelines (WCAG) are the standard that laws, contracts and audits refer to. Each requirement, called a success criterion, has a level: A is the minimum, AA is the usual target and AAA is the highest.

The current version, WCAG 2.2, became a W3C Recommendation on October 5, 2023. The versions are backwards compatible: the W3C says content that conforms to WCAG 2.2 also conforms to 2.1 and 2.0. The only requirement dropped in 2.2 is 4.1.1 Parsing, which the W3C now treats as obsolete.

What’s new in WCAG 2.2

WCAG 2.2 added nine success criteria. These six are at levels A and AA:

• Focus Not Obscured (Minimum), AA: when you move through a page with the Tab key, the highlighted item mustn’t be completely hidden behind a sticky header, cookie banner or chat button.
• Dragging Movements, AA: anything you can do by dragging, such as a slider or reordering a list, also needs a way to do it with simple clicks or taps.
• Target Size (Minimum), AA: buttons and links need to be at least 24 by 24 CSS pixels, or have enough space around them, with a few exceptions such as links inside a sentence.
• Consistent Help, A: if a page offers help, such as a phone number, contact link or chat, it should be in the same place on every page.
• Redundant Entry, A: don’t ask people for the same information twice in one process. Fill it in for them or let them pick it, like “same as billing address”.
• Accessible Authentication (Minimum), AA: signing in mustn’t depend on remembering, solving or retyping something, unless there is another way. Letting password managers fill in passwords and allowing copy and paste are the usual ways to meet it.

The other three, Focus Not Obscured (Enhanced), Focus Appearance and Accessible Authentication (Enhanced), are at level AAA.

A practical accessibility checklist

These checks catch the most common problems. Most of them take a few minutes per page.

Check contrast and color

Contrast matters for anyone with low vision, and for everyone reading a phone outdoors. The contrast ratio between text and its background should be at least 4.5 to 1 for normal text and 3 to 1 for large text. Buttons, form borders and focus outlines need at least 3 to 1 against what is next to them. WebAIM’s contrast checker tells you if a pair of colors passes.

Color shouldn’t be the only way you show something. About 1 in 12 men have a color vision deficiency, according to the National Eye Institute. Mark important information, such as an error in a form, with an icon, text or underline as well as color.

A quick test: if you printed the page in black and white, could you still understand it?

Make every part of the site work with a keyboard

Many people can’t use a mouse and move through pages with the keyboard instead. Press Tab repeatedly on your site. Can you reach every link, button, menu and form field, in a sensible order? Can you always see which item is highlighted? That highlight is called the focus indicator. You can style it to match your design, as long as it stands out clearly.

Under WCAG 2.2, check that sticky headers and pop-ups never cover the highlighted item completely. Anything that appears when you hover with a mouse, such as a menu or tooltip, should also appear when you reach it with the keyboard. WebAIM’s guide to keyboard accessibility explains the details.

Give images alternative text

People who can’t see images rely on screen readers, which read out each image’s alternative text, or “alt text”. Describe what the image shows and why it’s there. Decorative images can have empty alt text, so screen readers skip them.

Search engines read alt text too. Google says it uses alt text with the page’s content to understand what an image shows, and warns against stuffing it with keywords.

Use real headings and page structure

Screen reader users often jump from heading to heading to find what they need. Use proper heading tags in order, rather than just making text bigger and bolder. Mark the main areas of the page, such as the header, navigation, main content and footer, with HTML landmarks so people can jump straight to them. The W3C explains how in its guide to landmark regions.

Make buttons and links easy to hit

Give buttons and links a target of at least 24 by 24 CSS pixels, or enough space between them that a finger can’t hit the wrong one. If anything works by dragging, such as a slider, a map or a sortable list, add buttons that do the same job.

Make forms and sign-in easy

• Give every field a visible label. Placeholder text disappears when you start typing, so it can’t do the job alone.
• Explain errors in words, next to the field, and say how to fix them.
• Don’t ask for the same information twice in one process.
• Let people paste into password fields and use password managers. Avoid puzzles that are the only way to sign in.
• Put help, such as your phone number or contact link, in the same place on every page.

Caption video and let text resize

Add captions to videos with speech. Then zoom your browser to 200%: text should get bigger without being cut off or overlapping, and the page shouldn’t need scrolling sideways.

Test with real tools

Automated checkers such as WAVE find some problems quickly, but not all of them. Add a keyboard test, a zoom test and a few minutes with a screen reader: VoiceOver comes with every Mac and iPhone, and NVDA is free for Windows.

Is web accessibility the law?

For many organizations in the US, yes, in some form. Here is a short summary:

• Businesses open to the public are covered by Title III of the Americans with Disabilities Act (ADA). The Department of Justice’s guidance on web accessibility (March 2022) says the ADA applies to goods and services offered on the web. It doesn’t set a technical standard for businesses, and points to WCAG as helpful guidance.
• State and local governments are covered by Title II. The Department of Justice’s rule on web and mobile app accessibility, published in the Federal Register on April 24, 2024, makes WCAG 2.1 Level AA the standard. An interim final rule published on April 20, 2026 moved the compliance dates to April 26, 2027 for governments serving 50,000 people or more, and April 26, 2028 for smaller ones and special districts.

If your organization is covered, check the details with your lawyer. Building to WCAG 2.2 AA meets the 2.1 AA requirements too. Our page on government and nonprofit websites explains how we build for public bodies.

Build accessibility in from the start

Some people treat accessibility as an extra that adds cost and spoils the design. That is only true when a site is designed without it and then has to be fixed. Plan for it from the first wireframe, as our website redesign project plan suggests, and it costs little. Then keep checking it: our website maintenance checklist includes a quarterly accessibility spot check.

Have questions about accessibility and your website? Get in touch with Millennial Web Development. We’re happy to answer them and help make your website work for everyone.