As an entrepreneur or SME owner, you're hearing more and more about web accessibility these days. It's often presented as a complex, technical issue that requires a whole team of developers. While a well-built platform with custom work and clean code forms the technical foundation, the most common barriers actually arise simply during content entry.

I've been building websites and web applications for businesses in Belgium and the Netherlands since 2006. In practice, I see that many accessibility problems aren't in the source code, but in the way the site is filled in and maintained day to day. Many entrepreneurs ask me what they can do themselves to immediately make their website more usable for a broader audience.

In this article, I answer the most frequently asked questions about accessibility mistakes you can fix directly in your content management system, word processor, or page editor. With a few targeted adjustments, you lower the barrier for your visitors and improve the overall user experience at the same time.

Is accessibility only important for visitors with a disability?

This is one of the most frequently asked questions when accessibility comes up. The short answer is no. Accessibility focuses on people with a visual, auditory, motor, or cognitive impairment, but the solutions literally help every user on your website.

Think of a customer viewing your website on a smartphone in bright sunlight. When the contrast between the text and the background is too low, that person can't read the page. That's exactly the same problem someone with poor eyesight experiences. Or think of someone who temporarily has a broken arm and can only use a keyboard or voice control to navigate through a form.

On top of that, accessibility has a direct influence on how search engines read your website. Search engines use techniques similar to screen readers to analyze the structure, text, and images on a page. A website that's well set up for accessibility is easier for a search engine to understand. So you're not just building accessibility for a specific audience, but for everyone who uses your platform.

How do I fix contrast and readability problems?

A common mistake on modern websites is using light gray text on a white background, or white text on a light-colored button. This looks sleek in some designs, but it makes the text unreadable for a large group of people.

You can easily spot and fix this problem yourself. There are free online tools where you enter the color code of your text and the color code of the background. The tool then calculates the contrast ratio. According to the standards, the contrast for normal text must be at least 4.5 to 1. For large text, a minimum ratio of 3 to 1 applies.

If you notice that a piece of text is hard to read, adjust the color in your editor:

  • Make light gray body text darker gray or black.
  • For buttons, make sure there's a clear difference between the background color and the text color.
  • Avoid placing text directly over a busy background image. Place a solid-colored layer behind the text instead, or choose a plain background.

Also check the text size. For body text on a screen, use a minimum size of 16 pixels where possible. Also make sure lines aren't spaced too tightly, so visitors can easily follow the lines with their eyes.

What mistakes do I make with images and alt text?

Images enrich a page, but a screen reader can't see an image. That's why a screen reader uses the so-called alt text (alternative text) to explain what's in the image. Two mistakes are very common here: forgetting the alt text entirely, or filling it in incorrectly.

When you upload an image and don't enter alt text, a screen reader will often read out the file name instead. A visitor then hears something like photo1234-final.jpg. That provides no useful information whatsoever. On the other hand, the alt text also shouldn't be stuffed with SEO keywords.

Follow these rules when filling in alt text:

  • Functional images: Describe briefly and factually what's shown. For a photo of an employee, for example, use the person's name and job title.
  • Decorative images: Does an image serve purely as decoration and add no content? Then leave the alt text field empty, or check the box in your CMS indicating it's a decorative image. The screen reader will then neatly skip over the image.
  • Images containing text: Avoid putting important text inside an image. If there's no way around it, type out the full text from the image verbatim into the alt text.

Why is an incorrect heading structure a problem?

A common misconception is that headings (such as H1, H2, and H3) are only meant to make text bigger or bolder. In practice, business owners often use an H3 heading above a paragraph simply because they like how the H3 size looks.

Visually, that might seem fine, but for the structure of the page it's confusing. Visitors using a screen reader often navigate from heading to heading to quickly get an overview of the page. If the structure jumps from H1 to H3 without an H2 in between, that logic breaks down.

When structuring your page, stick to a clear hierarchy:

  • H1: The main title of the page. Use only one per page.
  • H2: Subheadings that mark the main sections of your content.
  • H3: Sub-subheadings that fall under a specific H2 section.

Want a specific subheading to look smaller or bigger? Then adjust the visual style of the element in your CMS, or ask your developer to adjust the styling of the headings in the CSS. Never use the heading type just to affect the size.

Links form the navigation of your website. Many websites are full of link text like "click here," "read more," or "download." If someone has a screen reader read out a list of all the links on the page, they'll hear "read more" ten times in a row. That provides no context whatsoever.

You can easily fix this yourself by making the link text descriptive. Turn "Click here to view the brochure" into "View the brochure about our services" instead. The reader then immediately knows where the link leads, even if the text is read in isolation from the rest of the page.

Clickability on mobile devices also matters. Buttons and links that are placed too close together or set too small cause visitors to accidentally tap the wrong element. Make sure buttons have enough white space around them and that the clickable area is large enough to operate with a thumb.

Finally, keyboard navigation matters. Many people use the Tab key to navigate through a page. When someone uses the Tab key, it must be clearly visible which element is currently selected. This is called the focus state. When adjusting your website's styling, make sure this outline or marker around buttons and links isn't disabled.

Getting started with an accessible platform

Accessibility isn't a one-off project, but an ongoing process in managing your website. By taking a critical look at your color contrast, alt text, heading structure, and link text, you can already remove a large part of the obstacles without any technical knowledge.

When you have a new website built, it's wise to choose a clean foundation from the start. I personally build custom websites and platforms using technologies such as React, TypeScript, Tailwind CSS, and Supabase. By choosing custom work instead of heavy off-the-shelf themes, the technical foundation for speed, security, and accessibility is right from day one.

Want to brainstorm about the technical structure of your website, or find out how to make your platform perform better? Schedule a free thirty-minute conversation via ferhat.io/contact. Then we'll look at the possibilities for your business together.