“..an inclusive community, we are committed to making sure that Drupal is an accessible tool for building websites that can also be accessed by people with disabilities.”
Calling accessibility as one of Drupal's core values and principles, the Drupal community has always stood to comply with web accessibility standards. Although with an absence of hard and fast rules to adhere to, the community has faced backlash in recent times.
First, with adopting Gutenberg (editor) and second with the release of Layout Builder, there have been some important questions and concerns about accessibility in the community.
This Global Accessibility Awareness Day, an awareness day to focus on digital access and inclusion for the more than one billion people with disabilities and impairments, let's take a look at how close is Drupal to its commitment towards web accessibility.
The Accessibility Controversy
In 2018, with WordPress 5.0 prepared to be released, the Gutenberg editor, a decoupled React based editing experience, was out for testing. Among other concerns like inconsistent user interface behaviour, difficulties with keyboard navigation through blocks ( far too heavily reliant on hover-based functionality), complexity to use it, the assessors were quick to call it inaccessible.
Drupal’s adoption of Gutenberg, got it in the fallout.
In another instance, when Drupal 8.5 released Layout Builder, the lack of accessibility in the feature brought the community into the topic of debate - how strongly does Drupal commit to accessibility?
How does Drupal ensure Web Accessibility?
Accessibility is about promoting inclusion than benefitting a small set of people with disabilities. It is about ensuring equal and inclusive access to the web resources, for the widest possible audience, without any bias.
And this has been reiterated in the Web Content Accessibility Guidelines (WCAG), that explains how web content can be made more accessible to people.
Drupal, in its Values and Principles, effectively lays down their commitment towards creating software which conforms to the accessibility guidelines. It conforms to the World Wide Web Consortium (W3C) guidelines which address:
- Authoring tools, as part of the Authoring Tool Accessibility Guidelines (ATAG 2.0)
- Web content, as part of the Web Content Accessibility Guidelines (WCAG 2.0)
As a result, it can be used both by developers as well as the site visitors.
Drupal has its own accessibility team, which helps identify the barriers occurring at the code level and the awareness level, and also resolves them. A number of such issues in the core have been identified and resolved, while also creating awareness within the community.
Some of these improvements included: Search engine form and presentation, drag and drop, color contrast, image handling, form labelling and so on.
Accessibility for developers is another added feature in Drupal, and through D7AX, it is an easy job to find contributed modules and themes which also support the development of accessible websites.
Let’s take a deeper dive into the key modules and features of Drupal that help overcome web compatibility issues, and ensure easier web accessibility:
Key Modules
| Automatic Alt text | It automatically generates an alternative text for images when no alt text has been provided by the user. |
| Block ARIA Landmark Roles | It adds additional elements to the block configuration forms that allow users to assign an ARIA landmark role to a block. |
| CKEditor Abbreviation | It adds a button to CKEditor which helps in inserting and editing abbreviations in a given text. |
| CKEditor Accessibility Checker | It enables the Accessibility Checker plugin in your WYSIWYG editor, which then helps inspect the content accessibility level; and solve them. |
| High Contrast | It allows the user to quickly switch between the active theme and a high contrast version of it. |
| htmLawed | It utilizes the htmLawed PHP library to limit and filter HTML for consistency with site administrator policy and standards and for security. |
| Style Switcher | Themers can provide a theme with alternate stylesheets. Allowing special styling for some part of the site, the module presents all those styles as a block with links. So any site user is able to choose the style of the site he/she prefers. |
| Text Resize | It provides the end-users with a block for changing the font size of text on your Drupal site. |
| Accessibility | It gives a list of available Accessibility tests, aligned to guidelines like WCAG 2.0 or Section 508. |
Key Features:
-
Semantics in the Core
Drupal has been built to encourage and support the proper use of semantic markup. Thus composing semantically correct HTML informs the browser and the assistive technology about the type of content it is managing with, and how this relates to other content.
This helps the assistive technologies carry out its activity effortlessly since they now have a structure to work with.
2. Aural Alerts
Drupal provides a method called “Drupal.announce()” which helps make page updates obvious, in a non-visual manner. This method creates an aria-live element on the page.
3. Controlled Tab Order
Drupal’s TabbingManager is an awesome medium to direct both non-visual and non-mouse users on the page, to access the prime elements in a logical order. And thus permits more control while exploring complex UIs.
4. Accessible Inline Form Errors
Drupal forms are now more open to the expansion of available inline form errors. So now, it is easier for everyone to identify what errors made while filling in a web form.
5. Fieldsets
Fieldset labels are utilized as systems for gathering related segments of forms. When effectively implemented, these labels give visual diagrams around the shape field gathering.
Presently, Drupal uses fieldsets for radios & checkboxes in the Form API. This helps towards additionally upgrading forms in Drupal.
What was the Outcome of the Controversy?
As always, the community has stood by accessibility as one of the core tenets. In a blog, Drupal's commitment to accessibility, Dries Buytaert - Drupal Founder - writes on the issue and how seriously the community takes the commitment to accessibility.
With that said, he announced that the Layout Builder functionality would be in a "stable" state for production use after ensuring that it passes the accessibility gate (Level AA conformance with WCAG and ATAG). This holds for both the authoring tool itself, as well as the markup that it generates.
With accessibility maintaining team, it has been jointly agreed that:
- The first priority is WCAG 2.0 AA conformance. This means that in order to be released as a stable system, the Layout Builder must reach Level AA conformance with WCAG. Without WCAG 2.0 AA conformance, a stable version of Layout Builder won’t be released. This happened with a stable release of Layout Builder in 8.7.
- The next priority is WCAG 2.1 AA conformance. Because these guidelines are still new (formally approved in June 2018), the stable version of Layout Builder won’t be held on them but are committed to implementing them as quickly as possible, even if some of the items are after the initial release.
- While WCAG AAA conformance is not something currently being pursued, there are aspects of AAA that we are discussing adopting in the future. For example, the new 2.1 AAA "Animations from Interactions", which can be framed as an achievable design constraint: anywhere an animation is used, it will be ensured that the designs are understandable/operable for those who cannot or choose not to use animations.
The commitment to this ideal, by the leadership at Drupal and by the larger community, has remained steadfast despite challenges. The announcement and commitment to conform to AA level has reinstated the faith in the community towards its values.
Ready to build digital experiences that are truly great for your customers - frictionless, accessible, and inclusive? Drop us a line, and our Drupal experts will be in touch.
