If accessible web design feels like a big, overwhelming subject, this is where you can get the biggest wins with the least effort.
Accessible web design isn’t about binning your old website and starting from scratch. It’s about making simple but practical improvements that help people read, navigate, and understand your content and website more easily.
These are the five changes that consistently make the biggest impact on the people who use your website, and they’re all things you can improve on most websites without touching a single line of code.
Why does accessibility matter?
Ultimately, being excluded doesn’t make you feel good. We humans are social beings and we want to belong. If you land on a website that you can’t use for any reason you feel like this isn’t for people like me.
For me an example of this is TikTok. I have tried to use it a few times and each time I’ve stopped it’s because it’s sensory overload to me. There’s always something moving on screen – you just can’t get away from it.
From a business perspective it makes financial sense. There are 16.1 million people in the UK who have a disability and between them they spend around £274 billion each year. If that doesn’t make you sit up and take notice of accessibility, I don’t know what will.
1. Use clear headings
Headings are one of the basics of accessible web design.
They aren’t just visual styling, they provide structure in a similar way to the title and chapters of a book.
Screen reader users often move through a page by tabbing between headings. If your headings are missing or used out of order, the page becomes very confusing.
Accessible web design means:
- One clear H1 that describes the page’s purpose
Think of this like a book’s title. A book only has one title. - H2s that break content into meaningful sections
Think of these as chapter titles. They break down what would be almost a wall of text into smaller, more manageable chunks. - Headings that give context to the content that follows it.
What causes problems:
- Using bold text instead of heading levels
Screen readers use a website’s code to find out whether or not text is a heading or not. So making text bold only, doesn’t indicate to them that the text is a heading. - Skipping heading levels because it “looks better”
This confuses screen readers and may lead to them navigating a page in a different way to what you want. - Writing headings like “More information” that don’t say anything
If someone is tabbing between headings to navigate the page, they won’t know whether the information that follows a vague heading is what they want to know.
On most websites, this usually means explicitly setting the heading level rather than styling text manually.
Quick win:
Read your headings in order without the body text. If they don’t tell a clear story, change them.
2. Write meaningful link text
Accessible web design means making links clear and predictable.
Many screen reader users navigate by pulling up a list of links on a page. If that list says “click here” several times, you have no idea where any of them will lead.
Good link text:
- Explains the destination
- Describes the action
- Makes sense on its own
Instead of:
- Click here
- Read more
Try:
- Read my guide to making more sales.
- View my coaching packages
This improves accessibility and also makes your content easier to skim for everyone.
For bonus points describe what will happen when the link is clicked too such as Read my guide to making more sales (opens a new tab).
Quick win:
Look at all of the links on your page listed together. Would you know where each one goes and what will happen when you click it?
3. Use meaningful alt text as part of accessible web design
Alt text, when used properly, is an important part of accessible web design.
Alt text is a short description of an image for someone who can’t see it. It is not for keywords, and it is not the same as a caption. It doesn’t always need to be used.
Pictures that are for decoration only don’t need alt text, but an image that shows important information such as graphs and charts does need it.
Good alt text explains:
- What the image shows
- Why it matters in context
Examples:
“Kim presenting a slide about accessible web design at a workshop”
“Screenshot of WordPress heading settings panel”
What causes problems:
- Leaving alt text blank on informational images
Without a description, someone who can see the image won’t know what’s in it. - Copying and pasting surrounding text
Anyone using a screen reader will hear the same words repeated. - Filling alt text with keywords instead of descriptions
People using a screen reader will just hear your keywords read aloud rather than the information from the image.
On most website platforms, alt text is added in the media library.
Quick win:
What would someone miss if the image didn’t load? That’s what your alt text should describe.
4. Use correct colour contrast
Colour contrast is the visual difference between light and dark colours.
If there is a high contrast between the background and text colours the text will be easy to read, such as black text on a yellow background. If not then it will be difficult to read.
For example:
- Black text on a pale yellow background has high contrast and is easy to read.
- White text on a yellow background has low contrast and is difficult to read.
- Light grey text on white, which is very common in modern web design, often fails accessibility standards.
It’s not about making everything bold. It is about making sure there’s enough difference between foreground and background colours for text to be readable in different situations.
Why colour contrast matters:
- People with visual impairments rely on strong contrast to read letters clearly.
- People with colour blindness may not perceive certain colour combinations properly.
- People using phones or tablets outside in bright light benefit from stronger contrast.
- Everyone finds high contrast easier to read when they have tired eyes.
In other words, colour contrast improves usability for pretty much everyone.
Common colour contrast mistakes
These show up a lot on service-based websites:
- Light grey body text because it looks nicer
- Text placed over busy background images
- Buttons with white text on pastel pink backgrounds
- Using colour only to show meaning, like “required fields are in red” – if this is the only way info is communicated some people will miss it.
Check your colour contrast using the WebAim Colour Contrast Checker.
Quick win:
Zoom your website to 200 percent. If it becomes difficult to read or navigate, adjustments are needed.
5. Check keyboard navigation
Accessible web design means your website works without a mouse because some people navigate only use a keyboard, using the Tab key to move between interactive elements.
Your site should:
- Move through links and buttons in a logical order
- Clearly show which element is selected (not just with colours)
- Have menus and forms work without a mouse
Common issues come from:
- Sliders or pop-ups that can’t be hidden without using a mouse
- Custom menus that skip items, meaning some options can’t be used by some users
- Removing visible focus indicators for ‘aesthetic’ reasons
Quick win:
Try using your website using only Tab, Enter, and arrow keys. Notice where you get stuck.
A final note on accessible web design priorities
You don’t have to do everything at once. And not doing it all at once doesn’t mean you’re a bad person, it doesn’t mean you don’t care.
Now you have the information to take meaningful action.
If you improve:
- Headings
- Links
- Colour contrast
You’re already practising accessible web design in a meaningful way.
It’s not about making big changes or gestures. It’s about doing lots of the smaller things well, which will make a big difference to the people using your website.
The Author
Kim Scotland is a web designer for service-based business owners who want more than a good-looking homepage. Through her bespoke design packages and ongoing care plans she turns underperforming sites into strategic tools that book clients, automate admin, and create smoother experiences for all users.
With over 10 years in tech as a software engineer and web designer, she builds clean, high-converting sites that do the heavy lifting so you can focus on running your business, not wrangling your website.
Kim is passionate about building websites with a strong focus on accessibility and creating inclusive digital experiences especially for marginalised people who experience systemic inequality online.
