Website accessibility for professionals: a practical checklist you can do in an afternoon
· 6 min read
An accessible website can be used by people who are blind or have low vision, are deaf or hard of hearing, have limited movement, or find dense text hard to follow, and by anyone using a small screen in bright sun. Most of what makes a page accessible also makes it easier for everybody and for search engines and AI assistants to read. This guide explains the standard in plain words, gives a checklist you can complete in an afternoon, and shows how to test with tools you already have. It is general information, not legal advice.
The short answer
- The widely used standard is WCAG, the Web Content Accessibility Guidelines. Version 2.2 became a W3C Recommendation on 5 October 2023. Level AA is the usual target.
- The basics: readable text and colour contrast, descriptions for images, labelled form fields, links that make sense out of context, and everything usable by touch and keyboard.
- WCAG 2.2 added a minimum size for tap targets: at least 24 by 24 CSS pixels, with exceptions such as links inside sentences.
- Test with your own phone: enlarge the text, turn on the screen reader once, and use the page one-handed in bright light.
- No tool can promise full conformance. Fix what you can, and give a way for people to ask for information in another form.
Why it matters for a professional
- Your clients include people with disabilities, older people and people in difficult circumstances. Being easy to use is part of being trustworthy.
- Many accessibility fixes are good for everyone: larger text, clear contrast and simple forms help on a phone in sunlight.
- Search engines and AI assistants read pages in a way similar to assistive technology: they rely on headings, text and descriptions rather than appearance.
- In some countries and for some organisations, accessibility is a legal requirement. It is not always required of a sole practitioner, but rules vary and are changing. Check with your regulator or a lawyer. See also the European Accessibility Act and local equality laws.
- Complaints and claims arise from sites that exclude people. A basic effort and a contact route are sensible protection.
The standard in one paragraph
WCAG is organised around four ideas: content must be perceivable (people can see or hear it), operable (people can use it with a mouse, touch, keyboard or voice), understandable (it is clear and predictable) and robust (it works with assistive technology). Each idea has numbered success criteria at three levels, A, AA and AAA. Level AA is the level most laws and policies refer to. WCAG 2.2, published as a W3C Recommendation on 5 October 2023, added nine new success criteria to 2.1, including a minimum size for touch and click targets.
The checklist
| Area | What to do | How to check |
|---|---|---|
| Text | Use a readable size (at least 16 px for body text) and plain language. Do not set text in a thin or decorative font. | Look at it on your phone in daylight |
| Contrast | Normal text needs a contrast ratio of at least 4.5 to 1 against its background at Level AA. Large text needs 3 to 1. Avoid pale grey on white. | Use a free contrast checker with the two colours |
| Images | Give every meaningful image a short text description (alt text) that says what it shows or what it is for. Decorative images need none. | Read the descriptions aloud. Do they make sense without the picture? |
| Headings | Use one main heading and headings below it in order, so that the page has a structure. | Skim only the headings. Can you follow the page? |
| Links and buttons | Say where they go: “Book a call”, not “Click here”. Make them look clickable. | Read them out of context |
| Touch targets | Buttons and links must be big enough to tap, and not too close together. WCAG 2.2 sets a minimum of 24 by 24 CSS pixels, with exceptions such as links inside text. | Tap them with your thumb, one-handed |
| Forms | Give every field a visible label, say which are required, and give clear error messages that say how to fix them. | Fill in the form wrongly on purpose |
| Colour | Do not use colour alone to carry meaning, such as red for errors with no text. | View the page in greyscale |
| Motion and sound | Avoid autoplaying video or sound and flashing content. Let people pause anything that moves. | Open the page and see if anything starts on its own |
| Video and audio | Add captions to video with speech, and a transcript if you can. | Play it with the sound off |
| Language | Mark the language of the page. Write in short sentences and explain jargon. | Ask someone outside your field to read it |
| Keyboard | Everything must be reachable and usable without a mouse, with a visible focus outline. | Press Tab repeatedly and watch where the focus goes |
Writing good image descriptions
- Say what matters: “Anna Weiss, physiotherapist, smiling in her Bristol clinic”, not “photo1.jpg” or “image of a woman”.
- Keep it short, usually under about 125 characters.
- For a logo that links home, say what it does: “Weiss Physiotherapy, home”.
- If the image holds text, put the same text in the description or on the page.
- Leave decorative pictures with an empty description, so screen readers skip them.
Test it on your phone, in ten minutes
- Increase your phone’s text size to the largest setting. Does the page still work without overlapping text?
- Turn the phone on its side. Does it still make sense?
- Switch on the phone’s screen reader (VoiceOver on iPhone, TalkBack on Android) and move through the page by swiping. Listen for headings, links and image descriptions that do not make sense. You do not have to become an expert: a few minutes shows the biggest problems.
- Use the page outdoors or at a low screen brightness. Is the text still readable?
- Try tapping every button with one thumb.
- Fill in your own contact form with only the on-screen keyboard.
- Run a free automated checker, such as the one built into your browser’s developer tools. It finds only some problems, and passing it does not mean the page is accessible.
Give people a way to ask
Add a line saying that you will provide information in another format if needed, with a phone number or email. Reply promptly. It is courteous, and a good-faith route helps if something does not work for someone.
I want this page to be usable by everyone. If anything is hard to read or use, or you would like this information in another format, please call 020 7946 0000 or email anna@example.com and I will help.Common mistakes
- Pale grey text on a white background.
- Tiny buttons and links crowded together.
- Putting your phone number or hours in an image only.
- Missing or meaningless image descriptions.
- Forms with placeholder text instead of labels.
- Autoplaying video with sound.
- Believing an automated score proves accessibility.
- Never testing it on a real phone.
Where BeVisible fits
BeVisible pages are designed to be read on a phone first, with your details shown as text rather than as images. We cannot promise any particular level of conformance, because the content you add decides much of it: your photographs, descriptions, colours and wording. Use the checklist above on your own page before you publish. You can build and preview free, and publish free for 7 days with no card needed; after that one yearly plan keeps a website online, and one plan covers one website. Start from a photo or type your details.
Frequently asked questions
What is WCAG?
The Web Content Accessibility Guidelines, the international standard for accessible websites, published by the W3C. Version 2.2 became a W3C Recommendation on 5 October 2023, and Level AA is the level most laws and policies refer to.
What is the minimum size for buttons on a phone?
WCAG 2.2 sets a minimum target size of 24 by 24 CSS pixels at Level AA, with exceptions such as links inside sentences and cases where spacing makes up the difference. Larger is better for thumbs.
What contrast should text have?
At Level AA, normal text needs a contrast ratio of at least 4.5 to 1 against its background, and large text at least 3 to 1.
Does a sole practitioner have to make their website accessible?
It depends on where you work, your profession and the rules that apply to you. Some laws apply only to larger organisations or particular sectors. It is good practice and sensible protection in any case. Check with your regulator or a lawyer.
Can an automated tool make my site accessible?
No. Automated checkers find only some problems. Combine them with a manual check on a phone, including text size, screen reader and keyboard.
How do I write alt text?
Describe what the image shows or what it is for, in a short phrase. Leave decorative images with an empty description.