Website Accessibility Basics: Make Your Site Usable for Everyone

Web accessibility means building websites that people with disabilities can use. That includes people who are blind or have low vision, who are deaf or hard of hearing, who have limited movement, or who have cognitive differences. It also helps people in everyday situations: someone using a phone in bright sunlight, a person with a broken arm using only a keyboard, or an older customer who finds small text hard to read.

For a business, accessibility is good ethics, good customer service and often good for search and conversions too.

Why it matters for your business

• More customers. A large number of people live with some form of disability, and many more benefit from clearer, easier sites.
• Better usability for everyone. Clear structure, readable text and keyboard-friendly navigation help all visitors.
• Search benefits. Many accessibility practices, such as descriptive headings and image alt text, overlap with good SEO.
• Reputation and risk. Customers notice when a business excludes people, and accessibility expectations are growing. Take legal advice if you operate in regulated sectors or sell to public bodies, as requirements vary.

The standard: WCAG

The Web Content Accessibility Guidelines (WCAG) are the international reference. They are organised around four principles, often shortened to POUR:

• Perceivable: people can perceive the content, for example through text alternatives, captions and enough contrast.
• Operable: people can navigate and use the interface, for example with a keyboard.
• Understandable: content and controls are clear and predictable.
• Robust: the site works with a range of browsers and assistive technologies.

Most organisations aim for WCAG level AA, which covers the most important requirements.

Practical fixes that matter most

1. Text alternatives for images

Add descriptive alt text to meaningful images so screen reader users know what they show. Decorative images should have empty alt text so they are skipped. Also write alt text for product images; it helps search engines and shoppers, as noted in how to write product pages that sell.

Avoid putting important text inside images, because it cannot be read by assistive technology or resized.

2. Colour contrast

Text must stand out from its background. Light grey text on white may look elegant but is hard to read, especially for people with low vision or on phones outdoors. As a guide, WCAG AA asks for a contrast ratio of at least 4.5:1 for normal text and 3:1 for large text. Free contrast checkers make this easy to test.

Do not rely on colour alone to convey meaning, such as marking errors only in red. Add text or icons as well.

3. Keyboard navigation

Some people cannot use a mouse. Check that you can reach and use every link, button, menu and form using only the Tab, Enter, Space and arrow keys.

• The order should be logical.
• A visible focus outline should show where you are. Never remove it without replacing it with something equally clear.
• Menus, popups and sliders must be operable without a mouse.
• No keyboard traps that you cannot escape from.

4. Clear heading structure

Use real headings in order: one main heading, then subheadings beneath it. Screen reader users navigate by headings, and a logical structure helps sighted users skim too. Do not choose a heading level just for its size; control the size with styling.

5. Accessible forms

• Give every field a visible label, linked to the input.
• Explain required fields and formats.
• Show clear, specific error messages next to the problem field, and say how to fix it.
• Do not rely on placeholder text as a label.

Accessible forms also convert better. See how to write website copy that converts.

6. Descriptive links and buttons

"Click here" and "Read more" mean nothing to someone navigating by a list of links. Use descriptive text such as "Read our website cost guide". Make buttons and links large enough to tap comfortably on a phone.

7. Video and audio

• Provide captions for videos, and a transcript where useful.
• Avoid autoplaying audio and fast-flashing content.
• Give users controls to pause, stop and adjust volume.

8. Readable text

• Use a font size of at least 16px for body text and allow the page to be zoomed without breaking.
• Keep line length comfortable and line spacing generous.
• Use plain language. Clear writing helps people with cognitive differences, those reading in a second language and everybody in a hurry.

9. Responsive and flexible layouts

The site should work on phones, tablets and large screens, and when users increase text size. Avoid content that disappears or overlaps when zoomed to 200 per cent.

10. Semantic, well-built code

Underneath, accessibility relies on using proper HTML elements: buttons for actions, links for navigation, lists for lists and tables for data. When developers build custom widgets, they need to add the right accessibility attributes and test them with assistive technology. Ask your developer how they approach this.

How to test

You do not need specialist tools to start.

1. Use only your keyboard to navigate your key pages.
2. Zoom the browser to 200 per cent and check nothing breaks.
3. Run an automated checker, such as the accessibility audit in browser developer tools or a free online scanner. These catch many issues, but not all.
4. Try a screen reader briefly on a key page to hear what it announces.
5. Ask real users with disabilities for feedback when possible.

Automated tools find only a portion of problems, so combine them with manual checks.

A word on accessibility overlays

Be cautious of "one-click" overlay widgets that promise instant compliance. They often fail to fix the underlying problems, and many accessibility specialists advise against relying on them. Fixing the site itself is the dependable approach.

Build it in from the start

Fixing accessibility after a site is built costs more than designing it in. When commissioning a website, include it in the brief and ask developers to confirm they work to WCAG AA. Our website checklist and guide to choosing a web developer can help you cover the points. If your current site fails many of these tests, it may be time to consider a redesign.

Where to start this week

• Add alt text to your main images.
• Check contrast on your buttons and body text.
• Tab through your home page and contact form.
• Make sure every form field has a label.
• Replace "click here" links with descriptive ones.

Small changes make your site better for everyone who visits it.