Pink text on a white background, ornate fonts, and a flickering video in the background. What looks to some like the first step toward a website—based on their passionately curated Pinterest board—becomes an obstacle for others. Design decisions can make your website unusable for people or even pose a risk to their health.
Accessibility is still an issue today that hasn’t made its way to every corner of the internet—even though it’s so important for your business. And yet, it shouldn’t matter at all.
Why Web Accessibility Is Important
In 2024, there were 7.9 million people in Germany with a severe disability¹. That’s almost one in ten people. Some of them have difficulties processing information, seeing, hearing or moving.
The people around you use your website in very different ways. While your niece scrolls on her smartphone, your father zooms in so far on his tablet that you could recognize every pixel individually. A friend navigates your website using just the keyboard and your neighbor has a screen reader read out your pictures. And then there’s someone a few streets away who uses voice recognition software to contact you.
At least, that would be the ideal scenario. Your website, which can be navigated and understood by a variety of people—in whatever way works best for them. But is that really the case?
How Accessibility Boosts Your Revenue
Have you ever tried navigating your website without a mouse, using only the keyboard? And what happens if someone can’t see colors? Would your beautiful graphics still be recognizable?
How many more people would find you appealing and book with you if they were just given the chance? A website that isn’t accessible could be costing you revenue.
And not just directly. Search engines such as Google and Ecosia also love accessibility elements such as clear text hierarchies and image descriptions. Barriers can also make your website less visible.
And then there’s the whole issue of values. These days, people prefer to buy from brands that share their own ideals and values². Whether a website is accessible or not says at least something about the priorities of the brand behind it. And wouldn’t it be great if your online home could also be a safe space for your target audience—and they’d love to shop with you?
Why this shouldn’t matter at all
Quite apart from the potentially higher revenue. Wouldn’t it just be fair to give everyone access to the internet and the information it contains? If we do this only because it might increase our revenue, we’re reducing people to their purchasing power instead of seeing them as fellow human beings with equal rights.
As a web designer, I certainly feel it’s my responsibility to make the internet accessible to as many people as possible and to make it a little bit more equitable for everyone.
That doesn’t mean my websites are perfect. It can be difficult to make a website truly barrier-free. But we can all do our best to at least make them as accessible as possible and give as many people as possible the chance to participate.
3 Really Simple Ideas to Get Started
To help you get started right away, I’d like to share three ideas that will make your brand and website a little more accessible.
1. Colors that don’t just look good
Sufficient color contrast between your brand colors ensures that even people who can only see a few colors or none at all can read your text.
In a color contrast checker of your choice, e.g. the Contrast Grid from Eight Shapes, you enter the HEX codes of your brand colors. The colors that have sufficient contrast to each other are marked with AA or, even better, AAA grades. All other color combinations should not be used together.
2. Legible Fonts
Even though a fancy or totally wacky font in your headline might look cool—use it sparingly, because it can be hard to read. You should especially use a font that’s easy to read for your headings and paragraphs. You can then use your fancy cursive for accents, like your signature.
3. Images That Speak
Not everyone can see your images. To ensure they still know what you’re trying to convey, the alt text is read aloud to them—provided someone has created it beforehand. To do this, go to your image’s settings and describe what’s in the image in a short bullet point.
Search engines also read these descriptions to determine when to display your image in image search results.
3 Things You Haven’t Thought of Yet
Of course, these are just the first three items on a long list of ways to make a website more accessible. If you’re someone who navigates the internet without difficulty, there are surely some barriers you haven’t even thought about yet. Here are three more things to consider.
1. Where to click?
Imagine you want to find a service provider’s contact form. No problem, right? But what if you can’t see the website? Suddenly, you’re faced with a sea of “Click here” buttons, one of which leads to the contact form. But which one is it?
To prevent this problem from occurring on your website, you should label the buttons clearly. For example, “Send me a message” or “Go to the contact form.” This makes navigation much easier.
2. The Right Hierarchy
Websites are like books. There’s a title, followed by several chapters, and sometimes even subchapters. However, if all these sections look the same, it becomes difficult to tell when something is a title, a chapter, or a subheading.
You can imagine something similar on your website. The texts in the code must be set correctly so that screen readers can read out the website correctly or jump from chapter to chapter.
Each subpage of your website begins with a title, which is set as heading 1. This is followed by subheading 2, 3, 4 and so on. This way, search engines also know what the title is and what your page is about.
So don’t choose the type of heading based on how it looks; instead, follow a clear hierarchy. Of course, a Level 1 heading can be followed by several Level 2 headings with subheadings—just as a book has several chapters.
3. Make it bigger
Maybe you’ve seen this happen in your family: Grandma wants to see your picture on the website, so she zooms in first. But maybe she also wants to read the text around it? On too many websites, that text has disappeared because the website’s layout doesn’t adapt to the zoom level and screen size.
Give it a try. What happens when you zoom in to 200% on your website? Is everything still there and legible? Whether this works often depends on your website platform.
How to get started
Before you start to panic, why not just test your website? Try viewing it without a mouse, zoomed in really far, or in black and white using the Chrome Developer Tools (right-click on your website → Inspect → Rendering → Emulate vision deficiencies).
Then tackle the things that are easy to change, like colors, buttons, and image descriptions. And just like that, your website is a little more accessible. For the next steps, it’s worth reading up on the topic or seeking professional help.
Let’s make the internet a better and more equitable place for everyone!
Sources
¹ Federal Statistical Office (2024)
² Narayanan S, Das JR (2022)
About the author
Maike ist Website-Strategin und Squarespace-Designerin bei Maia Studio und unterstützt Selbstständige, Online-Businesses, Sozialunternehmen und gemeinnützige Organisationen dabei, mit menschlichen Websites sichtbar zu werden und ohne Druck und Manipulation ihre Ziele zu erreichen. Ihr Fokus liegt dabei auf: ✿ menschlichem Marketing und inklusivem Design ✿ digitaler Barrierefreiheit ✿ Verkaufsführung ohne unangenehme Tricks ✿ Selbstwirksamkeit und volle Kontrolle über die eigene Website ✿ Websites mit Verkaufstools für Dienstleistungen und digitale Produkte Auf www.maiastudio.de kannst du mehr über Maike, Maia Studio und ihr Webdesign-Angebot erfahren.
