As the world becomes more aware of how people with differing abilities access products and services, web accessibility has become a priority for many of our clients. Many of them have a legal obligation to ensure people with disabilities can access their websites, and they’ve leaned on Stride to apply our expertise to make their sites ADA compliant.
What is ADA compliance?
ADA compliance refers to website accessibility standards set by the Americans With Disabilities Act (ADA). ADA requirements apply to state and local government agencies, private employers with 15 or more employees, and businesses that operate for the benefit of the public.
Even if your business or organization doesn’t fall under the above criteria, you may still care about making your website as accessible as possible. We’ve applied our web design and development experience to create this handy tip sheet to address the most common errors in website accessibility and how to fix them.
Write ALT text for every image
ALT text (or ALT tags) help people with visual impairments have equal access to web content. Web visitors who are visually impaired sometimes use screen reading software that reads content on a page out loud to them. Writing ALT text for your website’s images that describe the images and their purpose helps users understand your content when they can’t see it.
Example: Man wearing a plaid shirt who uses a wheelchair smiles as he plays the guitar
Best practices in writing image ALT tags have changed over time. Read our recent blog post to get up-to-speed on how to write them.
Colors and fonts matter
There should be a high level of contrast between the color of your text and the background it’s on. If the text is difficult for a sighted person to read, imagine what it’s like for someone with a visual impairment. White paired with black, dark blue, or dark gray is best. Also, be sure to use color for design purposes only, and not as a prompt or to convey information. For example, don’t say “Click the red button to continue.”
Website fonts should be a minimum of 16 pixels, and it’s preferable to build in the option for the user to make the text larger if they wish. Most browsers do this, but it’s best to be sure your site is compatible with browser scaling features and software that expands text size for users with visual impairments.
Use headings and subheads as often as possible
Headings are good for organizing content. Well, headings are good for a lot of things, actually. They’re good for SEO, they make a page easier to scan, and they help people who use screen readers navigate a page’s content more easily.
Remember that making text bold or large won’t be recognized by a screen reader as a heading, so it’s important to use proper headings and heading structure. H1 should be the page title, and H2 should be your first heading. A further subhead should be H3, and so on. Screen readers will read these headings in order, so the content of each header should be written accordingly.
Fix your empty links, buttons, and forms
Another common mistake in website accessibility is inadvertently making links, buttons, and forms difficult to use. If your website has forms, make sure to use form labels instead of placeholder text in the form fields, as placeholder text disappears as soon as someone starts typing into the form field.
As for buttons and links, make sure they’re descriptive and use text that describes where they’re taking the user. Buttons that read “Click here” to “Learn more” aren’t very helpful to a screen reader. Instead, use language like, “Learn more about web accessibility.” If a link opens another document, like a PDF, make sure to name the document and the link using a descriptive name that says exactly what the document is about.
While this isn’t an exhaustive list of everything that makes a website accessible and/or ADA compliant, this tip sheet describes some of the most common mistakes and how to address them. For additional help, there are many website accessibility testing tools out there to try. There are also several great accessibility plug-ins for WordPress websites that help solve many of the technical accessibility issues easily, and they’ve worked great for many of our clients.
We’re here to support all your web design and development needs. If you have questions or need help with web accessibility, reach out to us today!