Chances are that your website is already compliant with W3C standards. These rules will typically suffice, but new accessibility standards have taken center stage. Meet the Web Content Accessibility Guidelines, also known as WCAG 2.0.
WCAG 2.0 guidelines have been approved by top web developers, including those who have produced the brilliance behind CSS3 and HTML5. In this article, we’ll discuss WCAG 2.0 standards, as well as 7 things you can do to ensure that your website is on its way to meeting WCAG 2.0 and ADA Compliance requirements.
What is WCAG 2.0?
WCAG 2.0 was developed by people and organizations around the world in order to create a single shared standard for accessible web content. The guidelines lay out ways to bring web content to everyone, especially those with disabilities. The rules define web content as text, images, sounds, and script, as well as the overall presentation of content.
Forming the backbone of the guidelines are four key principles: web content must be perceivable, operable, understandable, and robust.
Why Accessibility Compliance is Important
As a company, one of your goals should be to provide the best experience for all of your readers, regardless of their limitations or disabilities. By following WCAG 2.0 guidelines, you’ll rest easy knowing that every single viewer can access and read your content. This provides a top-notch experience for everyone, which in turn reflects well upon your brand.
Of course, it’s not merely nice to have an accessible website; it’s the law. More than 20% of Americans suffer from a disability, and the government enacted the Americans with Disabilities Act (ADA) to ensure that they had reasonable access to all areas of public life, including the Internet.
Companies such as Hilton, Target, Bank of America, Safeway, and America Online (AOL) have been sued for non-compliant websites under an ADA lawsuit. In fact, more than 26,000 new ADA claims are filed against companies each year, and more than 240 businesses have been sued over website accessibility since 2015.
Ensuring Your Website is Compliant
While your website may be compliant in some aspects, it’s critical to ensure that your site is 100% compliant. Here are 7 steps you can take to provide the best online experience for all of your viewers, especially those who are disabled.
- Use Alt Tags for Images
In a world of heavy graphics-based content, it’s more important than ever to make these forms of content accessible. To start, ensure that all of your images have a meaningful alt tag. For example, when creating your company’s logo, don’t provide an alt tag that says “logo.” Instead, be more detailed by using a tag that spells out your company’s name as well as any other text in the logo, such as a slogan.
Alt tags are especially important for content-heavy graphics like infographics. Why? Because these tags are used by screen-reading programs to help those who are blind or who have other vision impairments know what is being presented.
Recent years have seen a boom in video-based content. Video can be useful for viewers of all types as long as you take the extra steps to make it accessible. To do that, you should always provide an audio description of what is being displayed in the video so those with vision problems can follow along. It’s also important to provide written text, such as closed captions, for each of your videos. This helps those who are deaf or hard of hearing clearly understand the message you’re trying to convey.
3. Use Text Descriptions for Hyperlinks
Most content uses text like “click here” to indicate to a user that something should be clicked. But, this text isn’t descriptive enough for someone who has visual impairments, in other words, anyone who may rely on using a screen reading program.
In order to meet WCAG 2.0 compliance for all hyperlinks on your website – including hyperlinked images – be sure to provide a text description by using the title attribute for your hyperlinks.
4. Use Proper Contrast Ratios
Everyone loves a colored background. It adds a touch of personality to your site. Unfortunately, using the wrong hues can present contrast issues for those who are color-blind. To check your website, you can use a free contrast checker tool that helps determine your website’s color (text) and background ratio.
WCAG 2.0 requirements are based on a 3:1 ratio for larger text and a 4:5:1 ratio for smaller texts. Since the numbers can be a bit confusing, just look at how your website appears visually (using the free tool) to see if it’s acceptable for someone who suffers from some form of color blindness.
Chances are, your website uses a “contact us” form. To ensure that those with visual disabilities can properly complete forms, be sure that there are HTML tags used to describe the form controls including:
- Buttons
- Check boxes
- Text fields
- Drop-down lists
If you use the default settings in a drop-down list, be sure to provide a description for each piece of information being requested. Simply displaying the response may confuse people.
6. Provide Text-based Document Formats
In the event that you link to any documents on your website, ensure that they are available in a text-based format such as HTML, Word, or rich text. This is important even if your documents are available as a PDF, since it’s the only way that screen readers can parse through the document and provide an audio-based rendering of it.
7. Provide a Skip Navigation Link
A well-designed website should have user-friendly navigation capabilities so that users can easily find other pages aside from the homepage. Also, be sure to provide a “skip navigation” link for those who are using screen readers.
Using this feature, you can direct screen readers to bypass navigation links and instead move to the content on the page. This allows people using screen readers to avoid having to listen to all of the links in the navigation each time they land on another page.
Accessibility for Improved User Experience
By incorporating these seven requirements into your website, you are well on your way to ensuring that it’s accessible to those with disabilities. When you take the initiative to make sure that your site is compliant, you can provide the best user experience possible for all visitors as well as avoid legal troubles that may occur.
Where to Begin?
With so much to consider when it comes to WCAG 2.0 and ADA compliance, it can be difficult to know where to even begin. Where do you focus your efforts? To start with, there are a number of free web accessibility checkers available online, like this one: https://achecker.ca/checker/index.php. There are plenty of other tools there, but this one will get you on your way to becoming WCAG 2.0 compliant.
Unsure if your website is fully compliant with WCAG 2.0 and ADA requirements? Our team of trained developers is ready to help!
