The entire Drupal community is dedicated to building an accessible platform for developing websites that can be used by individuals with impairments. Specifically, people can perceive, understand, navigate, and interact with the web. This might include issues with the following types of functions:
- Auditory
- Cognitive
- Neurological
- Physical
- Speech
- Visual
This effort began with Drupal 7 accessibility improvements. Drupal has pledged to ensure that all Drupal core functionalities comply with the World Wide Web Consortium’s (W3C) WCAG 2.0 and ATAG 2.0 criteria. The team will also upgrade the previous version of Drupal core, version 6, to improve accessibility when feasible.
Here, we’re going to look at what Drupal offers in terms of specific accessible functionality.
Drupal’s Accessible Features
If you use a screen reader or other assistive technology, you’ll be pleased to learn that Drupal was created to promote and support the usage of semantic markup. For example, for page-level navigation, you should be able to rely on headers. Organizing webpages using headings helps people understand page structure. Headings appear larger and clearer than text surrounding them. As such, headings can be used by screen readers to skip repetitive material like headers, menus, and sidebars.
The Drupal accessibility team has been tasked with identifying and resolving accessibility issues. They discovered and fixed a number of bugs in Drupal 7’s core code as well as raising community awareness.
WAI-ARIA refers to the “Web Accessibility Initiative – Accessible Rich Internet Applications.” It is a technical specification written by the World Wide Web Consortium (W3C), which developed the WCAG guidelines.
As such, Drupal site owners can utilize WAI-ARIA to validate interactive content against WCAG success criteria. Drag-and-drop widgets, accordions, and sliders are examples of interactive content.
Whilst we see these used on sites a lot, employing this type of content to develop a website can cause issues for users of assistive technology. This can make a website inaccessible to persons with certain disabilities. WAI-ARIA tries to improve website usability for two particular groups: those who can’t use a mouse and rely on voice commands to control their gadgets and those with visual disabilities who rely on screen readers.
The Drupal team has added WAI-ARIA functionality to provide more support for these components. Both the visitor and administrator sides of Drupal have seen significant enhancements, including:
- Drag and Drop capabilities to allow users who rely on a keyboard to interact with the element where previously this was only available to mouse users.
- Contrast and intensity of colour for those with different visual needs.
- Adding skip navigation to core themes as a great way to save time by not going over repetitive or unnecessary parts of a page.
- Image manipulation to allow users to adapt an image to how they can best view it.
- Labeling of forms for logical reading order when using a screen reader.
- Removal of tags that are duplicated or null, meaning the page has a better logical flow for screen reader users.
- Developers’ accessibility that allows those who build the sites to depend on Drupal itself to be accessible from a front and backend perspective
Drupal Modules
If you want to know if a module is accessible before installing it, simply go to the dedicated page for that module on Drupal.org and look for the “D7AX” hashtag. This indicates that the module’s developer follows Drupal guidelines for creating accessible modules. As a result, they’ve done all they can to guarantee that their programs and the information they generate are accessible.
Each D7AX developer is glad to hear about your experiences with their module, particularly if you have discovered a problem that they are unaware exists.
Accessible Drupal Themes
Theme layers are where many accessibility difficulties arise. Again, before choosing a theme, check for the D7AX hashtag on the Drupal.org page for that theme. As with contributed modules, the hashtag denotes themes whose creators are actively contributing to improving the accessibility of their work.
The Drupal development team has also developed an Accessibility guide and a Theming Guide Accessibility section to make it simpler for themers to understand what Drupal best practices are.
Community Drupal Sites
Drupal as an entity is managed using three websites that are all governed by the Drupal Association. Those sites are Drupal.org (the epicenter of all things Drupal, including core and contributed modules, security updates, and a plethora of documentation to help build a Drupal site), Drupal Groups (for events and meetups), and the Drupal API documentation site (for help getting started with Drupal).
Two of the sites are running on Drupal 7, and it is acknowledged that these sites have some accessibility concerns, which causes blockers for some of the Drupal community to participate in contributions to the platform itself. However, these issues are being resolved as quickly as possible. Meaning, those involved in any part of the Drupal ecosystem will be enabled as quickly as possible.
The community sites are aimed at those who work on Drupal itself rather than at Drupal site users. However, those who offer both code and non-code contributions are equally as important to galvanize so they can continue to improve Drupal, so it’s worth noting that accessibility is taken seriously from the inside, too.
Drupal 8 and 9 Core
Meeting WCAG AA standards means the website is usable and understandable for the majority of people with or without disabilities. Naturally, site owners should be aiming to cater to as many users as possible.
AA standards ensure (but aren’t limited to):
- Color contrast is sufficient.
- The usage of alt text or a similar solution for meaning images.
- The site’s navigation is consistent and logical.
- Forms have appropriate labels.
- A screen reader can navigate the site.
- Headings are used in logical order.
Drupal Core was built to facilitate the creation of sites that adhere to the WCAG 2.1 AA and ATAG 2.0 standards. As Drupal 9 evolves, the Drupal accessibility community will be participating in adopting best practices. This is a great sign of Drupal’s commitment to baking accessibility into the platform as standard.
Features
Semantic Improvements
Dries Buytaert, the creator of Drupal, wants to ensure developers spend their time implementing features that will directly benefit Drupal’s user base. As such, Drupal 9 supports the appropriate usage of semantic markup, allowing holistic Drupal users who extensively rely on screen readers to use headers consistently for page navigation.
Tab Order Can Be Controlled
TabbingManager is a fantastic new tool for guiding non-visual and non-mouse users to the most important components on a page in a logical manner. This makes traversing complicated user interfaces via keyboard navigation easier for those using a screen reader.
Hidden or Invisible Elements
Not all manners of hiding content are appropriate for users with screen readers or adaptive technologies. Sometimes, it’s best to visually hide an element because it is simply not required visually on the page.
Drupal has made it possible to hide these elements without negatively impacting screen readers (who might otherwise read aloud what the element is, including the fact that it is marked as invisible) or generating error or warning messages (which in and of themselves can also be disruptive to the user experience).
Fieldsets
The Drupal Form API now allows module developers to design forms that gather, validate, and process the data a user has submitted in a way that meets WCAG 2.0 AA standards. This is a significant step forward in Drupal’s form enhancements.
Alt Text
Alternative text, also known as “alt text” for short, “alt attributes,” “alt descriptions,” or even “alt tags,” are used within HTML code to describe the appearance and function of an image on a page. A screen reader will use this information for those with visual impairments.
The use of alternative text is now mandatory by default for all public sector websites in the UK under the WCAG guidelines. If not used, the organization may very well face a fine.
As it stands, alt text is mandatory for all image elements added to a Drupal site because of the importance to site visitors using a screen reader. Drupal developers do not currently have the intention of making this optional unless somebody can make a compelling case to the contrary.
Olivero
Olivero is the Drupal 9 default theme. It’s WCAG AA conformant. In fact, both external accessibility experts and the Drupal Accessibility team ensure that the theme continues to pass Drupal’s stringent accessibility standards with flying colors.
Accessible Inline Form Errors
With the inclusion of accessible inline form errors as an optional experimental Core module, Drupal forms have become much more accessible for those with visual impairments. It is now much easier for users to understand what mistakes they made while filling out an online form.
There are also plenty of contributed modules aimed at extending Drupal accessibility even further.
If You Need More Help With Web Accessibility
If you need expert help, Code Enigma is an experienced Drupal web agency. They can perform an accessibility audit on your site. They provide an accessibility audit service to check that your website or app meets the basic requirements of the Web Content Accessibility Guidelines (WCAG) 2.1 Level AA.
Non-compliances and concerns with W3C standards will be highlighted throughout their assessment. Their skilled team will provide you with a report that describes the problems discovered as well as advice on how to remedy them. Then, for you to post on your site, they’ll develop an accessibility statement.