Benefits of Web Accessibility in UX Design
Your website or app is the digital representation of your business. This is where people will access your content, products, and services online. The digital world is a great way to expand your business’ reach.
By DAVID GEVORKIAN
Unfortunately, there’s a high possibility that one out of five Americans are unable to enjoy your products and/or services. That’s 10% of total online spending that you’re missing out on. If you wish to ensure that you are always able to provide equal access and opportunity to all customers, you need to invest time, money, and effort in web accessibility.
What is web accessibility?
Web accessibility is grounded in the idea of universal design. This means that digital products and services are designed in such a way that they are useful and usable for everyone, regardless of their abilities. For example, web page accessibility ensures that a person with a hearing impairment must be able to access all the content on your website, including video content.
The Americans with Disabilities Act
The Americans with Disabilities Act, or ADA for short, is a civil rights law that was enacted in 1990. This law was created to protect people with disabilities against discrimination. It ensures that these individuals can access and enjoy the same goods and services provided to the general public.
Section 508
Section 508 of the Rehabilitation Act states that all Federal government agencies in the U.S. must develop, procure, maintain, and use Electronic and Information Technology (EIT) that is accessible to all, including people with disabilities. For example, any software utilized by a federal agency must be compatible with adaptive equipment, allowing employees and members of the public with disabilities to use them.
World Wide Web Consortium
The World Wide Web Consortium, also known as W3C, is an international community of organizations belonging to different IT industries. It was created by Tim Berners-Lee, the creator of the World Wide Web, in 1994. The purpose of this community is to improve the World Wide Web. This includes creating standards for web accessibility, ensuring that all web browsers provide equal access to everyone.
Voluntary Product Accessibility Template
The Voluntary Product Accessibility Template, also known as VPAT, is a self-disclosing document used by vendors of Information and Communication Technology (ICT). This document evaluates the accessibility of the product according to the standards set in Section 508 of the U.S. Rehabilitation Act of 1973. Vendors use it to inform buyers on how their product complies with the requirements of Section 508.
Applying web accessibility to UX design
W3C created web accessibility guidelines in order to help developers create web content that is accessible to all. Some of these guidelines are listed below:
Enable keyboard navigation for web design
Not everyone can navigate a website using a mouse. To ensure equal access to your website, you should incorporate keyboard access in the design. This means that any user can use his keyboard to interact with the various functionalities of your website. For example, using the Tab button to navigate the menu bar.
Prioritize text clarity
The text on your website must be easy to read for your content to be accessible to all. One way to ensure text clarity, is to make sure that your text and its background are easily distinguishable. The web accessibility guidelines provide a recommended minimum contrast ratio that you can follow. You should also make sure that your text size is adjustable, allowing readers to choose the size of their text for easier reading.
Don’t rely exclusively on color
Not everyone can distinguish colors easily. In fact, almost 10% of the population is color blind. While color is a great way of providing information on your website (i.e. red for error), some people may find it difficult to perceive this information. To ensure accessibility, you should provide other cues that users can rely on to interpret information such as meaningful labels (e.g. exclamation points for error messages) and text.
Order content in HTML for screen readers
Screen readers present content to its user in a linear fashion. This means that you should always keep in mind how screen readers will be “reading” your content when you’re structuring your website or writing your source code. The reading order of your content should match the meaning intended by the author to avoid confusing the user.
Explanatory link text
Screen readers usually inform their users when it comes across a text with a link by stating “link” before reading the text. For example, if the word “products” has a link, it will say “link products.” To make it easy for users to distinguish one link from another, you should make sure that you use explanatory link text on your website. Doing so allows users to skim your content, going from one link to another, without becoming confused or feeling frustrated.
Use a 44×44 pixel clickable area for touch controls
According to the web accessibility guidelines, the clickable area for touch controls and pointer interaction must be at least 44 × 44 CSS pixels. This allows all individuals to be able to easily activate targets such as buttons or anchor links, even those with limited dexterity or small screen size.
Do not forget to follow the accessibility checklist
Ensuring accessibility for all is not easy. There is a lot of ground to cover and guidelines to follow. Images, text elements, color, video, audio, site structure, navigation, etc. Because of this, it can be easy to overlook one or more accessibility issues. To ensure your compliance, use an accessibility checklist based on the WCAG standards provided by the W3C.
Accessibility and usability
According to the official ISO 9241-11, usability is defined as “the extent to which a product can be used by specified users to achieve specified goals with effectiveness, efficiency and satisfaction in a specified context of use.” In other words, your website or digital product must be easy to use and enable your users to accomplish their goal.
Accessibility, on the other hand, is just one of several factors that impact the usability of a digital product or website. When you design a website with accessibility in mind, you are ensuring that anyone can visit the website, navigate it, interact with it, and understand its content regardless if they have a disability.
Usability guidelines
The U.S. Department of Health & Human Services created the Web Design and Usability Guidelines that serves as a source of all the best practices in usability for website and application design. These guidelines consist of 18 chapters. The topics discussed within include software, navigation, hardware, lists, links, and test appearances.
Usability testing
Usability testing is a method that aids developers and organizations in evaluating ease of use. It requires you to allow actual users or customers to try out the website or application while you observe their behavior and take note of their feedback. Usability testing removes biases that you may get from developers, designers, and project managers. It also highlights any issues or problems that will need to be fixed before the website or product can be launched.
How accessible web design can lead to better user experience
Web accessibility and UX go hand in hand. By creating a website that is accessible to everyone, you provide a better user experience to all. This is because accessibility benefits everyone. For example, creating captions for a video on your website allows people with hearing difficulties to consume the content. It also enables anyone who needs to watch the video on mute to get the same information.
Another good example is high-contrast text. While this will help people who have a visual impairment read text more easily, it also benefits users with perfect eyesight. Not only is the text easier to read for them under normal circumstances, it also enables them to still access the same content when looking at your website under bright sunlight.
What is accessibility guide and accessibility statement
Accessibility guide and accessibility statement illustrate your company’s clear commitment to ensuring that everyone enjoys the same access and opportunities on your website. An accessibility guide provides users with information on how to use adaptive equipment on your website. It also provides them with alternative, temporary solutions if you have yet to achieve 100% web accessibility. an accessibility statement shows the public the policies and goals you have created as well as the actions you have taken to ensure web accessibility.
Conclusion
Great user experience is usability, accessibility, and aesthetics. Making your website look good is easy. Making sure that your website has all the elements it requires to make it accessible and easy to use for all–not so easy However, it’s an investment worth making because we all know what great user experience provides, namely, competitive advantage, customer acquisition and retention, and increased savings, all of which result in a successful business.
David Gevorkian started Be Accessible because of his passion for website accessibility and ADA compliance. He spent much of his career working for financial institutions creating websites and mobile applications. He earned his Master’s in Business Administration from Salve Regina University in Rhode Island. David is an advocate for creating web interfaces usable by all people. He enjoys recording music and playing soccer with friends.
Cover photo by Domenico Loia on Unsplash
