Millions of people use WordPress to create websites and many useful tools such as accessibe WordPress on their sites. While it is a very versatile and powerful platform, it can also be difficult to make accessible for everyone. This article will explore some best practices for making WordPress more accessible for everyone.
There are four key focus points when making WordPress more accessible: Usability, Navigation, Semantics, and Back-End Usability.
Usability for Everyone
WordPress is very easy to use for people who know how to use it. However, like all technology, users can make mistakes while using it. Some tools are available that make it easier for WordPress users to “get things right” while they are working, and we’ll cover some of them in this article.
Navigation for Everyone
Everyone who uses a website needs to get from point A to point B on the page. With WordPress, most people can easily click through their site, but what about visitors who don’t have a pointing device? We need to ensure that everyone can navigate our sites using just a keyboard. Semantics Matter
Semantics is a fancy word that simply means giving your content the correct context, so that screen reading software knows what your layout elements mean. For example, you would not want your name tag at an offsite meeting to say, “Hello! My name is John Doe.” Instead, your name tag at an offsite meeting would probably say, “Hello! My name is James Smith.” The context of your layout puts the user into a situation that gives them the correct information.
Back-End Usability for Everyone
WordPress allows you to create custom layouts and interfaces, and this can be very useful – but it can also cause some problems for people with disabilities. We need to ensure that everyone has access to manage their content efficiently. For example, there are some things you can do to make editing posts and pages much more accessible, like avoiding color-based custom post types and using “alt” tags for images.
Semantics Matter
The most important part of WordPress development for accessibility is making sure you are using the right HTML in your content. There are several articles on general best practices, but I want to give some tips that apply specifically to accessibility.
<h1> versus <strong>
One common mistake is not knowing when it’s okay to use italics or bold text in HTML and when it must be replaced with heading tags like <h1>, <h2>, etc. For example, it may seem easier to type in an h1 tag that makes sense at the top of your page, but screen readers will usually read anything with an h1 around it as if they were all headings.
Making the distinction between <h1> and <strong> is important in accessibility, but it can also be difficult. Some best practices are:
- Use <h1> for your site header – this provides the most semantic value to sighted users who may want to skip past this section of content when they arrive at your site.
- Don’t use an h2 tag on the front page if it isn’t a subheading of your main H1 tag. An h2 will not show up as a separate heading in your site layout, so just stick with headings that are directly under the H1 tags on any single page.