Web accessibility is an important thing to think about for your website, but it’s not a hard hurdle to jump.
The newest version of the Web Content Accessibility Guide (WCAG 2.2) is due to be released later this year. This is a comprehensive guide to making sure your website or app is user friendly for everyone. To make sure you’re ready for these updated standards, take the time to see how your website stands up to WCAG 2.1 guidelines.[1]
Staying on top of your web accessibility game is more important than you think. Not only does it ensure your site is user friendly to those who need it, it has strong ties to SEO rankings. You’ll notice that many of the guidelines in WCAG 2.1 overlap with SEO best practices,[2] and this is not an accident.
1. Color and Contrast
A beautiful layout and color scheme will look dramatically different to someone with some form of color vision deficiency. Subtle differences in color may be lost on them completely. To make sure everyone has a chance to appreciate your design work, it’s a good idea to run it through a color contrast checker.
The Color Contrast Analyser (CCA)[3] developed by The Paciello Group is a Windows- and Mac-friendly program for checking text legibility and color contrast. It’s a powerful tool for assessing a serious design blind spot if you don’t have a color deficiency. If you’re on Chrome, there’s also a WCAG compliant color contrast checker available as an extension.[4] Similar extensions also exist for Edge and Firefox.
For more information or guidance on making your website WCAG-compliant, reach out to us today.LET’S CHAT
2. Font Size and Line Spacing
Make sure your text is easy to read without squinting. Not all visually impaired users rely on a screen reader to navigate your site and zooming in to read will make navigation cumbersome. This includes monitoring your font size and text spacing.[5]
Also, make sure any infographics are clearly legible, as these will sometimes not hold up to excessive zooming.
3. Alt Tags for Images
Images are great for websites, but if a user visits your site with a screen reader, they’re going to miss a huge chunk of your content. That’s where alt tags come in.[6] Adding these can also give your SEO ranking a boost if you include your target keywords.
4. Descriptive Links
Go beyond “click here!” Links with this kind of text confuse screen readers and make your links harder to find. You also want to avoid using the full URL as your link’s anchor text for similar reasons.
As an example, try reading this link aloud: https://usability.yale.edu/web-accessibility/articles/links#link-text
It’s not very easy to read, is it? A better practice would be to direct you to Yale’s guide to link text for usability and web accessibility. Adding your keywords in the link’s anchor text is another way to keep your site SEO-friendly.
5. Accommodate Keyboard-Only Navigation
Keyboard compatibility[7] is a big factor in web accessibility and important for several reasons. This factor helps those with permanent and temporary disabilities.
Some visitors will rely solely on a keyboard for navigating your site. They aren’t able to use a mouse, so any elements that rely on a mouse or cursor will hurt their ability to enjoy your content. Be especially careful with forms or other trending website elements like chatbots and overlays.
Keeping up with web accessibility guidelines isn’t just a good design strategy, it’s a crucial part of making sure your users can get to and consume your content. Done poorly, it becomes another way that a poor user experience hurts your website.[8]
Further reading and resources: