WordPress Accessibility: Themes, Plugins, and More
WordPress is the foundation for many websites. Major online publications, ecommerce sites, blogs, and others are using it because of its ease of use and the user base continues to grow year after year.
And while many website owners take great care to select the right theme for their website and improve their SEO and page load times, very few of them actually pay attention to the accessibility of their websites.
Considering that in the United States alone, 54% of all disabled adults use the internet on a daily basis, accessibility is an issue that shouldn't be ignored. The numbers become even more staggering when you consider the number of users with a disability on a global scale.
Whether you want to use WordPress to run an online store, a business website, or a lifestyle blog, there is no reason to exclude a significant amount of internet users and avoid making your site accessible. Thanks to the WordPress Accessibility Team, creating accessible websites is getting emphasized (and prioritized) more often.
Is WordPress Accessible?
The standalone version of WordPress wasn't always accessible. This is not so surprising considering the open source nature of the CMS and the sheer amount of people who contribute to it on a daily basis. Just over five years ago, internet users who relied on assistive technology or keyboard interaction had a considerable amount of trouble navigating the admin screen in WordPress.
However, since then the situation significantly improved thanks to the efforts of the Make WordPress Accessible Team, a small group of volunteers who work together to improve the accessibility. As a result of their work, the admin area is a lot more accessible to include the Media Library and the Theme Customizer which were the biggest offenders. Various keyboard shortcuts that speed up editing and formatting of posts and pages have been introduced into the WordPress core as well.
Even the default themes that come with the WordPress installation such as TwentyFourteen, TwentyFifteen, and TwentySixteen are accessibility-ready. On top of that, all new functionality introduced into the admin area goes through an accessibility review to ensure WordPress improves even further and becomes easier to navigate for users with a disability.
Their work met a major milestone in March 2016, when the WordPress Accessibility Coding Standards were approved and added to the Core Handbook as a part of the code standards which WordPress developers must meet when contributing to core. This includes both themes and plugins as well as contributions to the WordPress core itself.
With that in mind, it's worth mentioning that nowadays, most accessibility issues don't come from WordPress itself, but from themes and plugins developed by third-party developers.
Themes and Accessibility
At the time of writing this article, there are 113 themes in the official repository which are accessibility-ready. Thanks to the efforts of the MWAT team, there is an optional accessibility audit built into the theme review process. Any theme developer submitting themes into the official repository can apply for an accessibility-ready tag. The accessibility audit reviews the themes against a number of guidelines, which are available in the Theme Review Handbook. The official WordPress Codex includes a lot more details about accessibility as well.
Here are the main key points to keep in mind when it comes to accessibility:
- Use headings to define a page's sub-sections.
- You should only include one h1 tag per page.
- Links should be descriptive and should make sense out of context — for example, use "Continue Reading 'Title of the Post'" instead of "Read More".
- Make sure buttons and menu items (to include drop-down menus) can be selected and highlighted with both keyboard and a mouse.
- Use high-contrast colors for your text and background — black text on white background rather than light gray text on a gray background.
- Don't rely solely on colors to differentiate links and buttons from the rest of the content.
- Include skip links at the top of each page to allow direct navigation with only a keyboard.
- Use the title attribute for links only if the corresponding text is not redundant when viewed side by side.
- Use labels outside the form fields and make sure warning and confirmation messages are easy to recognize.
- Use descriptive ALT tags, captions, and titles for all images and icons included in the theme and on your web pages.
- Media elements such as video, audio, sliders or carousels should not be set to autoplay or otherwise change action without user interaction.
- Avoid setting links to open in a new window or a tab without user interaction or at least consider including a description so the users know what will happen.
- Provide a description of any downloadable media such as PDFs, documents, audio or video content as well as any buttons that might trigger the download.
Although the accessible-ready themes in the official repository are a great way to ensure the theme meets all of the WordPress coding standards, in reality, most WordPress users will opt for third-party premium themes which can be bought on various theme marketplaces or they will opt for a custom design.
If you're a developer who wants to build an accessible website, there are a few resources that can serve as a starting point for your design:
- Underscores: developed by Automattic, this theme serves as a starting point for most of the themes available on WordPress.com and includes accessibility-ready features.
- Tiny Framework: this theme can be used as a learning tool or as a starting point in your design. It helps you understand how to extend parent themes and build your own child themes, along with all the accessibility features included.
- Genesis by StudioPress: a well-known premium framework with plenty of child themes that includes accessibility-ready features.
- Simone: a free theme available on the official repository which was developed by Morten Rand-Hendriksen, an accessibility advocate.
Plugins and Accessibility
Plugins allow anyone to add extra functionality to their website. They can help WordPress users block spam, prevent hacking attempts, improve SEO, include social media sharing capabilities, and much more.
Like themes, plugins can be submitted by anyone, and they also go through a review process. Until recently, there was no requirement for the code released into the official repository to take accessibility into consideration. Plugins didn't have the optional accessibility audit and as such, there are still many plugins in the repository that can involuntarily compromise the accessibility of your website. Examples include sliders or carousels that are set to autoplay/auto advance or that break with keyboard interaction or contact forms where labels aren't linked to input fields.
Ironically, though, there are also WordPress plugins which can help you improve your website's accessibility:
- WP Accessibility: fixes common accessibility issues in your WordPress site such as providing keyboard focus, removing tabindex which can cause weird navigation issues, preventing links from opening in other windows, and more.
- Skip To: enhances the accessibility of your website for keyboard and screen reader users by providing a dynamically-generated and highly-configurable menu of the most important places on the page.
- Accessible Poetry: adds various accessibility options which include skip links, font-sizer, contrast changer, custom toolbar, and more.
- Accessible Video Library: generates a library for your video information where you can upload caption files, include transcripts, and upload subtitles for other languages.
- Zoom Widget: enables site users to resize the predefined areas of the website.
- MCE Accessible Language Change: adds language change button in the WordPress WYSIWYG editor.
When it comes to WordPress and accessibility, there's plenty of information available on the web. If you'd like to learn more about it, here are some good places to start your research:
- Making Accessible WordPress Themes: a presentation by Joseph Karr O'Connor from 2013 WordCamp held in Montreal. The presentation covers accessibility in general and how it applies to WordPress, including creating accessible plugins, themes, widgets as well as making your content more accessible.
- WordPress Development Tools and Accessibility Plugins: a list of tools and resources provided by Make WordPress Accessible team which help you test and implement accessibility features on your websites
- Web Content Accessibility Guidelines (PDF): official guidelines on accessibility for web developers published by Global Alliance for Accessible Technologies and Environments
- Make WordPress Accessible Homepage: the official blog of MWAT where you can read the latest news and even get involved to help make WordPress more accessible
- Accessibility for WordPress: a paid course available on Lynda.com helps you make sure your website meets modern accessibility standards with a broad introduction to accessibility followed by practical steps to make sure your WordPress themes, plugins, and content are accessible.
Accessibility Is a Shared Responsibility
Even though WordPress has seen major improvements in terms of accessibility, there's still a lot of work to be done. It's up to each and every developer to keep the standards in mind and to ensure they follow the best practices to make WordPress websites accessible to everyone.
Further Reading and Resources
We have more guides, tutorials, and infographics related to WordPress:
- You Get What You Pay For: WordPress hosting is free, but there are reasons why you might want to pay for it.
- How to Backup Your WordPress Blog: learn how to keep your website safe for those times when things go wrong.
- How Big is the WordPress Economy?: the WordPress economy is a lot larger and more varied than you probably realize.
How to Speed Up WordPress
For all your visitors, speed is critically important. No one wants to wait around for a webpage to load. Check out our infographic, How to Speed Up WordPress. Learn about databases, content delivery networks, and more.