How often have you used a website, only to close it in frustration after you can’t see the content on your phone, the buttons don’t function properly, or the text is too small to read and you can’t readjust it?
Welcome to the club of Internet users who have experienced inaccessibility issues (Population: just about everyone, which, according to Wikipedia’s estimates, was 7.4 billion people as of 2017). These accessibility issues happen constantly and, for Internet users with disabilities, they can make online experiences frustrating, navigation difficult, and sites impossible to use. More than one billion people (about 15% of the world’s population) are living with disabilities, according to the World Health Organization and World Bank’s World Report on Disability. Designer Nicholas Kramer offers a helpful way to think about accessibility,“A bad experience for the general public is usually much worse for a disabled or impaired individual.”
The Importance of Accessibility
Accessible design equates to how easily people can access and use your website. Accessibility is defined as “a practice of creating apps, sites, and products usable for everyone, including people with visual, motor, auditory, speech, or cognitive disabilities.” Accessibility (also referred to as “a11y” in the accessibility community) extends to anyone who’s experiencing a permanent, temporary, or situational disability. Accessible design and UX places the responsibility on the originator of an app, website, or product, rather than the person using it, to ensure a successful experience.
Individuals with disabilities are the largest minority in the world, and the need for accessible digital solutions is only growing. Fortunately, organizations, international guidelines, legal ramifications, and even Twitter groups and accounts (like #a11y and @a11y) are forging the path toward more accessibility. Creating inclusive websites and experiences that are easy for everyone to navigate and understand is an essential element of user experience and, along with usability, design, and content, is a necessary step in the creation of a website, application, or other online experience.
Considering accessibility and designing with everyone in mind helps make for a great user experience for those already using your website, and opens up accessibility to new users as well. Jennison Asuncion, head of accessibility engineering evangelism at LinkedIn, recently tweeted that he wishes the tech industry would stop asking and trying to track “How many people with disabilities are using our product today?” and instead ask how many more people they could reach by investing in accessibility.
It’s an exciting time for those who are passionate about accessibility. Many designers, developers, and writers are now specializing in accessibility, and companies are able to find candidates with titles like “accessibility tester” and “digital accessibility expert.” Many businesses are now seeking candidates with accessibility knowledge and experience; those who are involved in the accessibility community; and those who are able to provide a11y perspectives in design thinking. The candidates these companies are seeking include front-end, back-end, and full-stack developers; content strategists; software engineers; and UX designers.
Web Content Accessibility Guidelines and a Few Practical Guidelines
The Web Content Accessibility Guidelines, or WCAG, are part of a series of technical web accessibility standards published by the Web Accessibility Initiative of the W3C, the main international standards organization for the Internet. The WCAG breaks down accessibility into four major principles that web content creators must adhere to in order for a website to be considered accessible: perceivable, operable, understandable, and robust.
Here are a few other accessibility elements to consider when building out an online experience:
People using screen readers are notified of each element on the screen separately and informed when something is an image, link, or button when applicable, so being intentional about the elements you create is very important.
Hierarchy and order
Can users visually navigate a page? When people visually navigate a page, they rely on a hierarchy: important items at the top; related items grouped together; and headers summarizing context. Think in terms of “up and down, left to right.” Your hierarchy and order should help them to quickly and easily gather the information they need. Assistive technology like screen readers and keyboard navigation typically follow your user interface’s visual order to convey information to users, so the order of navigation should follow the desired visual order, with descriptive page titles, headers, and hyperlinks.
Label UI elements
Text labels containing short, descriptive text clarify the purpose and provide instructions to users for UI elements such as buttons or form fields with short descriptive text. This helps all users understand the purpose of the element, and also helps screen readers narrate the context of the element to users.
Guiding users before they act on an element
Explain the reason or result of user interactions to users, before they take actions (such as entering an email, birthdate, or doing something such as “delete file permanently”). It’s a useful and necessary way to communicate what you’re asking people to do and guides them through the process. In addition, when using an assistive device, this information will be relayed first, before the name of the UI element (such as “button” or “hyperlink”) is narrated to the user.
In situations where media can’t load, alt text can be helpful and informative for all users. Use alt text to describe the action that will be initiated (the purpose) of a functional image (such as a button) you’re using, and use descriptive alt text to describe images you use on the page for visually impaired users.
Color and contrast ratio
Does your text meet contrast ratio requirements? Higher contrast can make it much easier for those with limited vision to read the content on the screen. The minimum background text to contrast ratio is 4:5:1, according to W3C. The Internet is full of accessibility testing tools to help you test this, such as color-blindness simulators and color-contrast checkers,.
Are you conveying information through means other than color? Color doesn’t always translate across cultures or abilities—so consider using text, shapes, and textures to communicate information.
Can your layout accommodate zoom? A layout should adjust and scale correctly when font size is changed or the user zooms in or out. If this doesn’t happen, it can cause important elements of the page to overlap or become obscured—and the page can become inaccessible.
Not Considering Accessibility is Bad for Business
As the Interaction Design Foundation points out, “Not only is designing for accessibility required by law in many countries, but if you fail to consider accessibility, you are excluding millions of people from using your product or service.” People with disabilities have billions of dollars in purchasing power. If they can’t use your website, they’ll turn to a competitor whose site they can use.
Additional Tools and Resources
Curious to dive in and find out more about accessibility? Check out Microsoft’s elegant online guide to inclusivity, Universal Windows Platform’s accessibility documentation, The A11Y Project’s Content Style Guide, and UX Collective’s roundup of accessibility tools for designers and developers.
Creating an inclusive environment online requires care and effort among designers, developers, copywriters, and other content creators, but it’s well worth it and will inevitably lead to a better website or service universally.