Web accessibility hits squarely at the heart of what we do at Boston Digital. As user experience strategists, we strive to develop the best online interfaces for the web—whether on desktop, tablet, or mobile. When we consider the users who will access the sites or apps of our clients, we must take into account all types of users, including, and especially, those who have disabilities.

According to the U.S. Census, one in five people have a disability. Despite that large figure, Newsday reports that 85% of websites are not fully accessible for people with disabilities.

ADA Digital

The need to develop accessible websites has become more prevalent these past few years as more and more class action lawsuits against major corporations are filed by disability rights advocacy groups on behalf of clients with visual or hearing impairments. In 2016 alone, Domino’s Pizza, Potbelly Sandwich Works, Reebok, Panera Bread, AMC, and 240 other major companies all faced lawsuits for alleged violations of the Americans with Disability Act. Title III of the ADA is intended to ensure consumers of all abilities have the right to access the same goods and services.

The New Web Standards

Of course, when the ADA passed in 1990, only science fiction authors dreamed of the technology-fueled world we’d be living in, where everyone has a computer in his or her pocket. As times change, so must our laws. Therefore, the Department of Justice (DOJ), in the midst of growing concern and litigation, promised to develop and publish in 2016 new standards for website and mobile applications that would align with the ADA.

Clearly, the deadline for the DOJ’s new standards has come and gone. The DOJ pushed its deadline back to 2018, after stating that it needed to first develop new standards for Title II, the rules which govern government agencies and contractors.

At the end of 2016, the DOJ wrapped up a public forum, allowing interested parties to submit their concerns and suggestions for the new standards. We should expect the DOJ to be well at work on meeting the new 2018 deadline.

Getting Up to Code Today

ADA Compliant
Nevertheless, we recommend that you not wait for the new standards to come out before taking steps to improve your website or app accessibility. Taking care of what you can today will make any changes necessary a year from now all the more easier.

It is likely the DOJ will use the Level AA standards in the Web Content Accessibility Guidelines (WCAG), 2.0. These standards, developed by World Wide Web Consortium (W3C), which is the main international standards organization for the web, are explicitly for providing guidelines to web and app developers for creating optimally accessible content for users with disabilities.

To ensure your website or app is meeting the latest standards of the WCAG 2.0, we recommend the following:

  1. Have your site audited by a 3rd-party website vendor for compliance using both user-based and programmer-based testing.
  2. Create a clear web accessibility policy and build internal processes to ensure smooth implementation and adoption.
  3. Make accessibility a core foundation for all your decision-making processes (both online and off).

5 Common Web Accessibility Mistakes

While you’ll find many standards to follow in the WCAG 2.0, here are some of the most common problems we see.

1. Incorrect Heading Tags

Headings (H1, H2, H3) are crucial to all users—both disabled and non-disabled. If implemented incorrectly, headings can cause serious navigational problems for disabled users.

Too often we come across long-form content (usually on blogs or news pages) that, instead of using H2s or H3s, the publisher simply bolds subheadings, which make for a poor accessibility experience.

SEO-Tip: Search engines use headings and their hierarchy to understand a page’s content and rank it.

2. No Visible Focus

Whenever a link, image, or form field is selected—in other words, in focus—that selection must be clearly visible to the user, including using high contrast colors. Make sure users can tab through selections using their keyboards.

3. No Alternative Text for Images

“Alt” tags, or alternative text tags, are HTML tags that are often overlooked when embedding images on a page.

When properly implemented, alt tags appear whenever an image breaks or does not load, and they can be read by screen readers. For visually impaired users, alternative text is essential.

SEO-Tip: What’s more, alt tags are standard best practice for strong SEO rankings. Using keyword-rich alt tags help your images rank, increasing traffic to your site.

4. Low Color Contrast

Users with color blindness, low vision, and macular degeneration require sufficient color contrast to use a website.

From WebAIM:

“WCAG 2.0 level AA requires a contrast ratio of 4.5:1 for normal text and 3:1 for large text…Large text is defined as 14 point (typically 18.66px) and bold or larger, or 18 point (typically 24px) or larger.”

You can download the Colour Contrast Analyzer to test your site yourself.

5. Inaccessible Forms

Especially for businesses where lead generation or customer service is essential (so, every business then, right?), your forms must be up to proper standards.

Form labels must be associated with their respective input field. You can also use the “title” attribute if the label is not available.

HTML5’s new attribute “fieldset” allows for better markup for accessibility, and should be included in all forms.

Conclusion

While the new ADA web accessibility standards may be another year away, we hope you don’t put off the task of improving your website or app. A typical web project takes anywhere from 6 to 9 months to complete, therefore you might want to anticipate how quickly your site will fall short with these new standards coming into play. Twenty-percent of your business might have a disability that could impact their ability to connect with you. From both a moral and financial perspective, you can’t afford to let your website fall behind.

Want to find out if your website is up to code? Contact us today for a consult.

Accessibility in Web Design: What It Is and How to Implement It