5 Tools to Improve WordPress Accessibility

As net designers and builders, we’ve a whole lot of essential aims — from ensuring an internet site is cell and desktop pleasant, to making certain it’s quick, seems good, and is consumer pleasant. However, an essential facet that may usually be neglected is discovering the suitable WordPress accessibility instruments. Abilities that many people could take without any consideration — like having the ability to use a mouse to scroll or having the ability to see an internet site correctly — will not be the case for everybody.

Thus, this can be very essential to make sure that our web sites are optimized for accessibility in order many individuals can use the websites as attainable.

People who’re visually impaired will not be in a position to work together with and use an internet site with numerous photos, or individuals who could have problem utilizing a mouse or keyboard will not be in a position to work together correctly along with your website’s navigation schemes. That is why the World Wide Web Consortium (W3C), the main physique that develops open requirements for the web, got here up with the Web Content Accessibility Guidelines (WCAG).

This set of suggestions for making net content material and web sites extra accessible.

The objective of WCAG is to have web sites and net content material embody lodging for individuals with visible, bodily, or cognitive impairments throughout quite a lot of units, from desktops to tablets and cell phones.

Browsing by means of WCAG 2.1, there are numerous suggestions and actionable gadgets that net builders ought to do, and it might appear a frightening activity at first. However, there are a number of steps you can begin with and take, from understanding what enhancements you may make, to utilizing accessibility prepared themes and plugins to enhance your website’s accessibility.

Here are 5 methods you may go about it:

1. Check present WordPress accessibility utilizing WAVE (the Web Accessibility Evaluation Tool)

The first query is at all times the place to start? You have a website; how will you begin making it extra accessible? Fortunately, there’s a number of instruments that may assist with precisely that, and my favourite one is WAVE (the Web Accessibility Evaluation Tool). All you want to do is sort your website in and WAVE opens up the web site and annotates for you the place it finds accessibility and Web Content Accessibility Guidelines (WCAG) errors.

You can get a myriad of essential info similar to detecting distinction points (the place there’s low distinction between the textual content and background colours), detecting points with different textual content for photos (different textual content is an outline of the photographs or what’s displayed if photos can’t load), exhibits empty hyperlinks (the place a hyperlink doesn’t include textual content), and extra!

It additionally tells you what accessibility options your webpage has, providing you with a superb baseline to work up from. And the most effective half is, all of those are annotated on the webpage, so you recognize precisely the place the errors are and what to repair. WAVE is a unbelievable device to troubleshoot your present web sites for accessibility, know precisely the place the problems are, and assist repair them!

2. Use an accessibility-ready WordPress theme

What about beginning off from scratch however with accessibility in thoughts from the very starting? The finest approach to do that’s to begin with accessibility-ready themes! WordPress itself has a tag for themes which might be optimized for accessibility: Accessibility Ready, which you’ll be able to browse here. Before any theme can have the “Accessibility Ready” tag, it should meet certain requirements, making certain it’s truly accessibility prepared.

These necessities are impressed by WCAG and embody correct heading buildings, adequately contrasting colour schemes, keyboard-navigable menus and navigation schemes, and extra. Although there are usually not as many accessibility-ready choices accessible from WordPress straight as there are different themes basically, however you can even filter by means of comparable accessibility-ready themes on different on-line theme marketplaces, similar to ThemeForest, and arrange a website optimized from the very begin for accessibility!

3.Use WP Accessibility to add useful options

What if you have already got a website up and operating and wish to now take steps to optimize it for accessibility? WP Accessibility is the go-to plugin for precisely that, a one-stop, multi-featured plugin with an enormous number of instruments to assist make your web site extra accessible.

Here’s a few of the options that WP Accessibility has:

1. Skiplinks: WP Accessibility helps add skiplinks to your pages that may assist customers utilizing display screen readers or keyboards to navigate pages to simply skip between sections of the pages they need to see. These skiplinks will be set to at all times seen or hidden except tab is pressed.
2. Empty Search Error: Some themes return each put up/web page for empty or clean searches, however this may pressure an error and return nothing for an empty/clean search.
3. Link Underline: Forcing underlining of hyperlinks to assist make them extra seen.
4. Outline Elements utilizing keyboard: You can use this to put an overview round hyperlinks when the tab secret’s used to navigate inside a web page.
5. Accessibility Toolbar: Adds a toolbar to the left of the display screen that permits the consumer to alter the textual content dimension and change to a excessive distinction model of the location.
6. Remove title attributes: These are sometimes redundant and display screen readers learn each these and the textual content in case of photos/hyperlinks, thus WP Accessibility removes them to make it much less cluttery.

These are a number of of many different options and instruments WP Accessibility comprises and it may be an exquisite device in serving to make your website extra accessible and consumer pleasant than earlier than!

4. Use Accessibility Widget to change textual content dimension

Another superior and to the purpose plugin is Accessibility Widget, which permits you to add a widget in your sidebar, footer, or wherever you need to have widgets, that modifications the textual content dimension on the clicking of a button.

Within it, you may outline which HTML/CSS tags to resize and set the record of sizes to select from as effectively. Once arrange, the widget seems with the predefined record of textual content sizes to select from on the clicking of a button. All in all, Accessibility Widget could be very straightforward to use, user-friendly, and does the job extraordinarily effectively!

5. Use ResponsiveVoice Text to Speech to convert a web page into audio

Another superior accessibility plugin is ResponsiveVoice Text to Speech, which, as you may most likely guess from its title, creates an audio clip of the textual content in your web page or put up. An extensively customizable plugin, ResponsiveVoice permits you to select between 80+ completely different voices, offers you the power to choose which textual content to learn out, add in an “end-of-page” message which is performed when the consumer reaches the tip of the web page, add in an exit intent message when a consumer scrolls away from the web page to the toolbar/deal with bar, converse out paragraphs utilizing CTRL-UP and CTRL-DOWN keys, and way more.

ResponsiveVoice can be not restricted to widgets solely, however you need to use each shortcodes or HTML to have a button show in your website, which may both be wherever on any web page or put up, above or between textual content, or within the sidebar or footer as a customized widget itself. With this, your customers can now get an audio clip of the textual content simply by clicking a button, making your website extra accessible for individuals who won’t have the option to learn the content material correctly.

Closing ideas on WordPress accessibility

These instruments and plugins, though not an in depth record of all attainable ones that may assist with accessibility, can immensely show you how to both get began with making an accessible web site or troubleshooting your present websites and optimizing them for accessibility.

From accessibility prepared themes to troubleshooting utilizing WAVE and utilizing accessibility plugins, there are many actionable steps you may take as an internet developer to enhance your websites’ accessibility.

If you might have an present web site and would really like my group at Abstract Hub to assist assessment and optimize the location for accessibility, reach out to us today! Do you might have any favourite instruments and plugins to share on optimizing for accessibility? Feel free to share under! Happy WordPress-ing!