Why is web accessibility so important?
The internet is ingrained into our daily lives. We wake up and check the news, weather and email all before leaving bed. But have you ever needed to do these tasks using a screen reader or keyboard navigation?
The goal of an accessible website is to provide universal access to everyone regardless of how they are accessing it. This includes users browsing the web through screen readers, keyboard navigational systems or voice input. Poor design choices can lead to a poor experience for visitors who rely on these technologies to surf the web. So how do you make sure your website isn’t preventing users from accessing your content? These guidelines will help you take your first steps in making sure your website is accessible for all.
Make Sure Your Text Is Legible
Making sure your text and navigation is easy to read is a key component to any accessible site. After all, users can’t navigate what they can’t see. There are two things you should pay attention to when formatting the text for your website, color contrast and size.
Color Contrast Is Your Friend.
Sure light gray font on a white background looks cool, but is it legible? The Web Content Accessibility Guidelines
published by the WAI and the W3C requires a contrast ratio of 4:5:1 for normal text (14 pt or larger) and 3:1 for large text (18 pt or larger). Following these color contrast guidelines helps people with color blindness, low vision, worsening vision or even users simply using their Kindle to browse the web (which does happen!). Luckily there are some great tools out there to help you easily check the color contrast on your website:
Tiny Font? Supersize It.
OK, maybe don’t supersize it, but do embrace large type. A significant amount of the population has a hard time reading anything below 14pt font on paper, and typically screens are even harder to read because of the lower resolution. While there is no official standard 16pt font is a good size to start for body copy, but you know your customers the best. Use your best judgment when picking a font and font size.
Don’t Rely on Color To Convey Important Information
The world wide web is a colorful place. Color can be used as decoration or establish brand direction, but the way you’re using color can accidentally exclude some users from navigating your website. As stated in the previous section, having the right color contrast can be tricky.
Luckily, color is not the only way to convey something is important. Adding visual cues such as underlines or animation to convey a link helps users with color disabilities navigate your site. An easy test to do is print out your website in grayscale. Can you tell your navigation apart from your headlines? If you’re having trouble distinguishing the two, you might need to rethink your design strategy.
Optimize Images For Screen Readers
Images provide a wonderful way to convey feeling or meaning to any website, but they can be problematic if someone visits your site using a screen reader or an image-free browser.
Using the alt text field provides the computer with alternative text to be displayed or read when an image cannot be conveyed/loaded. Make sure that your alt text is clear and to the point. Don’t overstuff it with keywords. Screen readers also can’t read text that is embedded in an image, so it’s always best to use live text when drawing graphics and charts.
In Closing
This is just the tip of the iceberg when it comes to accessibility. For more information check out some of these resources: