4 Ways You Can Improve Your Web Accessibility Right Now
By Sam Stemler
Web accessibility lawsuits are on the rise. With the latest website accessibility case declined by the Supreme Court, there will likely be more web accessibility lawsuits in 2020. If you’re uncertain about your website’s accessibility and nervous about a lawsuit, now is the time to take action. Web accessibility doesn’t have to be complicated. Here are 4 things you can do right now to improve your web accessibility. If you’re not a web designer, don’t worry—these changes are relatively simple and won’t require much experience.
4 Fast and Easy Web Accessibility Solutions
Some of the most common accessibility problems are also some of the easiest to solve. These are accessibility problems that you can test for and solve right now with very little web design experience. If you know how to add content to your site and make small changes, like editing text and images, you’ll be able to make these fixes. Making these fixes will remove many of the issues that have caused notable web accessibility lawsuits, and will put you ahead of many other websites.
1. Improve Contrast
In WebAIM’s programmatic analysis of the top 1,000,000 homepages, low color contrast was the most common accessibility issue, affecting a shocking 85% of pages. This is particularly unfortunate, since it is so easy to solve!
Here’s how you can easily improve the color contrast of your site.
- First, use a color contrast testing tool. If your pages are mostly all alike, testing one page may be enough. If your pages are markedly different, use a tool like Accessible Metrics, which will test your whole site for these and other problems.
- The testing tool will show you where your color contrast is lacking. You can fix these problems individually by changing text color, backgrounds, or changing images or icons. Or, you can change the color presets on your whole site by accessing the theme or template.
- Make these changes and try testing again. If your site checks out, you’ve fixed the most common accessibility problem!
Every web content management system (CMS) is a bit different, but you can generally change the color of text in the same place that you would add text. Or, you can change your entire site in a themes or appearance section.
2. Add Alternative Text
The lack of alternative text is also a very common accessibility problem that can be easily fixed.
First, what is alternative text? Alternative text, commonly called alt-text, appears in place of an image, link, icon or another visual element. Screenreaders can read out alt-text to a user who cannot see the visual elements. Therefore, alt-text is especially important for visually-impaired users.
The process for fixing this accessibility problem is very similar to the previous one. Here’s how:
- Test your site for alternative text. You can do this page by page, or test your entire site using these accessibility testing tools.
- Where images, icons, buttons or links do not have alt-text, add some. Describe what the visual element is in a few words. You can do this by logging into your CMS, clicking the element, and selecting edit. There will be a space to add and edit alternative text.
3. Add Link Text
This is very similar to the previous accessibility problem. Your site pages are connected by dozens, even hundreds or thousands of interconnected links. This is how users navigate around your site. In some cases, these links are already created through text, like the following link that leads to our home page. However, linked images and icons need text to show where the link leads.
Consider a button with the image of a house. Sighted users understand that this button will probably lead to the home page. However, without link text, a screenreader won’t be able to interpret the link. This is why missing link text can be problematic.
Also, consider linked text that simply says “click here.” This does not tell a user where the link goes. Instead, use text that explains the link, such as “click here to return to the home page.”
4. Use Skip Navigation Links
Navigation links at the top of your site can make it difficult for screenreaders to read. Screenreaders and other assistive devices must read through each link before moving to the content of the page. If you only have a few links at the top of your page, or you can expand and collapse these menus, this won’t be an issue. However, a large number of links at the top of the page can cause problems.
Luckily, you don’t even have to change your navigation to avoid this problem. By adding a “skip navigation” or “skip nav” link at the top of the page, you can make your page easier to use. To do this, simply add a link at the top of the page with the text “skip navigation.” Then, create an anchor point after the navigation links, usually at the start at the page’s content. Connect the link to the anchor point, and you’ve solved this accessibility issue.
By making these simple changes, you’ve made your site much easier to use for everyone, including both abled and disabled users. If you’re not sure whether or not your site is accessible, try a test. You can use a program to test your site, or conduct a manual test yourself using a few simple hacks, like disabling style sheets and removing images. Though it’s ideal to work with an accessibility professional, especially if your site is complex, this is a great place to start.
