The practice of developing accessible digital products is one that requires all hands on deck. It’s necessary that everyone involved in the process should be aware of some common and avoidable mistakes. After all, web accessibility is both a legal and moral requirement.
In this article, I outline common web accessibility mistakes to avoid that will save you a lot of money, time, and headache.
By learning how to identify and avoid these mistakes, you can make your website accessible for everyone in a cost-effective manner.
The 4 biggest Strategic Web Accessibility Compliance Mistakes
Making your website accessible internally with your team
Making your website accessible by yourself or your team certainly sounds like a great idea. But before you consider doing that, you should answer the following questions:
- Will your team continue to work on the website and make changes (ex. add more content)? If yes, you should educate them on how to maintain web accessibility standards.
- Do you plan to make future site upgrades? If yes, you should monitor your website with an automated tool.
- Do you plan to change your site design? If yes, you should wait for the design change, or just make sure the design will follow the guidelines as it will have an impact on the design.
An interesting fact, about 50% of the manual accessibility work performed by average websites each year disappears.
Read our reviews about the Top 7 web accessibility solutions in the market, they’re tried and tested!
Using Automated Tools to Evaluate Your Accessibility Status
Another mistake website owners and development teams make is the use of online automated tools to evaluate their accessibility status. This is inefficient because automated tools can’t accurately detect the extent to which your website is accessible. For instance, if you use those same tools to evaluate websites like bbc.com and booking.com there will be accessibility errors identified. Bear in mind that these websites are large and have comprehensive web accessibility processes and teams constantly monitoring and remediating any errors. To use the audit tools you have to understand the standard and how to use the tools in the right way.
The Use of Free Solutions
Free accessibility solutions are the worst. They cause more harm than good. Remediation of accessibility issues requires web accessibility experts and the use of top-tier technology; essential elements that cannot be gotten for free. The purpose of an accessible website is for a better experience for people with disabilities. People with real problems. A free solution certainly can’t provide the level of technology required to give people with disabilities a better online experience. In addition, those free tools are a hot target for lawsuits, it’s easier for companies to track your website and file a lawsuit when you use a free solution.
Using an Accessibility Solution That Doesn’t Fit Your Company’s Strategy
This particular mistake is something that most companies make inadvertently. When they receive demand letters, they usually are in a hurry to become compliant by ADA, AODA, or whatever regional accessibility regulation. This leads them to choose a solution that doesn’t fit into their company’s strategy and plans. For instance, SMBs with limited budgets may not be able to keep up with the heavy fees required by manual accessibility solutions. Furthermore, these small businesses may lack an in-house web accessibility team to help maintain their websites. In the end, they’ll be left worse off than when they first started.
SMB? Choose our sponsored premium solution – Equally AI.
You’ve decided to make your site accessible by yourself – AVOID THE FOLLOWING MISTAKES
Let’s take a look at some other common accessibility mistakes that people make when they try to fix their websites manually
Trapping the Keyboard focus in an element such as a dropdown is one of the most irritating mistakes a web developer can make. A visually impaired user who is tabbing through the page and gets stuck in a dropdown will have a frustrating experience on your website.
Ensure you define a clear focus path for navigating the DOM that corresponds with the accessibility tree.
Simply because you like how a particular color combination looks and feels doesn’t mean that it is the right combo to use. Try using contrast plugins to test your color combos to be sure they have a 4.5:1 ratio at the very least. This helps people with the poor color vision to differentiate between the components of your website.
Bad alternative text descriptions
Every picture must have an alt attribute. In addition, be concise and clear in your descriptions of images on your website. In addition to helping people with disabilities and low bandwidth, it is also good SEO practice.
Lack of semantic HTML/ARIA structure
HTML 5 introduced several semantic tags. These tags such as; section, main, nav, footer, and aside, are helpful to provide context to both the web developer and the user agent.
In addition, where HTML 5 semantic tags fall short, you can use ARIA labels to help provide more context to your HTML elements.
The sole use of a text-based image
It’s not advisable to only use text images to provide meaning to a component or section of a web page. Try to add a description to the picture. It provides context for those who use screen readers to hear the content of your web page
For people who have low vision or some cognitive disorders such as ADHD, it’s advisable to make your web content zoomable. This helps people with low-vision better see your content and helps people with ADHD to focus on specific sections of the web page
Confusing link text
Ensure that the text for all your links makes sense. It should always be contextually related to the link. In addition, do not use a long string of words as a link. Preferably not more than five words. This is good for screen readers and SEO.
Not Labeling icons
It‘s common to see developers not providing labels for icons. For instance, in a photo gallery, the arrow buttons signifying “next” and “previous” may not be labeled. Always label such icons and smileys. It gives context and meaning to your site making it easier for people to intuitively navigate through the web page.
Empty form labels
Empty form labels are very troublesome for people accessing your web page using assistive devices. Form labels inform screen readers about the requirements of form fields. Make sure the form labels and inputs are clear for all the forms on your web page. It’s not enough to put placeholder text. Always label your forms.
Lack of skip links
It can be cumbersome for users of assistive devices and keyboards to navigate through all your aside content and dropdown menus before eventually getting to the main content of your web page. This is where skip links come in handy. Skip links allow users to skip from the main menu straight to the main page content, bypassing all the other not-so-relevant content.
The practice of building accessible digital products is something that has come to stay. The earlier you imbibe the culture, the better it’ll be for your consumers. Keep practicing, and accessibility will become a normal part of your work process.