Is Your WordPress Site Accessible? 10 Checks You Can Run
Can everyone use your website? Accessibility comes down to a few basics. Can people read your text? Can a screen reader tell what's on the page? Can someone get around your whole site using only a keyboard?
Those questions matter for people with low vision, people using screen readers, and people with fine motor issues who can't use a mouse. They also matter for anyone reading your site on a phone in bright sun.
Why accessibility matters for your business
If a visitor can't read your text, reach your services page, or fill out your contact form, they can't do business with you.
It also affects search. Google looks at how readable and well structured your site is. Many accessibility fixes, like clear headings and easy-to-read text, help both your visitors and your search visibility. One thing to know up front is that your hosting provider doesn't control accessibility. Any quality host can serve an accessible website. Accessibility comes down to your site's design, your content, and the theme and plugins you use.
Check what visitors see
1. Run your site through WAVE
Start with a free scan. WAVE, the Web Accessibility Evaluation Tool, lets you enter your web address and see your page with icons marking possible issues. It checks things like color contrast and heading structure.
WAVE takes a little time to learn, and it won't catch everything. Use it as a starting point, then run the manual checks below. Google PageSpeed Insights also flags some contrast issues, but it isn't as thorough for accessibility.
2. Check your color contrast
Text and buttons need to stand out clearly from what's behind them. When colors are too close, people with low vision may not be able to read them.
Here's a simple test. Take your laptop or phone into a sunny spot. If you have to squint to read your text or find your buttons, some of your visitors are having the same experience every day. WAVE will also flag specific contrast errors.
We ran this check on our own site and found a heading color that needed adjusting. Contrast issues are common, and they're usually easy to fix in your theme's color settings.
3. Be careful with text on top of images
A busy background image can make text hard to read, even when the colors look fine at a glance.
There's also a hidden risk. Say you have white text over a dark photo, but the background color behind that photo is white. If the image loads slowly or fails to load, visitors see white text on a white background. The fix is simple. Set the background color behind the image to a dark color so your text stays readable no matter what.
4. Keep important text out of images
Text that's part of a graphic, like a flyer or a banner image, can't be read by a screen reader unless you write it into the image's alt text. Put key information, like hours, prices or announcements, in real text on the page.
5. Add alt text to your images
Alt text is a short written description of an image. Screen readers read it aloud so visitors who can't see the image still know what's there. In WordPress, you can add it in the Alternative Text field when you upload an image to the media library.
Check how visitors move around your site
Some visitors can't use a mouse because of fine motor challenges. They rely on a keyboard to get around. Your whole website, including links, buttons, and forms, should work without a mouse.
6. Tab through your site
Open your website and press the Tab key. Each press should move to the next link, button or form field, roughly from the top of the page to the bottom. When you land on something you want to use, press Enter (Return on a Mac) to activate it.
That's it. No special shortcuts needed. Try reaching a few key pages this way, then try filling out your contact form using only your keyboard.
7. Make sure you can see where you are
As you tab through, the selected item should change visibly. That might be an outline, an underline or a color change. Without it, keyboard users can't tell where they are on the page.
This one is easy to miss. When we tested our own site, keyboard navigation worked, but our top menu didn't show which link was selected. By running this quick test, we were able to fixed that.
8. Open your dropdown menus with the keyboard
If your menu has dropdown items, like a list of pages under Services, make sure you can reach each one by tabbing. If the dropdown doesn't open from the keyboard, keyboard users can never visit those pages.
Check how your content is organized
9. Use headings in order
Screen readers use headings to understand a page and jump between sections. Start each page with one H1 heading. Use H2 headings for main sections and H3 headings for sections inside those. Choose heading levels based on structure, not on how big you want the text to look.
10. Tone down motion
Autoplay videos, moving backgrounds, and animations can be distracting and make text harder to read. Give visitors a way to pause any motion on your page.
Even better, respect the reduced-motion setting many people turn on in their device. For example, your site can show a still image instead of a background video for those visitors. This one usually takes some developer help to set up.
What to do with what you find
Fix as many issues as you can. Many of the most common problems, like color contrast, alt text and heading structure, are things you can usually change yourself in WordPress or your theme settings.
Other issues take more work. Keyboard navigation problems can have several different causes. In WordPress, your theme and plugins control most of what visitors see and use. Some are built with accessibility in mind, and some aren't. If a theme or plugin is the source of the problem, you may not be able to fix it through settings alone.
If you hit a dead end, a web designer or developer can help track down the cause. And if your scan turns up a long list of issues tied to your theme, it may be a good time to consider a redesign with accessibility built in from the start.
Need help with fixes?
Some fixes, like keyboard navigation, can take more digging than a settings change. If you need hands-on help, reach out to a web designer or developer, such as Stickle Creative.
A developer can track down what's causing the problem and check whether your theme or plugins are part of it. If your theme is holding your site back, they can also help you decide whether to fix what you have or plan a redesign with accessibility in mind from the start.