Website Accessibility Basics: A Practical Guide for Small Business Sites

Accessibility means building a website so people with disabilities can actually use it: someone navigating with a keyboard because they cannot use a mouse, someone using a screen reader because they cannot see the screen, someone with low vision who needs strong contrast, someone with a tremor who needs a large, forgiving click target. It is not a niche concern. The World Health Organization estimates that around 16% of the world's population lives with some form of disability, and every one of those people is a potential customer who either can or cannot get through your contact form.

It also, quietly, helps everyone. Clear contrast helps a visitor reading your site on a phone in bright sunlight. Keyboard-friendly navigation helps a power user who never touches the mouse. Real headings and structure are exactly what search engines and AI answer tools also rely on to understand a page. Accessibility and good, ordinary web design overlap far more than most people expect.

Where to actually start

• Colour contrast: body text needs a contrast ratio of at least 4.5:1 against its background (3:1 for large text). A free contrast checker tool will tell you instantly whether a colour pairing passes.
• Alt text: every meaningful image needs a short, accurate text description for people using a screen reader. Purely decorative images (a background pattern, a spacer) should have empty alt text so a screen reader skips over them instead of reading out something useless.
• Keyboard access: every link, button, menu and form control has to work without a mouse — tab to it, and press Enter or Space to activate it. Try navigating your own site using only the Tab key; it is the fastest way to find real problems.
• Visible focus: when you tab to something, there should be a clear visual outline showing where you are. Sites that remove this outline for looks make keyboard navigation nearly unusable.
• Headings in order: one H1 per page, then H2s and H3s that nest logically, not skipped or picked for font size. Screen reader users often jump between headings to scan a page the way a sighted visitor skims with their eyes.

A one-page way to check where you stand

You do not need to buy anything to get a first read on your own site. The WAVE tool is a free browser extension that overlays your page with the accessibility issues it finds — missing alt text, poor contrast, empty links — in plain language. It will not catch everything a manual review would, but it surfaces the most common and most damaging problems in under a minute, which is enough to know whether you have a real problem or a minor one.

Forms and errors

Forms are where accessibility problems cost you the most, because a form someone cannot complete is a lead you never get. Every field needs a real, associated label — not just placeholder text, which disappears the moment someone starts typing and is easy to miss for a screen reader. When a field has an error, say what is wrong in words next to the field ('Enter a valid email address'), not just by turning the border red. Colour alone excludes anyone who cannot distinguish it.

Images, video and audio

• Add captions to video and a transcript for audio content — useful for anyone who is deaf or hard of hearing, and for anyone watching with the sound off, which on mobile is most people.
• Never autoplay video or audio with sound on. It is disorienting for screen reader users, who suddenly have two audio streams competing, and it annoys everyone else too.
• Give data tables real header cells, not just bold text, so a screen reader can announce which row and column a value belongs to.

What we did on our own site

We recently ran this exact process on cloud9dg.com itself: an automated scan of every page type, then manual keyboard testing to catch what automated tools miss (they found none of our real issues; the one gap — no visible way to skip past the navigation menu when tabbing through the page — only turned up by actually using a keyboard, and we fixed it the same day). We also added an on-site accessibility panel that lets a visitor increase text size, raise contrast, reduce motion and underline links themselves, on top of the structural fixes. Neither piece replaces the other: good structure benefits everyone by default; the panel lets an individual visitor adjust further to their own needs.

Standards, and a caution about legal claims

The Web Content Accessibility Guidelines (WCAG), currently at version 2.2, are the standard almost every serious accessibility effort and most legal requirements point back to, at either level A, AA (the common target) or AAA. What counts as compliant, and what your legal obligations actually are, varies by country, province or state, and industry — this article is general practical guidance, not legal advice. If accessibility compliance is a genuine legal concern for your business, get advice from a lawyer or a specialist who works in your jurisdiction.

Building it in, not bolting it on

Retrofitting accessibility into a finished site is always slower and more expensive than designing with it in mind from the start — correct heading structure, real contrast ratios chosen at the design stage, forms built with labels from day one. Cloud9 builds every new site this way rather than treating accessibility as a separate pass at the end. If you already have a site and want to know where it stands, see our UI/UX & web design and web development services, or the website redesign checklist if a broader rebuild is on the table.