Accessible websites are better for everyone

You may already be familiar with accessibility on the web. Perhaps you operate in an industry where accessibility is mandatory, and failing to provide an accessible web experience could result in lost customers or lawsuits. Or maybe you’re not so familiar – none of your customers have complained, so it’s probably not an issue. Right?

Accessibility on the web isn’t about catering to any specific group of people. Instead, it’s about thoughtfully designing and creating a product that everyone can use. That means supporting screen readers, devices that read screen text out loud to users with vision impairment; allowing your site to be navigable by keyboard alone, because not everybody uses a mouse; and providing legible captions on any video content you create. (These are just a few examples. To learn more, visit The A11Y Project.)

You might be thinking, this seems like a lot of extra work. In a way, it is – we have to take extra time to consider accessibility when designing and building a website. But by doing so, we’re making a better end-product for everyone. One that is more consistent, easier to understand, and easier to use. In Scott Davis’s talk, It’s Spelled ‘Accessibility’, Not ‘Disability’, he points out the irony that we’ll spend time to support the 2% of users who use Internet Explorer, but often not the 15% of the population who experience some form of disability.

Here are some simple changes you can make to improve your site’s accessibility today.

Add descriptive alt text to images

Alt (alternative) text for images can be used by screen readers to describe images to users, but it’s also useful for anyone who is browsing the web on a poor internet connection. Have you ever seen text in the space where a broken image failed to load? That’s the alt text! And hopefully, you were able to read it and understand the context that the missing image would’ve provided.

Avoid low-contrast colors

Low-contrast colors are colors that are difficult to parse when paired together. For example, very light grey text on a white background would be hard to read. Make sure there is enough contrast between text color and background color of designs.

Make sure form fields have labels that can be read by screen readers

Labels are the text that describe form fields, like “First Name,” “Last Name,” and “Email Address” in a contact form. Without these labels, the form becomes difficult to understand and fill out. At RedTree, we often use placeholder text to display the field label (text that sits inside the field until the user begins typing), but we also provide the regular label to screen readers behind the scenes.

Supply descriptive text to links

For example, the link placement in the following sentence is unhelpful:

To read more about our privacy policy, click here.

Instead, we should wrap the link around the text that describes where the link leads:

Read more about our privacy policy.

As a small team, we at RedTree have definitely been in the “not enough time!” camp before. We’re working to improve our processes to make accessibility a default part of our web experiences. If you’ve had an accessibility issue on one of our websites, please contact us – we want to fix it.