5 Tips on Web Accessibility and ADA Compliance

November 20, 2016 Bree Bascon

5 Tips on Web Accessibility and ADA Compliance

Last week on the blog we talked about web design standards and this week we will continue the conversation with web accessibility standards. Frankly, you cannot have one without the other if you understand quality web creation. 

This poses the question, how many of you check or even care if your site follows the web accessibility initiative guidelines?

Understandably for some, having a site that is ADA compliant is a non-issue. For others, it is not only a requirement, but also a necessity. This greatly depends on your sites’ audience.

What is the purpose of web accessibility? It is a comprehensive list of specifications that ensure people with disabilities and/or vision impairments are able to navigate and understand your site. The Web Accessibility Inititiave via W3C.org states web accessibility encompasses all disabilities that affect access to the Web, including visual, auditory, physical, speech, cognitive, and neurological disabilities. Being able to function through a site without a mouse or trackpad or having a screen reader able to clearly identify parts of a page are a few examples of having an accessible site. There is a long list of compliancies, and some have a higher ranking of importance than others. For now, let’s take a closer look at five different evaluations:

  1. Page titles: This is the very first interaction a user has with a web page. The web browser should be clearly labeled with a short description identifying the topic of the specific page. This could be read by a screen reader.
  2. Headings: Headings make a great visualizer. If a user is not able to see the page or use a mouse/trackpad, it is crucial to properly label headings in order. Every page should contain at least one heading.
  3. Text size adjustments: Depending on the audience, having the option to resize, and mostly enlarge font is important. This is important in design because when font or page size is adjusted, text could be illegible which is detrimental to user experience.
  4. Color contrast: To pass this test, design on a page must have a great enough contrast between the background and the foreground. WebAim is a tool we have used in the past to check our color contrast.
  5. Keyboard shortcuts: This is a tricky one. To be ADA compliant, a site must be accessed only though use of keys – no mouse. Keyboard shortcuts include being able to tab through all buttons and clicks on a page and tab through all fields including search and forms. Remember, tabbing forward also means tabbing backward is a requirement, too.

Understand your client and audience needs. If site is one that must be ADA compliant, it is strongly suggested to keep this short list in mind from the beginning of the design phase. And if you are in need of more recommendations, we would love to chat!