8 things necessary to make a web site AA compliant

The web is a primary means of customer interaction for many businesses, government agencies and social groups. Many web pages and web sites are designed in such a manner that individuals with disabilities find it hard to leverage such pages (or sites). National Institutes of Health — NIH estimates that approximately 15% of the population at any given time is disabled.

The primary body governing Web Standards is the W3C — World Wide Web Consortium. This organization has a formal initiative called Web Accessibility Initiative — which publishes formal recommendations on how how a web page or web site can be made accessible to everyone including individuals with disabilities. These guidelines are known as Web Content Accessibility Guidelines (WCAG). The version of their guidelines published in 2008 became widely known as WCAG 2.0 and has been used in drafting Accessibility legal requirements across several countries. In 2012, this became an ISO standard.

WCAG asks that the Web Page address the following 4 principles,

Perceivable — The information should be comprehended by all individuals — especially those with visual or hearing disabilities

Operable — All individual should be able to operate the web site. This will translate to the web site

1. offering key board access where a user cannot use mouse,

2. having consistent navigation,

3. ability to zoom

Understandable — Content and Operation must be understandable by all users, especially for errors during interaction. E.g. a site submitting tax return should inform the user very clearly if the return submission fails.

Robust — the web page or website should work on multiple devices — smart phones, screen readers, tablets, laptops, etc.

WCAG 2.0 uses 3 levels of conformance — A, AA (Double A) and AAA (Triple A).

This article highlights important features which are a part of Double A (AA) conformance level so that product owners and developers can use these to build pages that achieve AA conformance.

1. Both Pre-Recorded and Live Videos to have Captions. This is also known as CC (Closed Captioning).
2. Do not use scanned documents, which are images. Post actual text content. Screen readers cannot read images, these can read text.
3. Color Contrast should be at least 4.5 to 1 between text and background.
4. User should be able to zoom in or out. At minimum user should be able to 200% or 2X.
5. Page(s) should be reachable by consistent navigation. The web site navigation should be on top so that user can easily switch between pages. Common features such as “About Us” at same location across the entire site.
6. Proper Page focus. E.g. if it is a form then the focus should be on first input element. Key Board navigation should be possible via Tab Key without mouse. If the page uses Modal windows, then these should be keyboard accessible.
7. Semantic HTML — use labels and headings on the page. These are well understood by screen readers to convey meaningful information to the user.
8. Error Handling — clear error suggestions if user makes data entry. Confirmation before submission. Clear notification of submission status — e.g. whether the submission was successful or if an error was encountered.

These above 8 items increase the accessibility of the web page (or the site) and lead towards AA WCAG conformance.