Skip to content
Tanner
Preserve
All guides
Your website

Website accessibility: the basics that protect and pay

7 min readUpdated July 1, 2026
01

The two reasons this is worth 30 minutes

About 1 in 4 American adults lives with a disability, according to the CDC. That includes people with low vision who bump their text size up, people with hand tremors who can't hit tiny buttons, and a lot of older homeowners, the people whose houses need new furnaces, roofs, and water heaters. When your site doesn't work for them, they call the next company on the list.

Then there's the protection side. Courts in most of the country treat business websites as covered by the ADA, and thousands of accessibility lawsuits and demand letters go out every year, with small businesses as regular targets. Even a fast settlement costs real money. No checklist makes you lawsuit-proof, but the failures below are exactly what those complaints cite.

The same fixes also pay you back. Alt text, clear headings, and descriptive links are how Google reads your site too, so most of this doubles as SEO work.

02

Get your score at pagespeed.web.dev

Go to pagespeed.web.dev, paste your homepage address, and click Analyze. Free, no account. Scroll past the performance numbers to the Accessibility score, a 0 to 100 number from Google's Lighthouse checks. Click it and expand each flagged item; every one names the exact element on your page that failed.

For a second opinion that's easier to read, use WAVE at wave.webaim.org. Paste your address and it draws icons right on top of your page: red icons are errors, and clicking one explains the problem in plain language.

Run both on your homepage, your contact page, and your main service page. Those are the pages that book jobs.

Field note

Automated checkers only catch a portion of real accessibility problems, so a 100 score is not the same as ADA compliance. But it does clear the failures that show up in complaints most often.

03

Write alt text for your job photos

Alt text is the written description attached to an image. Screen readers speak it out loud, and Google uses it to understand your photos. A gallery of great job photos with no alt text is invisible to both.

Where the field lives: in WordPress go to Media > Library, click a photo, and fill in the Alternative Text box. In Wix, click the image, open Settings, and use the field labeled 'What's in the image? Tell Google.' In Squarespace, click the image, hit the pencil icon, and fill in the alt text field.

Write it like you're describing the photo to someone on the phone: 'Two techs installing a furnace in a Pewaukee basement' beats 'IMG_2047'. Keep it under about 125 characters, and don't stuff keywords into it. Purely decorative images (background textures, divider graphics) can have empty alt text so screen readers skip them.

04

Fix low-contrast text, the most common failure

WebAIM scans the top million homepages every year, and low-contrast text is the failure it finds most, on roughly 8 in 10 sites. It's usually light gray body text on a white background, or white headlines laid over a busy photo.

The standard (WCAG AA) is a contrast ratio of at least 4.5 to 1 for normal text and 3 to 1 for large text. You don't have to do math. Go to webaim.org/resources/contrastchecker, enter your text and background colors, and it gives you a pass or fail plus a slider to darken the color until it passes. Grab your exact colors from your builder's color picker, where the six-character hex code (like #767676) is shown.

Quick fixes: darken your grays (#767676 is about the lightest gray that passes on white), and put a dark overlay or solid band behind any text that sits on a photo. Your hero headline is the first place to check.

05

Label your forms and name your links

Every form field needs a visible label above it, not just gray placeholder text inside the box. Placeholders vanish the moment someone starts typing, and many screen readers never announce them, so a visitor hits a set of blank boxes. In WPForms and most WordPress form plugins there's a 'hide label' toggle per field: turn it off. In Wix, click the form, choose Edit Form, and check that each field shows its label.

Links and buttons should say what they do. 'Click here' and 'Learn more' mean nothing to a screen reader user jumping from link to link, and nothing to Google either. Rename them to the action: 'Request a quote', 'See water heater pricing', 'Call our Delafield office'. If a button is just an icon (the phone icon, the hamburger menu), pick a builder element that pairs the icon with a word.

Check headings too. One Heading 1 per page, then Heading 2 for sections, Heading 3 under those. Pick levels by structure, not by which size looks nice. Skipped levels are one of the flags Lighthouse throws.

06

Pass the keyboard test

Put your mouse aside and press Tab repeatedly from the top of your homepage. A visible outline should hop through your menu, links, form fields, and buttons in a sensible order. Enter should follow a link, and Escape should close any popup. If you can reach and use everything, you pass.

Common fails: the focus outline is invisible because a designer turned it off for looks, a dropdown menu only opens on mouse hover, or a chat popup traps you with no way out. Mainstream builders and modern WordPress themes mostly pass out of the box. The usual saboteur is custom styling that removed outlines; if you or your web person did that, put them back.

For extra credit, spend five minutes with the screen reader already on your phone. iPhone: Settings > Accessibility > VoiceOver. Android: Settings > Accessibility > TalkBack. Swipe through your own homepage and listen. Unlabeled buttons and junk alt text announce themselves fast.

07

Post an accessibility statement and skip the overlay widgets

Add a short accessibility page to your site, linked from the footer. Three parts: you aim to meet WCAG 2.1 AA, here's an email and phone number to report a problem, and you'll fix reported issues. It shows good faith and gives a frustrated visitor a path to you instead of to a law firm.

One thing not to buy: accessibility overlay widgets, the little icon plugins that promise one-line compliance. They don't fix the underlying code, many screen reader users find they make sites harder to use, and businesses running them still get sued. Spend that money on the fixes above instead.

Then make this part of your routine. Rerun pagespeed.web.dev after any site change. New page, new photos, new form: thirty seconds to confirm the score held.

Common questions

Questions that come up

Can a small business in Wisconsin really get sued over its website?

Yes. The ADA has no minimum business size, and law firms send demand letters to local businesses in bulk, often after running the same automated scans described above. Most cases settle. Fixing the common failures removes the easy targets, but for a real legal risk question, talk to an attorney, not a web guide.

Will an accessibility widget or overlay make me compliant?

No. Overlays sit on top of your site without fixing the broken code underneath, and companies using them get sued anyway, sometimes with the overlay named in the complaint. The fixes that matter are alt text, contrast, labels, and keyboard access, and they live in your actual site.

What accessibility score should I aim for?

90 or higher on the PageSpeed Insights accessibility check is a solid target. Remember it's an automated scan that catches only a portion of real issues, so pair a good score with the keyboard test and the five-minute screen reader test.

Do I need to hire a developer for this?

Usually not. On Wix, Squarespace, or WordPress, alt text, labels, link names, and colors are all settings you can change yourself. You'd want a developer if your site is custom-coded and fails the keyboard test, since restoring focus outlines and fixing form markup means editing code.

Or skip the homework

Rather I just did this?

Fair. The audit shows where your site actually stands in about a minute, then you decide. No email required, no pressure, just the truth.