We have a lot of important objectives — from making sure a website is mobile and desktop friendly, to ensuring it is fast, looks good, and is user friendly. However, an important aspect that can often be overlooked is finding the right WordPress accessibility tools. Abilities that many of us may take for granted — like being able to use a mouse to scroll or being able to see a website properly — may not be the case for everyone.
Thus, it is extremely important to ensure that our websites are optimized for accessibility so as many people can use the sites as possible.
People who are visually impaired may not be able to interact with and use a website with lots of images, or people who may have difficulty using a mouse or keyboard may not be able to interact properly with your site’s navigation schemes. That is why the World Wide Web Consortium (W3C), the leading body that develops open standards for the internet, came up with the Web Content Accessibility Guidelines (WCAG).
This set of recommendations for making web content and websites more accessible.
The goal of WCAG is to have websites and web content include accommodations for people with visual, physical, or cognitive impairments across a variety of devices, from desktops to tablets and mobile phones.
Browsing through WCAG 2.1, there are many recommendations and actionable items that web developers should do, and it may seem a daunting task at first. However, there are several steps you can start with and take, from understanding what improvements you can make, to using accessibility ready themes and plugins to improve your site’s accessibility.
Here are five ways you can go about it:
1. Check current WordPress accessibility using WAVE (the Web Accessibility Evaluation Tool)
The first question is always where to begin? You have a site; how can you start making it more accessible? Fortunately, there’s several tools that can help with exactly that, and my favorite one is WAVE (the Web Accessibility Evaluation Tool). All you need to do is type your site in and WAVE opens up the website and annotates for you where it finds accessibility and Web Content Accessibility Guidelines (WCAG) errors.
Use this WordPress accessibility tool to audit your site before getting started.
You can get a myriad of important information such as detecting contrast issues (where there is low contrast between the text and background colors), detecting issues with alternative text for images (alternative text is a description of the images or what is displayed if images can’t load), shows empty links (where a link doesn’t contain text), and more!
It also tells you what accessibility features your webpage has, giving you a good baseline to work up from. And the best part is, all of these are annotated on the webpage, so you know exactly where the errors are and what to fix. WAVE is a fantastic tool to troubleshoot your existing websites for accessibility, know exactly where the issues are, and help fix them!
2. Use an accessibility-ready WordPress theme
What about starting off from scratch but with accessibility in mind from the very beginning? The best way to do that is to start with accessibility-ready themes! WordPress itself has a tag for themes that are optimized for accessibility: Accessibility Ready, which you can browse here. Before any theme can have the “Accessibility Ready” tag, it must meet certain requirements, ensuring it is actually accessibility ready.
Don’t overlook themes as you round up WordPress accessibility tools.
These requirements are inspired by WCAG and include proper heading structures, adequately contrasting color schemes, keyboard-navigable menus and navigation schemes, and more. Although there are not as many accessibility-ready options available from WordPress directly as there are other themes in general, but you can also filter through similar accessibility-ready themes on other online theme marketplaces, such as ThemeForest, and set up a site optimized from the very start for accessibility!
3.Use WP Accessibility to add helpful features
What if you already have a site up and running and want to now take steps to optimize it for accessibility? WP Accessibility is the go-to plugin for exactly that, a one-stop, multi-featured plugin with a huge variety of tools to help make your website more accessible.
Here’s a WordPress accessibility tool that gives you a ton of options for improving a site.
Here’s some of the features that WP Accessibility has:
Skiplinks: WP Accessibility helps add skiplinks to your pages that can help users using screen readers or keyboards to navigate pages to easily skip between sections of the pages they want to see. These skiplinks can be set to always visible or hidden unless tab is pressed.
Empty Search Error: Some themes return every post/page for empty or blank searches, but this would force an error and return nothing for an empty/blank search.
Link Underline: Forcing underlining of links to help make them more visible.
Outline Elements using keyboard: You can use this to put an outline around links when the tab key is used to navigate within a page.
Accessibility Toolbar: Adds a toolbar to the left of the screen that allows the user to adjust the text size and switch to a high contrast version of the site.
Remove title attributes: These are often redundant and screen readers read both these and the text in case of images/links, thus WP Accessibility removes them to make it less cluttery.
These are a few of many other features and tools WP Accessibility contains and it can be a wonderful tool in helping make your site more accessible and user friendly than before!
4. Use Accessibility Widget to change text size
Another awesome and to the point plugin is Accessibility Widget, which allows you to add a widget in your sidebar, footer, or wherever you want to have widgets, that changes the text size on the click of a button.
As you evaluate WordPress accessibility tools, don’t overlook basic stuff like text size.
Within it, you can define which HTML/CSS tags to resize and set the list of sizes to choose from as well. Once set up, the widget appears with the predefined list of text sizes to choose from on the click of a button. All in all, Accessibility Widget is very easy to use, user-friendly, and does the job extremely well!
5. Use ResponsiveVoice Text to Speech to convert a page into audio
Another awesome accessibility plugin is ResponsiveVoice Text to Speech, which, as you can probably guess from its name, creates an audio clip of the text on your page or post. An extensively customizable plugin, ResponsiveVoice allows you to choose between 80+ different voices, gives you the ability to select which text to read out, add in an “end-of-page” message which is played when the user reaches the end of the page, add in an exit intent message when a user scrolls away from the page to the toolbar/address bar, speak out paragraphs using CTRL-UP and CTRL-DOWN keys, and much more.
Converting text to audio is a powerful feature, thanks to this WordPress accessibility tool.
ResponsiveVoice is also not restricted to widgets only, but you can use both shortcodes or HTML to have a button display on your site, which could either be anywhere on any page or post, above or between text, or in the sidebar or footer as a custom widget itself. With this, your users can now get an audio clip of the text just by clicking a button, making your site more accessible for those who might not be able to read the content properly.
Closing thoughts on WordPress accessibility
These tools and plugins, although not an extensive list of all possible ones that can help with accessibility, can immensely help you either get started with making an accessible website or troubleshooting your current sites and optimizing them for accessibility.
From accessibility ready themes to troubleshooting using WAVE and using accessibility plugins, there are lots of actionable steps you can take as a web developer to improve your sites’ accessibility.
If you have an existing website and would like my team at Abstract Hub to help review and optimize the site for accessibility, reach out to us today! Do you have any favorite tools and plugins to share on optimizing for accessibility? Feel free to share below! Happy WordPress-ing!
