Website accessibility basics for a small business

For your trade 6 min read

The accessibility basics that are also just good sense, what you can fix yourself in an afternoon, and why the one click widgets are not the answer.

Somebody in their seventies is trying to read your prices on a phone held at arm's length. Somebody else is on a job site in July, in full sun, with a cracked screen. A third person cannot see the screen at all and is listening to your page being read aloud.

All three are customers, and a site which works for those three works better for everyone else too. That comes before compliance on this page.

What accessibility actually means here

The word sounds like a specialist subject with its own consultants, and there is a version of it that is. The version that matters to a five page website for a local trade is much smaller and mostly comes down to this: do not make people guess, and do not make them strain.

You are not being asked to rebuild anything. Most of what follows is text, color and labels.

Contrast, which is really about sunlight

Light gray text on a white background looks clean on a designer's monitor in a dim room. Outdoors on a phone it disappears.

The rule of thumb is dark text on a light background, or light text on a dark background, and nothing in between. Gray on white, white on pale blue, or a caption sitting on top of a photograph are the three that fail most often. If you have text laid over a picture, put a solid band behind it.

Take your phone outside at midday and read your own service page. If you find yourself cupping your hand over the screen, the contrast is wrong and it is wrong for everybody, not just for people with poor sight.

Text that is text, not text baked into a picture

Somewhere on many small business sites is an image of a price list, or a graphic with the opening hours drawn onto it, usually because it was made for a Facebook post first.

A screen reader cannot read those. Neither can search engines, and neither can somebody who wants to pinch and zoom in on one line. If it is words, it should be words on the page. Save the pictures for the work.

Describing your photographs in one line

Every image on a site can carry a short written description behind it, which is what a screen reader reads out and what shows if the picture fails to load.

It does not need to be a poem. "New water heater fitted in a Castle Rock utility room" is a good description. "IMG_4471" is what is there now on most sites, and "photo" is not much better. If a picture is purely decorative, it can be marked as such and skipped, which is also correct.

Two minutes per photo, once, and it improves how the page reads to search engines as a side effect.

Links and buttons that say where they go

Somebody using a screen reader can pull up a list of every link on the page and hear them in a row. On a lot of sites that list is nine copies of the words "click here" and "read more", which is no use to anyone.

Write links that describe the destination. "See our drain cleaning prices" tells you what happens. So does a button that says "Send my inquiry" rather than "Submit". This is one of those changes that is meant to be for accessibility and turns out to help everybody, because nobody likes clicking blind.

Forms with labels that stay put

A lot of modern forms put the label inside the box as faint gray text, and it vanishes the moment you start typing. Then you are three fields down, distracted by a delivery, and you cannot remember whether that box was the phone number or the ZIP code.

Labels should sit above the field and stay there. Error messages should say what to fix in words, not turn the border red and leave you hunting. And the whole form should be usable by pressing tab from one field to the next, which is how a lot of people fill in forms, including people with no impairment at all who simply type quickly.

What to check on your own site

Work through this on a phone and then on a computer. None of it needs software.

• Read every page outdoors in daylight and mark anything you have to strain at
• Find any text that is part of a picture and retype it onto the page
• Give every photograph a one line description of what it shows
• Replace every "click here" with words that name the destination
• Check the contact form labels are still visible after you start typing
• Press tab from the top of a page and see whether you can reach the phone number
• Turn your phone's text size up two notches and reload, and see if anything is now cut off or overlapping
• Play any video with the sound off and see whether it still makes sense

The widgets that promise to do this for you

There is a category of product that sells accessibility as one line of code. You paste it in, a little icon appears in the corner, and a menu offers bigger text and a high contrast mode.

Be careful with those. They add another script to load, they sit on top of the problem rather than fixing it, and many people who actually use screen readers report they get in the way of the software they already have. Some businesses have been sent legal complaints while one was installed on the site.

None of that is a reason to panic, only a reason to spend the afternoon on the list above instead, because that work is real and it stays fixed.

Where the law comes into it

Businesses do receive demand letters over inaccessible websites, and it is a real thing rather than a scare story. Nobody here is a lawyer and this is not legal advice, so if one of those letters lands, talk to somebody who is.

The sites that attract that kind of attention are usually the ones failing on the obvious items: no descriptions on images, unlabeled forms, contrast you cannot read. Doing the plain work is both the decent thing and the thing that makes you a poor target.

Questions people ask

Does accessibility apply to a small local business website?

The basics apply to any site with customers, and the basics are the part worth doing. A five page site for a trade is not a complicated case.

Can I fix most of this myself?

Yes. Descriptions on photos, link wording, retyping text out of images and turning contrast up are all editing, not development. You do not need to pay anyone for that part.

What is alt text in plain English?

A short written description attached to a picture. Screen readers read it out, and it appears if the image does not load.

Do accessibility overlays and toolbars work?

They do not fix the underlying page, and people who rely on assistive software often find them unhelpful. Treat them as no substitute for fixing the page.

Will any of this help my search ranking?

Descriptions on images, real text instead of pictures of text and clear link wording all help search engines understand your pages. That is a side effect, not the reason.

How do I know if my colors are readable enough?

Free contrast checkers exist and are worth a look. The faster test is reading your own site outdoors on a phone, because that is the condition your customers are actually in.