Tips & Tricks to Make
Sure Your Website is
WCAG Guidelines and simple changes every user and developer
can implement to make their website accessible to those with
By: Angela Bergmann
Web Content Accessibility Guidelines
A wide range of recommendations for making web content more
accessible. By following the WCAG you will help in making the
content of your website more accessible to those with disabilities
Blindness & Low Vision
Deafness & Hearing Loss
And combinations of these.
WCAG 2.0 Guidelines
WCAG 2.0 has 12 guidelines that are organized into 4 principles:
Text Alternative for Non-Text Content
IE: Make sure you pictures, video’s etc have appropriate descriptions, titles,
Provide captions for video/audio.
Content can be interpreted whether formatting is on or off.
The structure of the website is consistent throughout and not controlled
through the stylesheet.
Content must have contrast from other portions of the website.
Ability to pause and play video.
If color has meaning (red meaning stop, green meaning go) then
additional descriptions should be provided.
No one should get stuck on a webpage because they do not use a mouse.
Ability to browse the website using keyboard shortcuts or screenreader
Content with a programmed time limit should allow the user to be able to
change the time restriction.
Three flashes or less. No flashing 3 times within a 1 second span.
Can easily navigate the website pages and links.
Titles for pages
Descriptive navigation links
Skip to content links
The language of a page is identified.
Content should be understandable to someone with roughly 9 years of
Pages should behave in expected ways.
Compatible With New Browsers & Assistive Technology
Correctly nested elements
Interface components are described and purpose identified
Wordpress and accessibility
WordPress on it’s own is decently accessibility friendly. There are
a few issues, but most of them can be fixed either by yourself or
through a plugin.
The issues are:
An empty search does not return an error unless told to by the theme
“Read More” links are not specific.
Redundant title attributes.
Plugins and themes
The vast majority of issues stem from the fact that there is no
accessibility check on themes and plugins.
Accessibility friendly themes and plugins are few and far
between, but they do exist.
A great resource for themes & plugins is:
The list cultivated by WP Accessible is by far the best I have
found, they have links to the following options through Github:
Accessible default Genesis child theme
Accessibility changes to the Twenty Twelve theme
WordPress Skeleton theme
Child theme for TwentyTenFive
There are several plugins out there to help in making your website more
Accessible Twitter feed widget for WordPress
Yoast WordPress SEO Plugin
Fast Secure Contact Form
Captcha by BestWebSoft
Ozh’ Admin Drop Down Menu
MCE Accessible Language Change
Faster Image Insert
Remove redundant title attributes from page lists, category lists, and archive menus.
Add skip links with user-defined targets.
Add language and text direction attributes to your HTML attribute
Remove the target attribute from links.
Force a search page error when a search is made with an empty text string.
Remove tabindex from elements that are focusable.
Strip title attributes from images inserted into content.
Add post titles to standard “read more” links.
Add a :focus outline to focusable elements.
Toggle for high-contrast and large font stylesheets
Custom admin stylesheet
Provide color contrast testing tool to compare colors against WCAG contrast standards