Reconfiguring your website for compliance with ADA can be a big undertaking, and it’s easy to accidentally pass over small elements during development or implementation. While mistakes may seem small, they could be impactful enough for a user to file an accessibility lawsuit against you.
Here at User1st, we’ve helped many websites across different industries implement and maintain website accessibility. Here are five of the elements we’ve found to be very easy to miss.
- Functional Text Zoom and Resizing
According to WCAG 2.0, users should be able to resize any text (other than captions and text images) up to at least 200 percent. Many companies assume their website will automatically resize functionally when the user zooms using their browser. But here’s the catch: resized text needs to maintain full visibility and functionality.
Often, zooming in on a page using the browser causes letters to overlap, run off the page or otherwise make text difficult to perceive or read. In these cases, although the zoom function exists, it no longer conveys its full message to readers and therefore is not truly accessible. Companies need to ensure their websites offer users a way to resize text without losing essential formatting.
2. Color Contrast
Color contrast is the difference in lightness between two colors (this widget illustrates contrast ratios quite well). The required color contrast ratio for web pages is at least 4.5:1 (for reference, teal text on a white background is close to this threshold), except in select cases. Without sufficient color contrasting, some users may not be able to distinguish text from its background. This can lead to information loss and can be grounds for a lawsuit.
Many companies forget this factor, especially when designing according to brand standards. Pulling from secondary brand colors (or revising branding to include highly contrasting colors) can often remedy the problem; after all, a color scheme that does not meet accessibility standards of contrast also isn’t likely to stand out or grab attention.
3. Keyboard Access Functionality
Websites need to be formatted to accommodate keyboard or keyboard emulator functionality to ensure users can experience the site in full.
First, keyboard functionality needs to give users access to every interactive element of the site with very few exceptions (freehand drawing is one). Menus, buttons, hovering, scrolling and other essential functions should be accessible through a keyboard or equivalent.
However, that’s not the only characteristic that websites require in order to be fully keyboard-accessible. Keyboard selectors need to navigate through a page logically. That means no skipping buttons or jumping haphazardly around the page; the user should be able to reasonably anticipate where the cursor will move. Developers should also watch for keyboard traps, where the user cannot easily navigate away from an element without a mouse.
While small mistakes in keyboard functionality can be particularly easy to miss during development or implementation, imagine the frustration of tabbing through all clickable options on a page only to find you cannot get to the item you want. Functionality faults like this bars users from interacting with your page, potentially turning away customers and damaging brand loyalty. To top things off, an oversight like this is enough to catch companies in an accessibility lawsuit.
4. Meaningful Link Text
Webpages have a lot of links, so this one’s particularly easy to forget. Link text should be clear and meaningful, even when read out of context. For example, hyperlinking only the word “here” in “contact us here” wouldn’t be sufficiently meaningful, because “here” is not meaningful on its own. When designing a web page, look at links out of context to determine whether they meet this criterion. Links like “More,” “View Now” or “Go” won’t cut it.
5. Alt-Text for Images
WCAG prescribes that web content must be perceivable and understandable. For those who cannot perceive or parse images, alternative text should clearly and accurately describe images to avoid loss of meaning.
Which types of images require a text alternative?
Generally, images that convey meaning require some form of alt-text. Since most images fall under this category, this accessibility element can be easy to miss. If you’re unsure whether an image requires alternative text, consult WCAG’s decision tree.
Catch Slip-Ups with a Web Accessibility Checker
Ensuring web accessibility on all fronts can be challenging – and these are only five of the many implementations that are easy to miss. Even companies with the best intentions can make honest mistakes that land them in a heap of trouble.
To avoid unwittingly committing compliance errors, try our automated website accessibility checker for a baseline on where your website’s compliant and what your developers might have missed. Start your free check now!