A lot of companies are not aware of the fact that their websites are not ADA compliant. Now, you may be wondering what the ADA is exactly, and why isn't your website compliant with it, but not to worry. We'll show you if your website is not compliant with ADA standards (it probably isn't), and how you can fix it!
First, let's explain where this came from.
The ADA, or Americans with Disabilities Act, is a law that was passed and enacted by the United States Congress in 1990. It is a wide-ranging civil rights law which prohibits, under certain circumstances, discrimination based on disability. It is similar to the Civil Rights Act of 1964, except this deals with disabilities rather than race, religion, sex, or national origin. The ADA specifically defines a disability as "…a physical or mental impairment that substantially limits a major life activity." Of course, the ADA applies to all walks of life and situations, however, we're going to focus on where it affects online websites, both desktop and mobile, and explain to you how you can make sure your website is compliant with ADA standards. Remember, this is a LAW and you are required to follow these guidelines. If you don't, you will not only narrow your customer demographic, but you will also probably field complaints and end up getting into a legal pickle, and you obviously do not want that.
The part of the ADA that you need be concerned about is Title III of the Act. Title III requires businesses and nonprofit service providers to make accessibility accomodations that will allow the disabled public to access the same services that non-disabled clients can access. This includes electronic media and websites! Even though the ADA states that it only applies to businesses and companies with 15 or more employees, small businesses, too, can find benefits from making their websites ADA compliant. ADA compliant websites enable companies and websites to open up to more potential clients and limit liability. It is imperative that web developers include ADA compliant features in their initial site and application plans.
If you work for a government agency or government contractor, this becomes even more important. In this case, Section 508 of the Workforce Rehabilitation Act of 1973 comes into play. Section 508, specifically speaking, "requires that electronic information technology used, maintained, developed, or procured by HHS (Health and Human Services) be made accessible to persons with disabilities, both employees and members of the public." Government agencies and contractors are required to follow the accessibility guidelines of Section 508. Section 508 also has a published checklist which offers perspective into ways to make your website accessible for people with disabilities, so naturally it works towards ADA compliance. You also want to note that Section 504 of the Rehabilitation Act "requires Federal agencies to ensure that person with disabilities have an equal opportunity to participate in, and benefit from, their programs and activities."
Okay, that was the legal side. So you probably know by now that your site is not ADA compliant, and this obviously creates a problem for yo. So how do you fix it? Well, for starters, you can check your website's accessibility by looking at the accessibility checklist provided by the U.S. Department of Health and Human Services. Here is the checklist:
- Every image, video file, audio file, plug-in, etc. has an alt tag.
- Complex graphics are accompanied by detailed text descriptions.
- The alt descriptions describe the purpose of the objects.
- If an image is also used as a link, make sure the alt tag describes the graphic and the link destination.
- Decorative graphics with no other function have empty alt descriptions (alt= "").
- Add captions to videos.
- Add audio descriptions.
- Create text transcript.
- Create a link to the video rather than embedding it into web pages.
- Add a link to the media player download.
- Add an additional link to the text transcript.
- The page should provide alternative links to the image map.
- The <area> tags must contain an alt attribute.
- Data tables have the column and row headers appropriately identified (using the <th> tag).
- Tables used strictly for layout purposes do NOT have header rows or columns.
- Table cells are associated with the appropriate headers (e.g. with the ID, headers, scope, and/or axis HTML attributes).
- Make sure the page does not contain repeatedly flashing images.
- Check to make sure the page does not contain a strobe effect.
- A link is provided to a disability-accessible page where the plug-in can be downloaded.
- All Java applets, scripts, and plug-ins (including Acrobat PDF files, PowerPoint files, etc.) and the content within them are accessible to assistive technologies, or else an alternative means of accessing equivalent content is provided.
- When form controls are text input fields use the LABEL element.
- When text is not available use the title attribute.
- Include any special instructions within field labels.
- Make sure that form fields are in a logical tab order.
- Include a "Skip Navigation" button to help those using text readers.
Source: U.S. Department of Health and Human Services
If your website met all of the criteria mentioned above, then you're golden. However, you probably didn't, so that means you're going to have to make some modifications to your site before someone files a complaint against your site.
You can take initiative by collecting feedback from people who are deaf, blind, or have mobility disabilities on your site's ease of access, then address their feedback accordingly. You'll want to know what type of adaptive technologies your disabled users are using so you can adjust your services for them. You'll also want to note a number of things. Internet navigation can be tricky for people with limited or no vision, so a lot of blind or partially blind people use specialized web browsers and software that works with standard web browsers which have elements which allow users to better their internet experience. The screen reading software reads the HTML code on the website and gives the user an audio translation of what is on their screens.
Web developers MUST remember all of this when they are creating and designing their websites. High-end screen readers are able to use natural voices and alter tone and inflection based on HTML tags, so developers need to choose their layout features cautiously. Also note that navigation is much, much slower when using a screen reader. Sighted people can quickly scan the screen and click on the link they want. Blind or partially blind people using a screen reader have to wait for the reader to get to the link they want. A way to combat this is to minimize unnecessary graphics.
Acquiring feedback is a great way to get your site compliant, but don't just sit there and wait for the results to come back. Start working on getting your site compliant as soon as you have the resources and manpower to do so! You can also conduct your own trial run that will tell you whether or not your site has too many graphics and where HTML tags don't convey information correctly.The longer your site sits there noncompliant with regulations, the greater chance you have of getting into a legal bind. You'll want to run your trials using the most popular screen readers available. Popular screen readers include:
- Apple's VoiceOver is built into OS X Lion.
- JAWS works with Microsoft Windows.
- Windows comes with a standard screen reader called Navigator.
- Windows Magnifier is not a text to speech screen reader, but allows visually impaired users to magnify specific parts of the screen. Check your site for visibility with Magnifier.
- WebbIE works on Windows machines and incorporates browsing, screen reading, RSS, Podcatcher, and other tools.
- Thunder works on Windows machines in tandem with WebbIE and is a screen reader for accessing the computer GUI and web browsing.
- Access Firefox is a Firefox add-on that offers additional accessibility to Firefox users.
- Fire Vox is a text to speech add-on for Firefox.
There are also development tools and tutorials to assist web developers meet compliance standards. Look at the following for more information:
- HTML Best Practices for accessibility.
- Microsoft's Accessibility Overview and tutorials.
- Introduction to ARIA.
- Semantic HTML.
There also web accessibility development tools available:
- Accessibility Evaluation Toolbar for Firefox.
- The Develop Menu in Safari's toolbar.
- WAVE Web Accessibility Evaluation Toolbar for Firefox.
- WAVE Web Accessibility Evaluation Tool for websites and HTML.
- Web Accessibility Toolbar for IE-10 and 11.
- VisCheck for accessibility for people with color blindness.
- mobiReady for evaluating accessibility from mobile devices.
- Stanford University's Web Accessibility Checker.
Now obviously you won't have to use EVERY one of the tools we have listed here, but you will want to use a lot of the popular ones. These tools, much like the tools for the disabled, make it significantly easier for web developers to get your website compliant. Make sure, when you think you are done getting your site compliant, to go back through the Section 508 checklist and double check everything.
(Information pulled from techrepublic.com)