Understand the Web Content Accessibility Guidelines

 

Also known as WCAG, the Web Content Accessibility Guidelines provide the framework for everything you should do to make your site accessible to all.  Providing website accessibility to all is not only the right thing to do.  It is also required under many laws that apply to disabilities in the United States and around the world. Wouldn’t you want to reach the widest possible audience with your website message?

Following the guidelines will make your content accessible to a wider range of people with disabilities, including visual, auditory, learning, cognitive, motor and other disabilities or combinations of disabilities.  Adopting and following the WCAG guidelines will also make your Web content more usable in general.

It just makes sense, doesn’t it?  If you make your site usable by those with disabilities, you broaden your reach considerably. More people landing on your site and having a great experience will be good for your bottom line.

 

WCAG Principles Should Guide Your Design Choices

 

The initial version of the WCAG were published in May 1999.  The Web Content Accessibility Guidelines is  now on version 2.0, which was published in December 2008.  WCAG is broken down into four principles which include:

  • Perceivable:  the site and the information on it must be presented in a way that users can perceive.
  • Operable:  the site and all of its navigation need to work under a variety of different circumstances.
  • Understandable:  the site, how its navigation works, and all of the information on it must be understandable to site visitors.
  • Robust:  the site must feature content that can be read and used by many different user agents, including assistive technologies.

 

These broad principles can be applied to any website online, not just those using WordPress.  While our suggestions may speak generally about some measures you can take to improve any site’s accessibility.  Our goal is to make our suggestions as WordPress as specific as possible.

Keeping that in mind, the remainder of this post will be divided by the four principles listed above.  It will also offer specific ways you can achieve accessibility for your WordPress site.  Doing this will sometimes use plugins, external services or programs and much more.  While we may not hit every single guideline recommended in the WCAG, we will try to include as many as we can here.

 

Make Your Site Perceivable

 

Are your site visitors able to perceive all the elements on your site, regardless of their disability?  The WCAG offers these guidelines to ensure that your site accommodates the individual needs of all of your visitors.

 

Provide Text Alternatives

 

You need to provide text alternatives for every non-text type of content.  Photos must be described, because text can be turned into speech.  Alternate text forms such as large print and braille can also be supported. 

The WorPress Accessibility Widget allows you to add a widget to your sidebar, exclusively for changing the text size on your site.  In addition the GSpeech plugin adds text-to-speech to any text on your site.  You can even set an audio greeting for your visitors.

To add text descriptions to each of your images, you just need to use of the “alt” tag.  This can be done manually, however the SEO Friendly Images plugin adds the right title and alt attributes to all of your images for greater accessibility, of course, and greater search engine optimization.

 

Provide Media Alternatives

 

Provide alternatives for other time based media such as audio and video recordings.  These can be supported with text transcripts, captions, or an audio only track describing video content. 

 

Provide Easily Comprehended Content

 

Provide content that is easier to see and hear.  Also don’t rely exclusively on color to highlight a page element you want more noticeable for users. 

It’s important to offer high contrast color schemes to aid those who are visually impaired.  An easy way to accomplish this is by using the WP User Stylesheet Switcher.  This plug-in allows each visitor to click on a dropdown menu to select a high contrast stylesheet and will make the content easier to read.

A plugin like EsAudioPlayer adds a simple accessible audio player to your site so you can embed audio content allowing those using text browsers download audio files.  The Player is also designed to work with screen readers, whose users can select the play and stop buttons easily.

 

Provide Text Resizing Capabilities

 

Provide text resizing capability allowing large text options and the ability to resize text up to 200% without compromising function.  This ensures that users can read everything on your site clearly.  Avoid using images of text, it’s better to use plain text to meet the accessibility needs of your visitors.

The Zoom plugin makes it easy for your users to resize predefined areas of your site.   Using this plug-in you can set minimum and maximum resizing percentages and apply it to specific classes, IDs, and tags.

 

Make Your Site Operable

 

Does your site work well in a variety of different ways?  Can it be accessed from a number of different devices and does it take into account the needs of assistive technology?

 

Provide Keyboard Accessibility

 

Make it possible for visitors to perform every task on your site using their keyboard.  You must also ensure that there are no keyboard traps.  These traps are spots on your site where visitors are unable to navigate away from using their keyboard.

One solution is to install Accessible Dropdown Menus which allows site visitors to access your menus via their keyboard alone.  You can also use Accessibility Access Keys to create site-wide access keys to make for user navigation on your site easier. This is helpful for bypassing those keyboard traps mentioned above.

 

Provide Users With Sufficient Time

 

Provide users with enough time for reading and navigating through your content.  If you use time limits, allow users to turn them off or allow for extensions.  This would work for most content, however if there’s a real time component in play such as an auction. 

Also, moving content using auto-scroll or auto-updates should be presented either in conjunction with non-moving content or the function can be turned off.  Since autoscroll isn’t a feature that’s built into WordPress, you don’t have to worry about this one.

In the name of accessibility, it might just be best to avoid plugins that offer this feature altogether.  Infinite scroll, a feature that automatically loads new content when you reach a page’s footer is sometimes built into themes.  The auto update feature could possibly throw off screen reader functionality, so watch for that as well.

 

Provide Visitors With Seizure Free Content

 

Provide content that will not induce a visitor to have a seizure.  Content on your site shouldn’t flash more than three times per second.  Steer clear of those manic animated gifs, though that’s what you should probably do that anyway!

 

Provide Clear Navigation

 

Provide your visitors clear and distinct navigation for your site.  Ensure that you have clear titles, sequential ordering, contextual linking, multiple link paths, and descriptive headings.  An SEO plugin can help to achieve these accessibility points.  SEO requires that your content be clear and offer logical navigation.

Try installing a plug-in like WordPress SEO by Yoast or All-in-One SEO Pack to add prompts to your post editor for customizing page titles, descriptions, metadata, and more.  You’ll also want to create a sitemap, which the search engine will love.  Screen readers can also use them to allow for quicker site navigation.  Use a plugin like Google XML Sitemaps to generate a sitemap.

 

Make Your Site Understandable

 

Make your site understandable.  Is your site’s content and navigation clear for all visitors?  Can your content be understood by visitors with little to no explanation?

 

Provide Readable Content

 

Provide content that is readable.  Your content should be written in a clear and concise manner with the language clearly identified.  The site content should easily be read aloud by a computer screen reader.  It’s also a good idea to define jargon, difficult terms, and abbreviations.

It’s quick and easy to add a glossary to your site using the CM Tooltip Glossary plugin.

 

Provide Web Pages That Behave

 

Provide web pages that behave and look like what we expect.  Your site content needs to fit it’s headlines and links.  Your navigation should be predictable, easily followed and look the same on each of your sites pages.

WordPress is designed to support logical navigation, though custom menus may also be used.  Ensure that your site offers the clearest link options that are possible.

 

Provide Input Assistance

 

Ensure that input assistance is included.  If spelling or typing errors are made, offer suggestions or automatic corrections.  Provide clear instructions for areas that require user input and implement an error prevention system that lets users reverse, double check, and confirm submissions.  This is especially important if the submissions include financial or legal data.

To make this easier you might want to use something like Submittable.  Along with its WordPress plugin Submittable allows site visitors submit a variety of file types.  The automated system requires confirmation before the entry is submitted.

 

Make Your Site Robust

A robust site is one that has covered all the bases.  Does your site meet the needs of as many people as possible in as many ways as possible?

Your site needs to offer compatibility with assistive technologies.  Your HTML needs to be clean with start and end tags, no duplicate attributes, and unique IDs.  You need clear headers and paragraph elements so the content appears as it should on screen readers. 

You should avoid intricate HTML which could create problems.  If you want to add style to your site, CSS is the method to embrace.

 

WordPress Accessibility

This plugin merited its own section here because it covers so many of the guidelines mentioned above and only takes one plugin to it. WP Accessibility offers a wide variety of features, all designed to make a site meet the WCAG by modifying your WordPress theme.

 

 

WordPress Flexibility Dominates

 

WordPress is the premier content management system used for building sites on the World Wide Web.  WordPress has been aptly described as a “factory that makes webpages.”  It stores your content allowing you to create and publish webpages.  The only additional components needed are a web domain and a hosting site to make it work.

 

WordPress has Great Flexibility for Web Design

 

The flexibility of WordPress comes from it’s unique web template system which uses a template processor.  It’s flexibility for developers is mostly associated with blogging but supports other types of web content including more traditional forums, media galleries, online stores and myriad other types of websites.  Used by millions of websites, WordPress is the most popular website management system in use today.

 

Share This