WordPress is the most popular Content Management System (CMS) in existence, currently used by nearly 40 percent of all websites according to the W3Techs’ Web Technology Survey. The platform is powerful, versatile, and flexible — but WordPress sites aren’t automatically accessible, even when site owners make a good-faith effort to take the right steps, which is a surprise to some.
Accessibility should be a major priority for all web developers, and while automated resources are available to help with accessibility, these tools have their limits. For example, accessibility plugins can be useful for highlighting some issues, but they’re built to be used on any of the 75 million sites with WordPress. Given that scope, they’re unable to address all of the issues that impact real-world users. Worse, they may give developers a false sense of security — while the plugins often have disclaimers noting that they cannot guarantee accessibility, some site owners might assume that they’re accommodating users simply by using plugins.
That’s an issue, because accessibility should always be prioritized throughout the web development process, not as an afterthought. As we’ve pointed out before, fixing issues often consumes more resources than building with an accessible mindset.
Building for accessibility in WordPress
Every public-facing website has an obligation to accommodate as many users as possible. This isn’t just an ethical stance; accessible websites are easier for search engines to read and interpret, and users with disabilities are far more likely to trust a business or organization that takes appropriate efforts to promote accessibility.
Building for accessibility requires dedication and research, and accessibility experts can provide valuable guidance during this process. However, designers can keep a few key concepts in mind to avoid some of the most common WordPress accessibility mistakes.
Choose an accessible theme, but don't stop there
The open-source Wordpress Project provides a list of accessibility-ready themes that have been checked by their Theme Review Team. That’s a great first step, but remember that accessible themes cannot ensure long-term accessibility.
Even with an accessible theme, installing plugins or making simple changes (such as implementing a new color scheme or using improper headers) could cause issues for users with certain disabilities. Moreover, no theme or plugin can properly apply alt attributes to media, create text alternatives for videos, or carry out other important tasks on behalf of the site owner.
Pay attention to fonts and colors
Your content should be perceivable and understandable for your users. Generally speaking, you should use a limited number of fonts. Where possible, stick with sans serif fonts (Verdana, Helvetica, Arial, and Tahoma are popular examples), which are easier to read and scale.
Font size is another important factor; small fonts can be illegible on some devices and platforms. Most sites use 12 to 14 point fonts, but consider using larger text if your audience would benefit (for instance, if your readers are older or if you’re writing content for people with dyslexia). Make sure that text can be scaled by up to 200%, preferably 400%, without impacting the site’s usability.
Avoid using font appearance (such as bold text or italics) to convey meaning. Instead, use appropriate HTML to accommodate users with screen readers. Additionally, make sure the colors of all content that delivers meaning have strong contrast and that meaning isn't only conveyed by color.
Use appropriate structural elements
Structural elements describe the different parts of your webpage, which helps users navigate and understand your content. When used consistently, they also optimize your content for search engines.
Make sure to use headings, subheadings, header and footer tags, and other structural elements consistently throughout your site. Headings are particularly important, as many WordPress beginners use headings to style their content — remember, headings are structural elements first and foremost, and using them incorrectly can cause navigation issues for some users.
WordPress’s Gutenberg editor has built-in controls to implement subheadings, but make sure to use the tool properly. Subheadings should be descriptive and should provide an overview of content. A more detailed explanation of optimized headings can be found here.
Make sure new content is accessible
If you use images or videos to convey information, make sure to provide a text alternative. Properly tag images with alt attributes; WordPress makes this process fairly painless, as you can add alt text, captions, and descriptions within the media library.
However, some implementations might not incorporate those tags correctly, so check your posts carefully. You’ll also need to write those tags in a way that actually accommodates your audience — for some users, alt attributes that don’t provide enough information (or too much information) can be frustrating, too. Avoid making common mistakes like repeating the same text in the caption and alt text.
Test your site regularly
Testing can expose accessibility challenges, and while professional testing is always preferable, site owners can perform basic checks to locate some significant issues. The simplest method: Try navigating your site using only a keyboard, which is exceptionally helpful for testing forms and navigation.
Many users with vision disabilities use screen readers, assistive software that converts text to speech or Braille. Free programs like NVDA (Windows) and Voiceover (MacOS) are excellent resources for casual testing. Remember, however, that different screen readers use different methods to interpret web content.
The Bureau of Internet Accessibility also offers a free and confidential Web Content Accessibility Guidelines (WCAG) compliance report, which can provide an initial overview of how your site performs when tested against certain checkpoints. All automated tools have limitations — even ours — and they’re most effective for getting a summary of a site’s performance.
WordPress makes site creation much easier, and the Wordpress Project helps developers adopt an accessible mindset. However, the bulk of the responsibility ultimately falls to the developers, programmers, and content creators who use the CMS. By keeping your users in mind throughout development (and reaching out for professional guidance), you can build a clean, professional site that accommodates more of your real-world users.