User experience (UX) is a significant factor when designing a WordPress site that converts traffic into leads and sales.
Websites that are easy to use keep visitors coming back, rank better in search engines, and can, in turn, improve your business’s bottom line with increased sales.
But what does “easy to use” mean? Is there a standard for measuring your website’s usability?
This post answers these questions and more.
First, we’ll discuss the importance of website accessibility, a key component of UX and overall usability, and the benefits of making accessibility on your website a priority.
Then, we’ll highlight some of the best plugins and themes to help improve accessibility in WordPress. Let’s get started!
The Importance of an Accessible Website
In today’s digital-first environment, web accessibility is increasingly important.
An accessible website works for all people, especially people with disabilities and those who use assistive technology to navigate the web.
A website that is only accessible to a particular group of people limits your reach and, in turn, revenue. The World Health Organization World Report on Disability found that more than 1 billion people, or 15% of the world’s population, have a disability.
In the United States, 1 in 4 adults has a disability, and people with disabilities have significant disposable income that they can spend on discretionary purchases.
So if your website works for people with disabilities, you’ll have access to a group with more than $490 billion in after-tax disposable income who could become your customers.
In addition to increasing your potential reach and conversions, website accessibility is frequently required by law.
More than 40 laws worldwide require website accessibility for government agencies, nonprofits, educational institutions, and for-profit businesses.
Commonly cited laws that require for-profit companies to have accessible websites are the Americans with Disabilities Act (ADA) and the Accessibility for Ontarians with Disabilities Act (AODA).
If you don’t have an accessible website, under these laws, you risk facing lawsuits from users with disabilities who cannot use your website or fines from the government.
How to Measure Your WordPress Site’s Accessibility
If you’re new to website accessibility, it can be hard to know where to start.
Luckily for designers, developers, and content creators, there are measurable guidelines to ensure your website has positive UX and works for most people worldwide: the Web Content Accessibility Guidelines (WCAG).
The Web Content Accessibility Guidelines are internationally agreed upon standards for ensuring that websites work well for people with disabilities and people who use assistive technology.
When building or editing your website, the best practice is to adhere to the guidelines outlined in the current version of WCAG, striving to meet at least WCAG 2.1 AA compliance.
Doing so helps ensure you’re being socially responsible and building an accessible website that is inclusive to everyone while meeting your legal requirements for accessibility.
Examples of Website Accessibility Features
What does an accessible website consist of, though?
There’s a wide variety of factors to take into account. We recommend reviewing the WCAG guidelines for a full rundown of needed features. However, some of the most important include:
- Menus, links, and all interactive elements are keyboard accessible – no functionality on your website should require a mouse.
- A visible outline around all focusable elements makes it clear where the focus is when using the tab key to move through the site.
- Alt text for images that adequately describes their purpose on the page to people who cannot see them.
- Color contrast allows people with low vision or on a mobile phone outside on a sunny day to distinguish text from its background.
- Skip links that allow a keyboard user to bypass the navigation and jump directly to the content on the page.
- Captions on videos for people who are Deaf or hard of hearing and transcripts for both videos and audio files.
- Headings are in the correct numerical order to create a meaningful outline of the content on the page.
- Links are not ambiguous and have meaning outside the surrounding text (I.e., don’t use “click here”).
It’s also worth noting that, beyond social responsibility and a better UX, an accessible website can provide performance benefits. In addition to improved SEO, website accessibility can lead to faster loading times and better Core Web Vitals scores.
6 Plugins to Help Make Your WordPress Site More Accessible
Now that we understand the importance of building an accessible website, it’s time to dive deeper into how to go about it.
The good news is that achieving web accessibility isn’t overly complicated.
Plus, as a WordPress user, you have the advantage of being able to use plugins and themes to make the process easier.
Let’s look at five plugins and themes you can use to improve the accessibility of your WordPress site.
Equalize Digital Accessibility Checker
Whether you’re new to website accessibility testing or a trained accessibility tester, Equalize Digital Accessibility Checker is an excellent tool for speeding up the identification of accessibility problems across your website.
Accessibility Checker has a free version that puts accessibility reports on the edit screen of every post or page so you can identify accessibility problems as you create content and before you hit publish. It scans unlimited posts and pages and doesn’t require per-page fees or costly API integrations.
Accessibility Checker Pro is well-worth upgrading to and includes:
- Scanning of custom post types
- Full-site scanning on a weekly or monthly basis
- A centralized report of all issues site-wide
- A log of “ignored” or dismissed issues
- Admin columns for quickly seeing at a glance which posts and pages have accessibility problems.
- And more
In addition to building Accessibility Checker, the team at Equalize Digital also runs the official WordPress Accessibility Meetup. Equalize Digital prides itself on providing quality support to developers and website owners striving to make their WordPress sites more accessible, as shown by the plugin’s 5-star rating.
Check out our full review of Accessibility Checker to learn even more about it.
WP Accessibility
Another popular and helpful WordPress plugin you can use to fix some common accessibility problems on your website is WP Accessibility.
This free plugin, created by WordPress core contributor and accessibility team member Joe Dolson, is intended as a bridge to resolve issues created by less accessible themes or plugins.
Some common accessibility problems that this plugin can fix include:
- Add labels to form fields
- Add post titles to “read more” links so they won’t be ambiguous
- Enable skip links if there are none coded in the theme
- Remove user-scalable=no to allow resizing.
- Block all links from opening in a new window or tab
- Add user controls for text resizing and high contrast modes
This 5-star-rated plugin is free to download and use. After you install and activate it on your website, you can configure the settings and features under Settings > WP Accessibility.
Screen Reader Text Format
If you’re building your WordPress pages in the block editor, this plugin is a must-install! Screen Reader Text Format adds a “screen reader only” text format control to the block editor so that content creators can easily add hidden screen reader text as needed without having to switch to HTML mode.
Screen reader-only text is the text that is visually hidden for sighted people, but that can be read out to a blind person by a screen reader.
Use this plugin, for example, to add extra context to ambiguous links: a sighted person would only see a “learn more” button, but a screen reader user would hear “learn more about our products.”
From the team at Reaktiv, this plugin is relatively new but tops our list of hidden gems in the WordPress.org plugin repository.
Accessibility New Window Warnings
This handy plugin helps websites comply with WCAG Success Criterion 3.2, which specifies that web pages should appear and operate in predictable ways.
It does this by providing an advanced warning if a link will open a new window or tab before the user clicks or activates it.
There are no settings to configure. Activate Accessibility New Window Warnings, and it will automatically find all links that open in a new window and add the following three fixes to each link:
- A new window icon after the link text denotes that the link opens in a new window for sighted people.
- A tooltip, visible on hover, that says, “opens a new window.”
- Hidden “opens a new window” screen reader text will be read out to blind or visually impaired people using screen readers immediately following the link anchor text.
The plugin is available for free on WordPress.org. It’s from the Equalize Digital team, and when activated, all “link opens in new window or tab” warnings in Accessibility Checker will be automatically resolved.
Gravity Forms
Gravity Forms is a premium forms plugin that is leading the way when it comes to accessibility.
Many accessibility problems on websites come up from poorly built web forms that are missing adequate labels or don’t work for screen readers and keyboard-only users at all.
In recent years, the Gravity Forms team brought in an outside accessibility specialist to audit the output of their forms and ensure that forms built with their plugin will be as accessible as possible.
In addition to making their plugin free of accessibility errors, they added accessibility guidance in their form builder. This guidance makes it easier to know you’re building forms accessibly and not making common accessibility mistakes, even if you’re not an accessibility expert.
We previously reviewed Gravity Forms; you can learn more about how Gravity Forms works here.
One Click Accessibility
Despite its name, the One Click Accessibility plugin is not your site’s complete web accessibility solution, but it is a popular plugin from the Elementor team with more than 100,000 installs.
It is a tool for quickly adding some accessibility features to your WordPress site.
With One Click, you can:
- Enable “skip to content” functionality
- Add an outline focus for focusable elements
- Remove the target attribute from the links on your site, so they open in the current tab
- Add landmark roles to all links
It also includes a toolbar with user controls for fonts, contrast, and adding link underlines features. The features of this plugin overlap in many ways with those of WP Accessibility (listed above), so you would want to choose one or the other and not install both on your site simultaneously.
Because this plugin comes from the Elementor team, it may be a good choice if your website is built with Elementor.
Accessibility Ready WordPress Themes
If you’re unsure whether or not your current theme is considered accessible, try navigating it using only your keyboard.
Turn off your mouse, stick it in a drawer, and see if you can do everything you want your customers to do on your website with only the tab, return, and arrow keys on your keyboard.
If you can easily engage with your website with a keyboard alone, then your theme developer paid attention to accessibility.
On the other hand, if you’re unable to browse through the dropdown menus, select certain links, or can’t track where your focus is because the outline is missing, it likely means your theme is inaccessible.
In this case, you’ll either need to hire a developer to fix the issues in it or choose a new theme.
If you want to build an accessible WordPress website or are choosing a new theme, the best place to start is with an “Accessibility Ready” theme.
Themes labeled as Accessibility Ready in the WordPress.org plugin directory have undergone extra auditing and meet minimum standards for accessibility set by the theme review team.
It’s important to note that “Accessibility Ready” does not guarantee that the theme meets WCAG AA guidelines. Still, these themes are a better starting point for any new website than a theme without the tag. Currently, there are 99 themes tagged as Accessibility Ready on WordPress.org.
Jace
The Jace theme is the first Full Site Editing theme tagged Accessibility Ready on WordPress.org.
This free theme has over 60 block patterns, all of which are from the WordPress pattern directory.
In addition, Jace includes an optional light color scheme, blog layouts, about pages, contact pages, a sticky header, social sharing, full-screen headers, buttons, and list styles.
So if you’re interested in trying out full-site editing and want to start from an accessible theme, Jace is the way to go.
Twenty Twenty-One
Twenty Twenty-One is a newer version of the default WordPress theme.
It’s flexible, fully responsive, and with more than 1 million active installs, is one of the most popular options for accessibility-ready themes available in the WordPress Themes Directory.
When you use a default theme released by the core WordPress team, such as Twenty Twenty-One, you know it was developed following WordPress and accessibility best practices and guidelines.
WebMan Design Themes
If you’re looking for a collection of free and premium WordPress themes by a developer who specializes in accessibility-ready themes, check out the themes offered by Oliver at WebMan Design.
WebMan Design creates WordPress themes and plugins used by thousands of websites worldwide. Many of his themes are accessibility ready and are disability, keyboard, and screen reader friendly so that you can build your website for everyone.
Oliver was awarded the WP Requirements Compliant badge by Envato Market (ThemeForest) and is a member of the Trusted Authors Program at WordPress.org.
Astra
Astra is a theme with both a free version on WordPress.org and a premium version.
Though free Astra in the WordPress plugin directory does not have the Accessibility Ready tag (because they have not gone through the additional review process), the Astra theme does meet base standards for accessibility.
As their change logs note, the Astra team is constantly making accessibility improvements with every released update, which is terrific.
Astra is a good option if you’re looking for an accessibility-ready theme that will work with various builders, from the core block editor to Elementor or Beaver Builder.
Just be careful of their starter templates which frequently have skipped heading levels and color contrast errors you’ll need to resolve.
Wrapping it all upβ¦
Website accessibility and useability, especially for people with disabilities, is not just the right thing to do; it’s also good for business.
Your WordPress site should comply with WCAG guidelines to meet your legal requirements for accessibility and reach the most extensive possible customer base.
Taking accessibility into consideration can help your website rank better in search engines. Accessibility will make it easier for customers to complete purchases, submit an inquiry, or email signup form on your website.
Whether you build websites for yourself or clients, you can’t ignore accessibility. But, if you don’t know where to start, the good news is that there are plenty of plugins and themes to help.
In this post, we discussed ten WordPress plugins and themes that can help you build an accessible website:
- Equalize Digital Accessibility Checker: A plugin that scans your WordPress site for accessibility problems and puts reports on the post edit screen.
- WP Accessibility. A WordPress plugin that can help resolve common accessibility problems in themes and plugins.
- Screen Reader Text Format: A no-code plugin that makes it easy to add hidden screen reader text in the block editor.
- Accessibility New Window Warnings: A plugin that automatically adds warnings to all links that open in new windows or tabs.
- Gravity Forms: A premium forms plugin that makes it easy to build accessible forms in WordPress.
- One Click Accessibility: A popular plugin for resolving accessibility issues from the Elementor team.
- Jace: The first Full Site Editing theme is tagged as Accessibility Ready on WordPress.org.
- Twenty Twenty-One: A recent Accessibility Ready theme from the core WordPress team with over 1 Million active installs.
- WebMan Design: A collection of free and premium Accessibility Ready themes with many design options from an independent developer.
- Astra: A theme with a free and pro version that integrates with popular page builders and is constantly getting accessibility enhancements.
In addition to trying out these tools, we recommend attending a WordPress Accessibility Meetup via Zoom or checking out the free WordPress Accessibility Day conference to learn more about making your website accessible.
Do you still have questions about website accessibility? Ask your questions in the comments section below, and we’ll do our best to answer them.
3 Responses
There is also of course the great toolbar for accessibility, called AccessibleWP. I highly recommended using it.
Thanks for sharing, Douglas. You’re referring to the plugin below, correct?
As it mentions in its description, “this plugin aims to solve challenges in the accessibility of WordPress sites, it does not cover all the guidelines required according to the WCAG but helps to reach it.”, so it seems like it’s worth a look alongside the other plugins in this guide.