Resolutions to Common ADA Issues Found on Client Websites

What Does It Mean to Have an ADA Compliant Website?

The Americans with Impairments Act (ADA) was passed in 1990 to ensure that people with disabilities have equal access to opportunities as everyone else. Websites, like conventional businesses, must comply with the ADA. To be compliant, your website must be accessible to people with hearing, vision, or physical disabilities.

Screen readers and keyboard commands are frequently used by individuals with disabilities. These tools will translate on-screen information into speech-based information and depend on the website being properly coded in order to function as intended. As a result, some common mistakes must be corrected so that all users may access your website effectively.

Common ADA Issues On Websites

Our development team at PaperStreet has designed and built 2,000+ websites over the last 20 years. As a result, we know what to look for and have gained insight into the most common ADA compliance infractions. 

The PaperStreet development team shares some common ADA issues and some recommendations on how to address these problems:

ADA Compliant Web Forms

Forms are a critical tool to collect important customer data; however, if the form is not ADA compliant, individuals with disabilities will not be able to fill out the information properly.

Issues

Duplicate and confusing form labels and missing information on form and sidebar inputs.

PaperStreet Fix for ADA Compliant Web Forms

Ensure each field in the forms and sidebars is labeled so that screen readers can understand the information correctly.

ADA Compliant Buttons

Buttons are a fantastic navigation tool that helps the reader move through your website and access important content. However, if they are not properly labeled and not easy for a screen reader or user to understand, the buttons may fail an ADA compliance assessment.

Issues

  • Buttons with no context (designed aesthetically for sighted users) confuse the person using a screen reader.
  • Buttons to read or open a PDF are labeled in a confusing manner.

PaperStreet Fix for ADA Compliant Buttons

  • Add visually hidden labels to buttons designed with no context that is helpful for screen readers and make your site ADA compliant.
  • Add visually hidden labels to all PDF buttons, so the PDF purpose is apparent to screen readers (typically insert the name of the PDF).

ADA Compliant Links/Hover

Links are excellent for SEO purposes to link relevant content throughout your site. However, web accessibility guidelines state that links need to provide meaning, so it is essential to incorporate descriptive information into your links. 

Issues

  • Upon hover or when an element was highlighted, a sighted user can see the purpose; however, it would not be obvious for a user with a disability. 
  • Generic “Read More” buttons cause redundant links.

PaperStreet Fix for ADA Compliant Links/Hover

  • Add outline to all links on focus.
  • Add focus states to all hover states, sidebar links, industry boxes, and footer from submission (so it will communicate with the user).
  • Hide “read more” links and insert a post title instead.

ADA Compliant Keyboard Controls

Accessibility users often rely on keyboard controls to properly navigate a website. If the website is not coded to speak with the controls properly, your site will not be considered compliant. 

Issues with Keyboard Controls

Main navigation and practice landing pages are not accessible by keyboard functionality.

PaperStreet Fix for ADA Compliant Keyboard Controls

Add keyboard control and accessibility for main navigation and practice area landing pages.

ADA Compliant Controls

Controls help a sighted user with understanding how to navigate animation and messaging throughout the website. However, if not coded with the proper information, these can be very confusing for screen readers. 

Issues 

Sliders did not have control labels, or the labels were confusing.

PaperStreet Fix for ADA Compliant Controls

  • Add functionality for pause/play controls to slider dots.
  • Add labels to slider controls.
  • Remove unnecessary labels on slick sliders.
  • Fix multiple form labels for disclaimer input on the sidebar and footer.

ADA Compliant Web Images

Images make quite the visual impact for sighted users; however, if they are not properly labeled, an image can have no meaning or be confusing for a user with a disability using a screen reader. 

Issues

  • Images missing labels and alternative text.
  • Interactive Google maps on office pages are not ADA compliant.

PaperStreet Fix for ADA Compliant Web Images

  • Fix Google map to ensure it meets accessibility requirements.
  • Add labels to attorney images. 
  • Ensure all images have alternative text.
  • Avoid using images with text/information embedded in the image.

An ADA Website Agency Can Help You Verify If your Website is ADA Compliant

Are you wondering if your website is ADA compliant? The ADA website has some beneficial information to get you started. However, it can be difficult to identify issues on your own without a trained eye or know how to fix them. The team at PaperStreet can help you audit your site to ensure you are meeting the requirements. Contact us today for help.


Leave a Reply

Your email address will not be published. Required fields are marked *

*