Adherence to website accessibility standards can improve usability for everyone, enhance user experience, build brand loyalty and encourage conversions. Read on to make your WordPress website accessible and ADA Section 508 compliant.
The WordPress community has worked to make the CMS ADA compliant. A WordPress accessibility team is in place, with Accessibility Coding Standards outlined to ensure that new and updated code for the open source WordPress core conforms with Web Content accessibility Guidelines (WCAG) at level AA. However, if you’re using a third-party theme or any plugins with your WordPress site, it likely fails to meet WCAG web accessibility standards.
Here’s what you can do to improve your WordPress site’s accessibility.
Testing
After you complete development of your site or have put your plugins in place, audit your site for compliance to the WCAG guidelines. See our list of preferred accessibility testing tools.
Working with an Existing Site
If your goal is to make an existing site more accessible, you have options.
Plugins
Several plugins in the WordPress repository can improve the accessibility of an existing site and theme. These help with adding skip links, ensuring focus states are visible, providing a widget for high-contrast, and enforcing alt attributes on images. No plugin solves all issues, but many WordPress WCAG accessibility plugins help with some of the most common errors.
Update Your Code
For full compliance, you may find you need to modify your theme and visual design.
Starting from Scratch
If you’re building a new WordPress site or starting a redesign, make your development team understand that your site must be universally accessible. Your people need to know this requirement before they make any decisions, including those involved in coding practices, themes and plugins. Design for accessibility from the start.
If your team is developing a custom theme, they can refer to the WordPress Theme Handbook section on accessibility requirements and guidelines. The handbook outlines what’s required for a theme to be tagged “accessibility-ready” within the WordPress Theme Repository. While your custom theme may not land in the repository, the handbook provides a good checklist for an accessible foundation for your site. Your team can also reference this pattern library, put together by the WordPress Accessibility Team.
Accessibility-Ready Theme Requirements
- Keyboard Navigation: The site must be navigable via the keyboard, with no need for mouse interaction.
- Controls: Appropriate semantic HTML elements are used for site controls, such as <button>, <input>, and <a> elements.
- Skip Links enable users to bypass navigation and skip directly to content or vice versa.
- Forms must use appropriate and explicit field labels.
- Headings: Heading levels and content should follow a hierarchical structure without skipping levels.
- ARIA Landmark Roles: All content must be wrapped in at least one landmark role.
- Links in content must be underlined and links in navigational areas must be clearly distinguishable.
- Repetitive Link Text should be descriptive and meaningful. Avoiding “read more” and “click here.”
- Contrasts: All background/foreground colors should contrast sufficiently to pass the WCAG guidelines.
- Images: Themes must include alt attributes and/or the ability for the end user to add alt text.
- Media must be controllable by the end user. Sound and video must not auto-play.
- Screen Reader Text: Provide context for elements such as icons.
- The following are not allowed under the accessibility-ready tag: Positive tab index attributes, inclusion of the access key attribute, opening content in a new tab or window without warning the end user.
In addition to the above requirements, WordPress provides further recommendations for your accessible theme.
Summary
If a theme in the repository is marked “accessibility-ready,” the developers have gone to considerable length to consider accessibility. However, this distinction does not guarantee that your site will be accessible after content entry and customizations. You may need additional coding and content updates to improve your compliance. Start by testing to find the gaps.
If you’re still unsure about testing or remediation for accessibility, Northwoods can help.