How to Get Started with Digital Accessibility

Published on January 31, 2020

This likely isn’t the first article you’ve come across regarding accessibility. It’s a hot topic across all industries, and with the increasing number of lawsuits against high-profile companies like Domino’s and even celebrities like Beyoncé, accessibility is quickly becoming a “must have” feature.

So, it’s a fair assumption you’re already thinking about how to make your digital content more accessible. You need to consider all the digital content you have, including websites, mobile apps, watch apps, web apps, social content... heck, even something as simple as an online PDF document requires some attention.

You might also be thinking, “Making my digital content accessible is time-consuming and implementation seems difficult.”

With the number of web accessibility lawsuits nearly tripling from 2017 to 2018, fighting a lawsuit would likely take more time, effort, and money by comparison than planning and implementing accessibility.

So... how do you make your digital content accessible?

There’s a lot to be said about accessibility being more than checking a box and being able to say, “Yep, we’re complaint.” Adopting accessibility into your company’s mission creates a culture that not only makes accessibility efforts more sustainable, it’s better for profits, better for your customers… the list goes on.

However, in this post, we will focus on understanding the technical aspects behind what makes digital content compliant.

WCAG

A good place to start is the Web Content Accessibility Guidelines (WCAG), a set of standards developed by the Accessibility Guidelines Working Group to make web and mobile more accessible to people with disabilities.

WCAG is designed around four basic principles:

Principle 1: Perceivable

Not everyone interprets information the same way. Digital content must be presented in several different ways so users can interpret information to their best ability.

For content to be perceivable, it can’t depend on only one sense, like sight.

Let's say you have an image. You should provide a caption for users who may not be able to see the image.

Video is another medium which can benefit from having a text alternative. A transcript of the audio can help users consume your content in a form that is easiest for them, such as large print, braille, or even translating it to another language.

Speaking of video, users will be better able to perceive your content if they can play it at a speed that is comfortable to them. You could consider turning a live recording into a pre-recorded segment, for example. At the very least, offering users the ability to stop and start your video will help them take in the information at their own pace.

When you're creating content, you want to make sure it can be presented different ways without losing overall structure and meaning. For example, when you're designing a website, consider the orientation of the user's device. It should look good on a phone in landscape and portrait.

Another concern with perception is when the content blends in too closely with the background. You should display it with contrasting colors and make sure the background isn't too distracting from the content. Further, you should not exclusively use color to convey information. Users with color blindness may have difficulty interpreting that information.

If you have audio content, like a podcast, you should provide controls to make the content play faster or slower. Some users may need it slowed down, but some users may prefer to speed up your audio so they can consume it faster.

Principle 2: Operable

Operability means that the navigation and user interface is usable in several circumstances.

Let's use a traditional laptop computer as an example. Most people operate the device with both a mouse and a keyboard.

However, there are some instances where you want to navigate using just the keyboard.

Operability means that the interface is flexible enough that it allows you to pick the interface that is most useful for you at the time.

In addition to the user interface aspect of operability, there are a few design choices you can make which impact operability. At one point in the internet's history, it was all the rage to use <blink> tags which caused content to flash rapidly in the browser. This caused problems for folks who were prone to seizures, so the practice has been (thankfully) taken out of use.

Another design choice which hinders operability is forcing a user to read and use content in a certain amount of time. Some users may need more time to watch a video before progressing to the next stage of your app, for example. If you show content, you should give your user enough time to get through it and not require them to move on before they are ready.

Solid navigation is another key aspect of operability. Your app or website should offer ways to help users get around your app and determine where they are. Following the navigation paradigms that are part of your platform (such as UINavigationControllers on iOS) would be a quick way to ensure users are comfortable with your app. If you're going to go against the grain with navigation, you need to make sure all users can still easily find their way around your product.

Finally, with the advance in assistive technology, there are more user interfaces available to users than ever before. Apple recently unveiled a new feature called Voice Command which allows users to navigate MacOS entirely with their voice. Your product should be able to incorporate these new technologies as they come along.

Principle 3: Understandable

Your app or website should be easy to understand.

Make sure any text content that you have in your app is readable (put away those weird fonts that look cool but aren't legible).

Design your app or website so it appears and operates in predictable ways. If a user clicks on a button that says "Contact Us", it should take them to the contact page.

Perhaps the area that needs the most help in any product is when a user needs to input information. Help the user out by marking required fields with asterisks. If they skip a required field, highlight that field and inform them of the issue. If you have password requirements for your product, put those on the sign up form so a user doesn't need to guess at those.

Principle 4: Robust

Technology changes rapidly. Your app or website should be robust enough that as assistive technologies improve, your site continues to be compatible with them.

When you're developing a website, for example, there are times when you want to implement your own custom control. Take the navigation button on the mobile version of this website. If you click the hamburger icon, it unveils a menu of options. That icon is not standard, and it should be identified in code with certain tags to explain what it does to a screen reader.

---

So, where do I start?

WCAG 2.0 was first released in 2008. 10 years later, WCAG 2.1 was released, extending the guidelines of WCAG 2.0 to address mobile accessibility, people with low vision disabilities, and people with cognitive and learning disabilities.

WCAG 2.1 is backwards compatible with WCAG 2.0, meaning if digital content follows the guidelines of WCAG 2.1, it also matches 2.0.

The Accessibility Guidelines Working Group recommends companies currently compatible with WCAG 2.0 adopt WCAG 2.1 as their new accessibility conformance target to provide improved accessibility.

If you’re new to making your web or mobile content accessible, working from WCAG 2.1 will assure compliance.

To assist with complying with WCAG, the Bureau of Internet Accessibility (BOIA) provides free accessibility checklists for both mobile and web content. BOIA also offers a free audit of your website for compliance with WCAG guidelines.

The Web Accessibility Initiative conveniently organizes accessibility resources by organizational roles. Whether you’re a developer, content writer, designer, manager, web user, tester, policy maker, or educator, you can find accessibility resources tailored to your use-case.

Looking for visuals to illustrate accessibility features? The UX Movement combines cited articles with visual examples to detail digital accessibility of content, forms, buttons, navigation, wireframes, and mobile.

If you’re unsure how compliant your mobile app is with WCAG guidelines or if you’re wondering how software can increase your business’s accessibility compliance, let’s chat.