Like many blogs, ProfHacker runs on software called WordPress, and we’ve written many posts over the years about this software. WordPress is a great tool for creating a variety of different kinds of digital resources. An important issue to consider when creating a digital resource is how accessible it is to a diversity of users -- including, but not limited to, people with disabilities. (For a consideration of the various reasons why, read “Why: The Case for Web Accessibility.”) However, if you’re not especially skilled in what might seem like highly technical web design requirements, the issue of accessibility can seem overwhelming. Fortunately, the WP Accessibility plugin — developed by Joe Dolson — can help non-expert blog owners correct a variety of technical accessibility issues within many WordPress themes.
Below you’ll find
An overview of how to install and configure the WP Accessibility plugin, and
A step-by-step set of screenshots with instructions for installation and configuration.
Overview of the WP Accessibility Plugin
“WordPress Plugins are composed of php scripts that extend the functionality of WordPress. They offer new additions to your blog that either enhance features that were already available or add otherwise unavailable new features to your site.” -- “Managing Plugins,” WordPress Codex
If your site belongs to a network that already has the WP Accessibility plugin installed, you can follow along with the step-by-step instructions below. If, instead, you run your own WordPress site (or network), then you can first follow these instructions from the WordPress Codex on finding and adding new plugins.
The current version of the WP Accessibility plugin makes it easier to enact several accessibility improvements to a WordPress site. For a detailed explanation of the various improvements and how they affect accessibility, read the WP Accessibility Plugin documentation, which goes into more detail than these instructions do and which provides links to even more detailed information.
Step 1 through Step 6: Find and Activate the WP Accessibility Plugin
Follow the same process as you would for any WordPress plugin.
Step 7: Remove Title Attributes
Remove redundant title attributes from page lists, category lists, and archive menus.
Step 8: Add Skip Links
Enable skip links with WebKit support by enqueuing JavaScript support for moving keyboard focus. Add skip links with user-defined targets.
Step 9: Accomplish Several Other Tasks
- 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, and
- Custom admin stylesheet.
Step 10: Test for color contrast
Provide color contrast testing tool to compare colors against WCAG contrast standards.
Again, for more detailed explanations of how these improvements affect the accessibility of your WordPress site, read the WP Accessibility Plugin documentation..
Basic, Step-by-Step Instructions
- Click on any image to enlarge.
1. From your dashboard, click on the “Plugins” link in the lefthand column.
2. Scroll down the list of plugins until you see “WP Accessibility,” then click “Activate”
3. You should see the confirmation message “Plugin activated”
4. Under “Other Network Plugins” click on “Active”
5. Just under “WP Accessibility” click on “Accessibility Settings”
6. You’ll see a variety of different accessibility options
7. Remove Title Attributes
9. Miscellaneous Accessibility Settings.
10. Color Contrast Tester
Have you used the WP Accessibility plugin? If so, what has your experience been? Please share in the comments!