ADA Compliance Best Practices for Healthcare Websites

Usability Testing and WCAG ADA Compliance

Did you know that nearly 20% of the United States’ population has a disability that is covered by the ADA? Not only that, but this population is 4x as likely to consider themselves in poor to fair health compared to those who do not have a disability. Considering healthcare users with disabilities when building and maintaining your healthcare site is of utmost importance. In this blog, we will review ADA compliance best practices for healthcare websites including the different types of compliance checkers and the difference between WCAG 2, Section 508, and ADA.

Web Compliance Checkers: Which One Should You Use?

The first step in being compliant is evaluating your site to see what is actionable. While it may not be realistic to be 100% compliant, it is important to be as compliant as possible. Here is a list of three web compliance checkers that you can use depending on your needs.

Accessibility Checker

One checker Bartlett Interactive likes to use for a quick evaluation is Accessibility Checker. This tool will evaluate your entire site in one swoop. It lets you know if your website’s status is compliant or not. This should be used as a quick test.

Web Accessibility

Another reliable checker is Web Accessibility. This is a page-by-page checker. It is useful to see how your individual pages compare to others. You have to register to get detailed information, but it is helpful when used as a comparison.

WAVE Web Accessibility Evaluation Tool

Last but not least is our favorite tool, WAVE by WebAIM. This checker gives you a very detailed view of the accessibility issues of your site. It breaks the site down into parts so you know exactly what you need to fix to get your healthcare website compliant.

What’s the Difference Between WCAG 2, Section 508, and ADA?

WCAG 2, 508 compliance and ADA compliance all share the same goal: that people with disabilities can use electronic and information technology with ease.

1. WCAG stands for Web Content Accessibility Guidelines which is a compilation of guidelines for websites. These guidelines are separated by Level A, Level AA, and Level AAA and cover basic to moderate to advanced (respectively) guidelines. WCAG primarily focuses on HTML accessibility.

2. Section 508 is specific to federal agencies. That states that these companies must use and develop an information technology structure and communications that is easily accessible by disabled people. If your healthcare company is considered a government website, you’ll need to pay extra attention to this.

3. ADA Compliance is a civil rights law. This one focuses on all websites being equally accessible no matter the disability of the individual user.

What Are The Best Practices To Keeping Your Website Compliant?

There are always improvements that can be made regarding compliance. The use of color, labeling forms and messaging functionality, images using text, marking up content, keyboard navigation, hover states, and using clear descriptions are all important when improving your website.

Use of Color: Guidelines for Compliance

Color is a way to convey a certain feeling for when a user gets to your site. Many sites play off their branded colors to ensure consistency throughout the site. The recommendation for ADA compliant color usage is to use color to enhance the website, but not completely rely on color.

Users with visual impairments may not be able to distinguish between too many colors or colors that do not vary enough. Not only should this be considered for the website in general, but it should also be applied to infographics. Data organized in graphs or charts may require a sufficient amount of color contrast. Some compliance checkers allow you to enter hex codes to verify whether the combination is accessible or not.

Include Instructions on Forms and CTAs

Providing instructions for forms, CTAs, or any functionality that requires an action from a user should have labels. Differently-abled users who have a screen reader need this text to be able to know what to do once they come across the form. These actions should have clear instructions, including any error messages that could arise if the form is submitted incorrectly. In addition to instructional text, make correct usage of headers.

Content and the layout should be separated with headers. Keep in mind calls to action are another text-relevant element on the site, so being descriptive with any buttons or links on the site will assist screen reader users in understanding what to do next. For example, instead of a “Click Here” message, you’ll want to be more specific and write something like “Sign Up for an Account Here.”

Descriptions for Images

Images need text associated with them for users who may not be able to see the image. Imagery is important for a website, so ensuring visually disabled users can understand what the image is trying to convey without needing to see the image enhances their experience. This text can be presented as alt text which is in the HTML and describes the picture. The CMS you use will have a place to enter this alt text. Not only will it help users access the site, it helps boost your SEO. It is not recommended using text in an image since a screen reader cannot read this information without alt text.

Keyboard Accessibility

Keyboard navigation must be supported since not all users are able to use a mouse. As a user tabs through the site, focus indicators are necessary to highlight elements. Hover states and click states are different, but should be designed at the same time. Those states must communicate a clear action and have a purpose. They also indicate to a user that that section of the content is clickable. These states relate back to color, as well.

The color difference between a click/hover state and a non-click/hover state should be different enough to have a noticeable effect. Underlining links is typically perceived as an out-of-date practice, but it is an ADA compliant practice if you choose to go that route instead. Having a healthcare website that is not compliant can result in penalties, and it can also harm your reputation. Since your healthcare website is often the first place people get to know your organization, make sure it is accessible to everyone.