When WordPress 5.0 was released in December of 2018, it came with a new feature: the Gutenberg editor. This new editor boasted a ton of exciting elements that were meant to increase the flexibility and improve the experience of editing content in WordPress. However, when it came to accessibility, the Gutenberg editor left a lot to be desired.
Article continued below.
Stay on top of web accessibility news and best practices.
Join our email list to get notified of changes to website accessibility laws, WordPress accessibility resources, and accessibility webinar invitations in your inbox.
An Overview of WordPress Accessibility
Before we dive into accessibility and the Gutenberg editor, let’s talk a bit about accessibility and WordPress overall.
Why Accessibility Matters on Your WordPress Site
When we talk about accessibility in terms of websites, we are talking about the ability for all users to successfully navigate and understand the information presented on a web page, regardless of age, disability, or situation.
About 15% of the worldwide population has some form of disability and the CDC states that 1 in 4 American adults has a disability. That is a lot of people who may be having a problem interacting with your website and a large potential customer base that you could be missing out on.
Recent figures from W3Techs show that WordPress is used by 63.5% of websites whose content management system they were able to identify. This is 38.7% of all websites on the internet. Because WordPress powers so many websites in existence, accessibility on the platform is critical to ensuring that all people are able to use it.
Current WordPress Accessibility Efforts
WordPress contributors have done some work to ensure that users have access to their web content, both on the front- and back-end. There are accessibility-ready themes to give developers and content authors a head start on creating accessible websites. (Although it’s important to note that theme code is only a small part of what makes a website accessible.)
There is also a WordPress Accessibility Team, which works to provide tools and guidance for accessibility issues within WordPress. While there are still certain accessibility issues for front- and back-end users, many contributors to WordPress have worked hard to resolve issues and provide direction in order to create a more accessible experience.
What Is the Gutenberg Editor?
As we mentioned above, the Gutenberg editor was released as a part of the WordPress 5.0 update released in December 2020. This new editing experience was controversial, to say the least, but its main selling point was that it allowed for the easier creation of media-rich pages and posts by non-developer users.
Gutenberg Features
Some of the new block editors features included:
- Modern and multi-media heavy layout options.
- Increased plugin functionality; users could do more with fewer plugins.
- The ability to work across multiple screen sizes and devices.
- An editor that more closely resembles the front-end view.
- Easy to add columns and unique visual sections.
Gutenberg Blocks
In addition to these features, the Gutenberg editor also gave us Gutenberg blocks. The official web page for the new Gutenberg editor had this to say about blocks:
Blocks are a great new tool for building engaging content. With blocks, you can insert, rearrange, and style multimedia content with very little technical knowledge. Instead of using custom code, you can add a block and focus on your content.
WordPress boasted that the addition of blocks would allow anyone, regardless of coding ability, to create custom posts and pages. While that sounded like an exciting and innovative way to edit, blocks were met with quite a big backlash. Here’s why.
Gutenberg Backlash
For many content authors, the editor was simply used to clean up content that was created in another program, and then copied and pasted into WordPress. When blocks came into play, this option was taken away. Additionally, a considerable amount of editors and creators felt a general sense of uneasiness with this new block style. It seemed odd to cut content into separate sections when they may not normally be thought of in that way.
All in all, the release of the first version of the Gutenberg editor seemed to have provided more problems than solutions. Now let’s talk about what that meant for accessibility.
Gutenberg Editor Accessibility Issues
Before the Gutenberg editor had even been made available to the public, it was reviewed by the WordPress Accessibility Team. The team released a report on the new editor in October 2018.
WordPress Accessibility Team Report Details
The Accessibility Team’s report stated that, while many WordPress contributors had worked very hard, and had already made changes to improve the software’s accessibility, the Gutenberg editor still presented a number of challenges for users.
Some of these challenges included:
- Complexity of the Editor. The Accessibility Team found the user experience of the Gutenberg editor to be an “accessibility regression.” The new interface included unexpected interactions with a number of components, which imposed a significant learning curve on assistive technology users. Additionally, it appeared that the shifting controls favored visual design rather than information architecture, making it difficult for screen reader users in particular.
- Inconsistency In User Interface Behavior. The report stated that the inconsistent behaviors within the Gutenberg interface created a heavy cognitive load, as well as problems for keyboard navigation users. This keyboard issue was especially prominent within the toolbar controls, as some behaved differently than others, keeping users from predicting what will happen by choosing or triggering the controls.
- Accessibility Anti-Patterns. The Gutenberg editor seemed to rely heavily on the use of ARIA attributes. While ARIA are sometimes necessary, their presence in the Gutenberg editor seemed to take over, presenting an anti-pattern rather than a solution. This showed that rather than beginning with accessible controls, WordPress opted to begin with custom controls that they later attempted to make accessible.
- Keyboard Shortcuts and Navigation. While the Gutenberg editor included a variety of keyboard shortcuts to help with navigation issues, it did not ensure that those shortcuts were actually functional. Additionally, a set of guidelines for keyboard navigation within the block editor was created, but it took a much greater amount of time, and posed quite a burden on users.
Even after the report that was released by the WordPress Accessibility Team, it was decided to move forward with including the Gutenberg editor in WordPress 5.0.
While there were some changes made to resolve some of the issues mentioned in the report, the Gutenberg editor still received a significant number of concerns and complaints after release.
The Gutenberg Editor Accessibility Audit
In January 2019, they selected Tenon, LLC to run an accessibility audit of the new editor. Tenon ran a variety of tests using WordPress 5.0.3, and the final results were compiled into a 329-page technical report that described the issues in detail, as well as a document summarizing their usability testing.
It is important to note that in between the time that Tenon began the audit and the time that the results were published, over 100 of the accessibility issues within the Gutenberg editor were resolved.
The results of Tenon’s audit found that, while the final products created in the Gutenberg editor were generally clean and accessible, the user experience was “consistently poor.” In fact, Tenon stated that the Gutenberg editor was “a step backwards for users with disabilities.”
It was the recommendation of Tenon that WordPress developers get straight to work, tackling the accessibility issues quickly and aggressively.
Accessibility and the Gutenberg Editor: Where We Are Now
Flash forward to 2020, and there have been more than 6 updates to the Gutenberg block editor.
For those who have stuck with Gutenberg all the way, it’s clear that even with the changes that have been made since the first launch, there are still some improvements that are needed. As for those who have remained wary of Gutenberg or find it incompatible with their assistive technology, the Classic editor is still available for use and can be installed with a free Classic Editor plugin.
You Can Help Make WordPress More Accessible
The WordPress Accessibility Team continues to make strives to improve the accessibility of the editing experience in WordPress’s block editor. If you would be interested in helping to make WordPress more accessible, you can find additional information in the resources links below.
- Learn how to get involved with the WP Accessibility Team
- See accessibility-related active tickets, tasks, and useful reports
- See accessibility issues for the block editor
- Found an accessibility related bug? Create a new ticket to report accessibility issues you’ve found in WordPress core
- Visit the WordPress Accessibility discussion forum
For questions or support related to WordPress and accessibility, please contact us. We’re happy to help you make your WordPress website more accessible – both for visitors to the site and also for your staff and content managers working in the backend of WordPress.
