Breaking

Site add
blog single post
Accessibility

How to Make Your Website Usable for Visually Impaired Visitors

If you run a small business or a local trade, your website is often the first place a customer meets you. Someone searching for a plumber, a decorator, or a mobile hairdresser will land on your site and decide within seconds whether to get in touch. For the roughly two million people in the UK living with sight loss, that decision depends on something you may never have thought about: how well your pages work with a screen reader.

Screen readers read a page aloud and let people jump between headings, links, and images. On a site built carelessly, that becomes a maze. On a site built thoughtfully, it is quick and pleasant. The fixes are usually small, and they help every visitor, not just those with a visual impairment.

Accessibility Is a Business Decision, Not a Favour

It is tempting to treat accessible design as a box-ticking exercise. In practice, it is closer to making sure your shop door opens for everyone who walks up to it. Sight loss is far more common among older people, and older people are exactly the customers who call a local tradesperson rather than ordering online from a national brand.

There is a useful side effect too. The things that make a site work for a screen reader, such as clear headings, sensible link text, and tidy image descriptions, are the same things search engines use to understand your pages. Clear structure helps you rank for something like "boiler repair in Norwich" as much as it helps someone using a screen reader find your phone number.

Use Headings That Describe What Comes Next

Screen reader users often pull up a list of every heading on a page and jump straight to the section they want. That only works if your headings are real headings and they say something useful.

  • Use the actual heading styles in your website builder rather than making text bold and larger by hand. Bold text is invisible to a screen reader's heading list.
  • Keep the order sensible. One main page heading, then section headings beneath it, then subheadings if you need them. Do not jump from a top-level heading straight down to a small subheading.
  • Write headings that stand alone. "Our Services", "Areas We Cover", and "Request a Quote" are helpful. "Welcome" and "More" are not.
  • Do not use headings purely for decoration. If a line of text is not introducing a section, it should not be a heading.

Write Link Text That Makes Sense on Its Own

Many screen reader users browse by pulling up a list of every link on a page, stripped of the surrounding sentences. If every link says "click here" or "read more", that list is useless.

Write link text that describes the destination:

  • Instead of "Click here to see our work", try "See our bathroom fitting gallery".
  • Instead of "Read more", try "Read more about emergency call-out charges".
  • Instead of a bare "Contact us", try "Contact us for a free quote".

Buttons deserve the same care. A button labelled "Submit" tells someone nothing, while "Send my enquiry" tells them exactly what will happen. If a link opens a PDF or a new tab, say so in the link text.

Give Every Important Image a Text Alternative

When a screen reader reaches an image, it reads out the alternative text, usually called alt text. If there is none, some readers announce the file name instead, which is how visitors end up hearing "IMG_2034.jpg".

Describe the purpose of the image, not every detail in it. A photo of a finished loft conversion might be described as "Completed loft conversion in Sheffield with Velux windows and fitted wardrobes". That tells the visitor something useful. "Loft" does not.

  • Keep alt text short, usually under about 125 characters.
  • Do not begin with "image of" or "picture of". Screen readers already announce that it is an image.
  • For decorative images, such as background patterns or divider lines, leave the alt text empty so they are skipped entirely.
  • Never put important information only inside a picture. Phone numbers, opening hours, and prices should be real text, not baked into a graphic.

Check Colour Contrast and Text Size

Low contrast is one of the most common problems on small business websites, usually caused by pale grey text on white backgrounds or thin fonts in brand colours.

  • Aim for a contrast ratio of at least 4.5 to 1 for normal body text. Free contrast checkers are widely available online.
  • Never use colour alone to carry meaning. If a form field is required, write "required" in the label rather than simply turning it red.
  • Set body text at 16 pixels or larger. Plenty of your visitors are reading on a phone in poor light.
  • Make sure someone can zoom in to 200 per cent without text overlapping or buttons drifting off the screen.

Test It Yourself in Ten Minutes

You do not need specialist software. On most computers and phones, a screen reader is built in and free to switch on.

  • Try to reach your contact form using only the Tab key. Can you always tell where you are on the page?
  • Turn on the built-in screen reader and listen to your home page. Does the heading list make sense? Do the links?
  • Check that every interactive element shows a visible outline when focused. Many website builders remove this by default.
  • Ask a customer or a friend who uses assistive technology to try booking your services. Their feedback is worth more than any checklist.

None of this requires a full redesign. A few hours spent on headings, link text, alt text, and contrast will make your site easier to use for everyone who finds you, and that is exactly what a good local reputation is built on.

Comments