As the global demand for more accessible websites gains momentum, all web tools, and systems must work towards being equally accessible to users with disabilities.
Drupal is a popular content management system (CMS) built with accessibility in mind. It captures this in its Accessibility Statement,
“As an inclusive community, we are committed to making sure that Drupal is accessible…. Prioritizing accessibility within Drupal is critical to our values.”
The platform adheres to two important international accessibility standards released by the World Wide Web Consortium (W3C):
- WCAG 2 – which addresses web content accessibility.
- ATAG 2.0 – which addresses the accessibility of web authoring tools.
Have a WordPress website? Check out WordPress accessibility plugins
Its accessibility initiative began in Drupal 7. However, some of its best accessibility features were included in later versions – Drupal 8 and Drupal 9.
In this article, I will take you through the extended Drupal 9 modules that can help you improve the accessibility of your site.
Let’s dive right into them:
-
Automatic Alternative Text
This module allows you to generate an alternative text (Alt Text) for images where there is none, using Microsoft Azure Cognitive Services API. The descriptions are in English by default, but you can translate them into other languages.
Alt text is crucial for blind or low-vision web visitors who use screen readers because that is the only way they can understand the entire contents of a page.
Also, including alt text for your images makes your content more SEO-friendly and boosts your ranking in search results.
-
Block Area Landmark Roles
This module adds additional elements to the block configuration forms that allow you to assign an ARIA landmark role and/or ARIA labels to a content block.
ARIA elements help screen readers and other assistive technologies identify the type and purpose of a particular piece of content.
As a result, visitors who use these technologies will find it much easier to navigate the site and improve their experience.
-
CKEditor Abbreviation
This module adds a button to CKEditor to allow you to insert and edit abbreviations.
(The CKEditor is a What-You-See-Is-What-You-Get (WYSIWYG) visual HTML editor on Drupal).
It is available on the CKEditor toolbar configuration of text formats. However, you’ll need to set CKEditor as the text editor to access it.
-
Editoria11y
Editoria11y (editorial accessibility) is an accessibility checker aimed at content creators and editors that runs automatically in the background.
It also runs in context and focuses solely on content-related issues that page editors can easily understand and fix.
Editoria11y also has a toggle that, when activated, displays the number and type of issues found, plus details and recommendations.
-
FluidprojectUI Options
This module allows you to modify the font size and style, line height, contrast, and link style on a page to your liking. Its cookies automatically retain any changes you make.
Although the module is compatible with popular themes, it has some limitations. For instance, you cannot change contrast settings for elements that use CSS gradients.
Also, some themes (such as Bootstrap) need additional CSS for font sizing and line heights to work as they should.
-
htmLawed
This module provides not only accessibility features but also security measures to protect your website.
It restricts and cleans up HTML code to comply with the site administrator policies, standards, and security best practices.
It also allows you to customize HTML markup and control HTML elements, attributes, and URL protocols in the input.
-
HTML Purifier
This module is a standard-compliant HTML filter library. Just like htmLawed, it provides both accessibility and security benefits.
It removes all malicious code (known as XSS) using a thoroughly edited, secure, and permissive whitelist. It also ensures your documents are compliant with W3C recommendations.
More Drupal 9 Accessibility Features
-
Accessibility Toolkit
The a11y module provides reusable tools to help developers create Drupal sites that are useful to people who use assistive technologies.
Currently, it provides a block with specific settings to enable the following:
- Dyslexic font support
- High contrast mode
- Inverted Colors mode
- Text scaling
- Keyboard navigation
-
Node Link Report
The Node Link Report provides a report based on the full scan of all links on a node or term page. It checks for broken (404), redirected, and good links.
It scans them for accessibility errors such as unclear text or image links with ambiguous alt text or aria-labels.
-
Siteimprove
This plugin integrates Siteimprove into Drupal, allowing you to fix, test, and optimize the website on an ongoing basis.
It also allows you to measure your digital performance and use these insights to improve your content creation and editing process.
-
Style Switcher
This module allows you to create themes with alternate stylesheets to make web pages more accessible to visitors with color blindness.
It also enables site builders to add more alternate stylesheets in the admin section. As a result, users can choose what style they prefer via links in a block.
-
Text Resize
This module provides your end-users with a block with two buttons that they can use to quickly change the font size of text on your Drupal site.
It makes your pages more accessible by helping visually impaired users adjust the font size to one that is most comfortable for their eyesight.
Conclusion
In my opinion, Drupal developers and core maintainers have achieved much in terms of accessibility. They have also released some of the best features for better usability.
Nevertheless, organizations have a responsibility to plan, develop, and build websites and web applications that are accessible.
There are several great accessibility solutions to help you make your website accessible and compliant. We’ve already researched for you!
Browse through our carefully curated list to access the most suitable accessibility solution available for your business.