You may have caught wind by now that accessibility is no longer optional – that it’s now a legal requirement to ensure your digital products serve everyone, including those with disabilities. According to precedent set by the Ninth Circuit Court of Appeals in a case against Dominos in February of 2019, your organization can be rightfully sued for accessibility non-compliance.

If your site or app isn’t already accessible, bringing it into compliance with accessibility standards (typically WCAG Level AA guidelines) can seem like a large and costly undertaking. The good news is, many of your accessibility efforts will also enhance the overall usability of your product. That means a better experience for all customers and increased online success for your company.

Excellent Accessibility is Often Excellent Usability

Fixing your accessibility faux pas will improve the quality of your site or app as a whole. Most accessibility problems are also usability problems, and vice versa. Let’s look at a few common user experience problem areas that also present big issues for accessibility. Fixing one often fixes both.

PDFs

Online, PDFs cause a host of grievous UX issues. They’re all but impossible to use on a mobile device unless you seriously enjoy pinching and zooming. PDFs often contain text within images, making their content difficult for users to search. Many PDFs are created by traditional designers and thus not very user-friendly or even consistent with the look and feel of the digital product. Often, PDFs are print-first documents created by traditional designers that organizations slap onto their site or app rather than recreating the content on a screen. (Sound familiar?) Because they are usually created for print, PDFs are rarely user-friendly or consistent with the look and feel of the digital product.

A Usability Nightmare

None of these things are good for overall usability, but PDFs are easy for companies to upload en masse. And so the web is riddled with annoying PDF content that would be more searchable, usable, and effective as on-page content.

A Huge Barrier to Accessibility

In the world of web accessibility, PDFs aren’t just an annoyance. Depending on how a PDF is created, it may be impossible for someone with a disability to access the information in the document at all. If that information is critical to completing a task or interacting with your organization, those with disabilities have to ask for help or – more likely – take their business elsewhere.

While PDFs can be remediated to be accessible, doing so can be a long, drawn-out process. It’s very often less frustrating and time-consuming to turn the information found in a PDF into on-screen content. Nine times out of ten, it is also by far the most user-friendly choice.

Content Headings and Titles

Headings, titles, and labels should be concise, straightforward, and incredibly easy to scan. When they are not, both usability and accessibility suffer.

Fancy Naming

Too often, organizations get clever naming things on their site or app. They want to show off creativity or call navigational/wayfinding items by brand names that no user will understand.

Poor Organization

Many sites and apps are also guilty of incorrect heading hierarchy. They may present information out of semantic heading order (for example, heading order may be h2, h3, h5, skipping h4 in sequence). Or, faced with the need for a heading that looks like a bolded paragraph, they simply bold text instead of creating a heading size for the purpose.

Lack of Headings

Worst of all, far too many sites and apps still use few to no headings for their content. Instead, they paste large paragraphs onto their screens and expect users to slog through it. This is unusable web content – it gives users headaches and frustrates them to the point that they might decide your service or product just isn’t worth it.

Effect on Those with Disabilities

Ambiguity and/or inconsistency in headings and titles causes problems for everyone, requiring extra effort to see process information on a screen. This is multiplied by 1000 times for those with disabilities, many of whom rely almost entirely on clear, concise headings and titles to successfully navigate online. Fixing these accessibility problems will also fix multiple usability issues for everyone.

Links and Buttons

Similar to headings, all links and buttons should use descriptive, concise language that communicates exactly what a user will get if they click.

Click Here to Learn More

Popular labels like “Click Here” and “Learn More” are far too vague to be useful calls to action. They also often rely heavily on visual cues to communicate where links go. Nebulous links and buttons are confusing enough for your users overall. For those who can’t see visual clues to tell them what they’re clicking “here” or who use a keyboard to tab through a page where every action says the same thing (“Learn More”), it’s chaos.

A Usability and an Accessibility Mess

If your site or app has weak link and button text, people with and without disabilities will have to choose between finding what they need by trial and error or giving up and taking their business elsewhere.

Forms

It’s hard enough much of the time for users who don’t have disabilities to use online forms. They are frequently complicated and rarely well tested, making most forms a usability nightmare.

Common Frustrations

For users with disabilities, many of those same usability problems can make online forms almost entirely inaccessible. Here are just a handful of form usability problems that have a strong negative impact on accessibility as well:

• Excessive Copy – Long introduction and instructional text? Users with screen readers have to listen to every word of that text and try to retain any important information it contains since most of them can’t just glance and look at it again.
• Poor Layout and Labeling – Many users with disabilities can’t see your field layout to know that it’s confusing. They’ll find out when your fields aren’t clearly labeled and they have no idea what to enter. Those using a keyboard will fail to be able to use your form when they hit tab and can’t select the next field.
• Time Limits – Forms with time limits frequently time out long before users with disabilities can complete them.
• Inadequate Success and Error Messaging – Weak success and error messages may go completely unnoticed by low vision or blind users, preventing them from completing the form successfully or causing them to think they need to try to fill out the form again.

Real Consequences

We use forms to complete many day-to-day critical actions: pay bills, buy tickets, provide personal and important information to health care or financial institutions, etc. An unusable form can prevent anyone from completing one of these tasks successfully. For those with disabilities, the stakes are much higher – an unusable, inaccessible form can be the difference between someone with a disability paying a bill once, six times, or not successfully paying at all.

Color Contrast

Many organizations choose their site colors based on their brand palette – a tactic that would make sense if the brand palette had been created with the web in mind at all. Unfortunately, this is almost never the case. As a result, these beautiful colors are difficult for those with less-than-perfect eyesight to see clearly. Those who have low vision or are color blind may find them next to impossible to see.

To top that off, a vast majority of digital products rely on color alone to identify links (and you’re lucky if that color is at all consistent or noticeably different from paragraph text). WCAG guidelines require that links are indicated by a visual marker that isn’t color, which is a good usability practice as well. All of this color confusion is bad news for your user experience and even worse for accessibility.

Contrast Ratios

WCAG Level AA compliance requires a contrast ratio of at least 4.5:1 for regular text and 3:1 for large text. Text is considered large if it is over 24px or over 18px and bold. You can test this on your site or app right now. A quick pass with a tool like WebAim Color Contrast Checker will very likely reveal that your organization’s colors do not pass for contrast.

Be Flexible

Following these rules can be a little painful, particularly if your organization – like most – is stringently attached to its brand colors. But your users – both those without and without disabilities – couldn’t care less about your brand colors if they can’t easily read your text and understand actions.

When Accessibility and Usability Don’t Get Along

Excellent accessibility is often excellent usability, but not always. Sometimes the rules of solid UX and the rules of accessibility just don’t agree. We’ve covered a few examples of compromise between accessibility and usability before. But even if you find yourself at a usability/accessibility crossroads, it is always true that with some creative problem solving, you can find a solution that satisfies both sides.

Excellent User Experience for All

Making your digital product accessible will also improve its user experience and overall quality. In fact, addressing accessibility flaws will likely also fix usability problems that may have been looming over your organization online for years. The result will be sites and apps that work better for everyone, making it much easier to do business with you online.