The Editoria11y assistant checks your content against a set of accessibility rules and warns about any issues it finds. One of the best things about Editoria11y is that it is designed for content editors – not just developers. The guidance it provides is actionable and clear, so you can identify, understand, and fix issues as well as the opportunity to learn as you go.
As a content editor you’ll encounter the assistant as a small widget displayed on content pages, and content editing forms, throughout your site. In this tutorial we’ll walk through how to find it, how to interpret what you’re seeing, and how to act on suggestions.
Back to topGoal
Confidently use the Editoria11y assistant to optimize your content for accessibility.
Back to topPrerequisites
- Accessibility essentials: what you should know
- Install and explore Accessibility Tools in Drupal CMS
Access the Editoria11y assistant
Once the Accessibility Tools add-on is applied, you’ll notice a small accessibility icon—a little flag or badge—appearing in the lower corner of the content editing interface and alongside your content as you preview pages on the site. This icon tells you that Editoria11y is ready to help you identify and fix any accessibility issues on the page.
Icons
The blue ed11y accessibility checker widget indicates no issues found. It displays with summary and checklist icons and a checkmark.
The red ed11y accessibility checker widget indicates issues or warnings found, and displays with a number of issues, and icons for summary, checklist, and a flag.
Use the Editoria11y assistant on content
These accessibility checks should work on any content on your site. For this example, we’ll use the demo page that is provided by the Accessibility Tools add-on.
- While signed in to the site, navigate to the content you wish to review, in the Drupal CMS admin toolbar, navigate to Content (/admin/content).
- Locate the Accessibility Tools demo page content item in the list, and click it to view the page.
- When viewing the page, notice the Editoria11y badge in the lower right corner. You can interact with the badge to view a detailed report.
- If the assistant has any suggestions for the page you’ll see indicators in-line with the content.
- Clicking on any of these will bring up a detailed description of the issue and suggestions for how to make the content more accessible. These messages are written in plain language so you can understand what’s wrong without needing to be an accessibility expert.
- You can optionally choose to “Mark as OK” or “Mark as ignored” any alerts and they will be hidden from view. If a page has hidden alerts the Editoria11y badge will indicate their presence and allow them to be toggled visible again.
This same assistant is visible whenever editing content using the WYSIWYG editor.
- While signed in to the site, navigate to the content you wish to review, in the Drupal CMS admin toolbar, navigate to Content (/admin/content).
- Locate the Accessibility Tools demo page content item in the list, and the Edit option from the dropdown menu.
- The content editing form will appear, and the Editoria11y badge and suggestions will be displayed on the page similar to described above.
- As you edit the page content the assistant will recheck the page in real-time and highlight any issues it finds.
Additional resources
- W3C Introduction to Web Accessibility — A clear and concise overview of what accessibility means and why it matters.
- WebAIM: Writing Clearly and Simply — Practical guidance for writing web content that’s understandable by people with cognitive or reading disabilities—and better for everyone.
- Editoria11y project — Learn more about how the Editoria11y checker works and what its warnings mean.
Wrap-up
In this tutorial we learned how to access, and interpret, the guidance provided by the Editoria11y accessibility checker. By regularly scanning for, and incorporating these suggestions into your content you’re ensuring that everyone who visits your site can have the best possible experience.
Back to top