8 Ways Pro Designers Design an Accessible User Experience
More than 42 million people live with a disability in the United States. That makes up 13% of the entire US population. The first step to creating an inclusive digital product is embracing web accessibility.
Website and UX designers follow website accessibility standards that closely model the Americans with Disabilities Act of 1990. If you want to embark on an accessible design, we'll guide you through several strategies to show you how to make it possible.
1. Refine Your Header Tags
Titles play a pivotal role in accessible design, serving as markers for categories, zones, and layout elements.
Despite often being overlooked, they subtly guide our attention and establish the hierarchy within a website. Their significance is underscored by their dedicated category in website accessibility audits.
Consider the H1 title a cornerstone element in any accessibility checklist. This title provides crucial information about the page's main topic for users relying on screen readers. Each page must feature precisely one H1 title to maintain accessibility standards.
Examples such as House of Joppa, a Catholic home decor store, demonstrate that striking design and accessibility coexist harmoniously. These cases illustrate that aesthetics and compliance can complement each other, showcasing the potential for seamless integration of beauty and accessibility in web design.
2. Leverage OAuth
Another way pro designers create an accessible user experience is by using OAuth. This open-standard authorization protocol allows users to grant limited access to their accounts on other services without sharing their passwords.
OAuth enables users to control what data and actions they want to share with third-party applications and revoke that access at any time.
It also simplifies the user experience by enabling single sign-on (SSO) across different services, so users with disabilities don't have to remember multiple credentials or go through multiple authentication steps.
Sometimes, less is more. So, make it as easy as possible for users to log onto your website or application.
3. Don't Forget About Alt Text
Alt text, or alternative text, describes what an image is about. It's useful for people who use screen readers to navigate a website. Adding alt text to your images isn't only beneficial for website accessibility purposes, but it's also helpful for SEO.
Think about it this way. Google and other search engines use search crawlers to process website pages. By doing this, search engines can analyze what your web pages are about, index them, and rank them accordingly.
Naturally, search crawlers don't have eyes to see images or non-text content on your website. With alt text, search crawlers can quickly process and index your website's images.
Adding alt text using a content writing tool, a content management system (CMS) or a website builder only takes a few seconds.
4. Prioritize Color Contrast
Websites should use colors that stand out to capture attention and accommodate people with vision impairments and cognitive disabilities.
High-contrast colors like green and yellow are noticeable and easy to see. Granted, including different colors on your website that don't match your brand kit can be challenging.
When in doubt, making sure that call-to-actions (CTAs) stand out the most on website pages and avoiding common color choices is also important for colorblind design.
Also, keep your navigation menus clear and concise (more on that in a bit). You should experiment with your color palette to see what works best for your website and ability levels.
5. Add Keyboard Navigation
To support people with visual impairments, you should add keyboard navigation to your website. In other words, give people with disabilities the ability to scroll and navigate your website by using their keyboard.
If you want to test and see if your website has keyboard navigation, press the tab key. You should be good to go if the cursor moves to different navigation items each time you press the tab key.
If not, you should adjust your website's front end. If you're using a website with a CMS, you can alter your theme or switch to a new one completely during the design process. On the other hand, if you're using a custom website, you can ask your developer for help.
6. Use Descriptive Anchor Text
Anchor text is a group of words with an internal or external link. Nearly every website uses anchor text to tell people with disabilities about the link they click.
It's important to use descriptive anchor text so people with disabilities know exactly where they're going once they click a link. Avoid using "click here" or "learn more" as anchor text in the design process.
Search engine crawlers and people with screen readers have no idea what "click here" means. Instead, you can use "check out our blog" or "read our latest study" to give internal and external links more meaning.
7. Label Forms Properly
If your website has embedded surveys or forms, you should make sure they're accessible to people with vision impairments.
How? tags to each form field. That way, screen readers can process your forms.
ARIA labels let people with disabilities know how to fill out forms properly. Without them, they'll know a form is there but won't know what information they need to complete it in user interfaces.
8. Caption Your Videos
Video captioning is useful for people with hearing disabilities and other impaired users.
The good news is that YouTube already provides closed captioning (CC). Therefore, if you embed a YouTube link to your website, a web visitor can easily click the "CC" button to transcribe your videos.
On the other hand, if you're adding MP4 or similar files to your website, you should use a transcription service to provide captions. That way, you can serve a wide range of audiences, prevent discrimination, and make everyone feel welcome on your website.
Final Words
Website accessibility isn't optional. A vast number of Americans live with a disability. Thus, creating an accessible website isn't only ethical, it's also great business sense.
Follow the design principles in this guide (along with standard accessibility guidelines). You'll be well on your way to designing an accessible user experience with all the bells and whistles of accessibility features.
Here's to making more websites inclusive for all!
Author bio
Ian David started his career in brick-and-mortar retail management, which quickly included eCommerce and digital marketing as well. He is an avid reader and a self-taught expert in SEO and content marketing. He writes for several publications on a variety of digital marketing topics. Recently, his focus has been on using influencer and affiliate marketing to drive more conversions.