Drupal 9 y la accesibilidad

Alvaro Domingo Zurdo

Alvaro Domingo Zurdo

Consultor ux en BABEL

Fecha de publicación: 8 de mar. de 2021

Seguir

Drupal 9 se lanzó el 9 de junio del 2020 según Dries Buytaert, fundador de Drupal y
líder del proyecto: "El gran problema de Drupal 9 es ... que no debería ser un gran
problema".

Los puntos clave de Drupal 9 son:

  Compatible con versiones anteriores. Cuando se lanzó inicialmente Drupal ,

Dries Buytaert no estaba a favor de preservar la 'compatibilidad con versiones
anteriores'. ...
 Rendimiento más rápido y mejor. ...

Debes tener presente que Drupal 10 está previsto para 2022.

La actualización de Drupal 10 será una actualización fácil para los usuarios de Drupal 9,
y solo requerirá un poco de atención adicional al código

Drupal es posiblemente el gestor de contenidos más centrado en la accesibilidad, para

ella existe una serie de módulos que debes tener presentes para la accesibilidad.

Automatic Alternative Text

El módulo utiliza la API de servicios cognitivos de Microsoft Azure para generar un

texto alternativo para las imágenes cuando el usuario no ha proporcionado ningún texto
alternativo.

Nota: La inteligencia artificial y el reconocimiento de imágenes pueden ser

beneficiosos, pero no pueden reemplazar lo que ve el autor. Lo que una computadora ve
en una imagen rara vez será lo mismo que lo que el autor quiere mostrar con esa
imagen.

https://www.drupal.org/project/auto_alter

A11Y: Form helpers

Agrega mensajes de error legibles. Y permite que los campos de formulario utilicen
atributos de autocompletar, para el llenado previo de los datos del formulario por parte
del navegador. Algo muy importante para las personas con discapacidad intelectual.
https://www.drupal.org/project/a11y_form_helpers

Block ARIA Landmark Roles

Inspirado en Block Class, este módulo agrega elementos adicionales a los formularios
de configuración de bloques que permiten a los usuarios asignar un rol de referencia
ARIA a un bloque.

https://www.drupal.org/project/block_aria_landmark_roles

Más información: https://www.nomensa.com/blog/2010/what-are-wai-aria-document-

landmark-roles

CKEditor Abbreviation

Agrega un botón a CKEditor para insertar y editar abreviaturas. Si se selecciona una

etiqueta abbr existente, el menú contextual también contiene un enlace para editar la
abreviatura.

https://www.drupal.org/project/ckeditor_abbreviation

CKEditor Accessibility Auditor

Integración simple para CKEditor para ejecutar HTML_CodeSniffer Accessibility

Auditor en el código fuente del contenido actualmente en el editor.

Los resultados se muestran inmediatamente en un modal. Estos se pueden navegar

dentro del modal y mostrarán detalles sobre el error específico, los criterios de éxito
relevantes y las técnicas sugeridas, y el código que desencadenó el error.
https://www.drupal.org/project/ckeditor_accessibility_auditor

Editoria11y (accesibilidad editorial) es un verificador de accesibilidad que aborda tres

necesidades críticas para los autores de contenido:

·      Se ejecuta automáticamente (como el corrector ortográfico): los usuarios no

necesitan recordar presionar un botón o visitar un tablero.

·      Se centra exclusivamente en problemas de contenido : cosas que el autor de la

página puede comprender y corregir fácilmente, como elementos alternativos, estructura
de tablas y listas y esquemas de página.

https://www.drupal.org/project/ckeditor_accessibility_auditor

Fluidproject UI Options
Las opciones de interfaz de usuario de Fluidproject proporcionan opciones de
accesibilidad para que los usuarios modifiquen el tamaño de fuente, la altura de la línea,
el estilo de fuente, el contraste y el estilo de enlace de una página.

https://www.drupal.org/project/fluidui

High contrast ewn versión (beta)

Proporciona una solución rápida que permite al usuario cambiar entre el tema activo y
una versión de alto contraste.
https://www.drupal.org/project/high_contrast

htmLawed

El módulo htmLawed utiliza la biblioteca PHP htmLawed para restringir y purificar

HTML para cumplir con la política y los estándares del administrador del sitio y por
seguridad. El uso de la biblioteca htmLawed permite un control altamente
personalizable del marcado HTML.
https://www.drupal.org/project/htmlawed

HTML Purifier

HTML Purifier es una biblioteca de filtros HTML compatible con los estándares.
HTML Purifier no solo eliminará todo el código malicioso (más conocido como XSS)
sino que también se asegurará de que sus documentos cumplan con los estándares, algo
que solo se puede lograr con un conocimiento integral de las especificaciones del W3C.

https://www.drupal.org/project/htmlpurifier

Siteimprove

Proporciona información reveladora que le permite al desarrollador y a su equipo crear

contenido de mayor calidad, generar un mejor tráfico, medir el rendimiento digital y
trabajar hacia el cumplimiento normativo, todo desde un solo lugar.
https://www.drupal.org/project/siteimprove

Style Switcher

Permite a los visitantes del sitio web elegir con qué hoja de estilo les gustaría ver el
sitio. Este módulo presenta todos esos estilos a los visitantes del sitio como una lista de
enlaces en un bloque. Por lo tanto, cualquier visitante del sitio puede elegir el estilo del
sitio que prefiera. El módulo utiliza cookies para que cuando las personas regresen al
sitio o visiten una página diferente, sigan obteniendo el estilo elegido.
https://www.drupal.org/project/styleswitcher

Text Resize

El módulo Text Resize proporciona a sus usuarios finales un bloque que se puede
utilizar para cambiar rápidamente el tamaño de fuente del texto en su sitio Drupal. El
bloque incluye dos botones que pueden aumentar y disminuir el texto impreso en la
página. Este módulo se centra en aumentar la accesibilidad de sus páginas, ayudando a
los usuarios con discapacidad visual a ajustar el tamaño del texto para que sea más
cómodo para su vista.

https://www.drupal.org/project/text_resize

Civic Accessibility Toolbar

La barra de herramientas de accesibilidad cívica proporciona un bloque con utilidades
de accesibilidad para ayudar a los usuarios a cambiar entre las versiones del tema con
mayor contraste de color y cambiar el tamaño de fuente del texto.

Todos los tamaños de fuente del tema deben usar unidades rem o em, para que la
utilidad de cambio de tamaño de fuente funcione.

https://www.drupal.org/project/civic_accessibility_toolbar

Top 10 Drupal Accessibility Modules

Originally published on 19th August 2019. Updated with current information on the
modules’ compatibility with Drupal 9 and new Drupal 9 modules.

Making sure your digital experiences are accessible has become a necessity - and with
all the right reasons. The web is for everyone and, as such, everyone should be able
to use it effectively, no matter their physical ability. Sites that are inaccessible
automatically prevent a large number of people from using them.

We’ve already written a series of blog posts on Drupal and accessibility - you can check
them out here: part 1 & part 2. As you can probably glean from these two posts, Drupal
offers a lot of accessibility features out-of-the-box, e.g. the requirement of alt text for
images in Drupal 8 (another strong case, by the way, for migrating to Drupal 8
ASAP). 

The second part of the series also takes a look at a few contributed modules with which
you can further improve the accessibility of a Drupal website. During the time since the
blog post’s publication, however, there have been many more accessibility-focused
modules contributed to the Drupal project - and these are what we’ll take a closer look
at in this post. 

Drupal 9 update: Drupal has made significant improvements since the time that we
originally published this article. While Drupal 8 and even Drupal 7 are still widely used,
their end of life dates are approaching and many websites are now transitioning or have
already upgraded to Drupal 9. 

To reflect this, we’ve updated the article with information about the modules’ D9
compatibility status, and we also included a few of the best newly released or recently
refreshed Drupal 9 modules. 

Accessibility toolkit (& Accessibility)

While only available for Drupal 7, the Accessibility toolkit (the a11y module) is an
invaluable resource for Drupal developers that are tasked with building user-friendly
and accessible sites. It allows for: dyslexic font support, high contrast mode, inverted
colors mode and text scaling. 

On top of that, it also provides support for simulating specific disabilities. Since it’s
quite difficult for an able-bodied person to put themselves in the shoes of a disabled
person, these simulations greatly help developers to feel empathy by reproducing the
symptoms of certain disabilities such as dyslexia or colorblindness. 

If you’re looking for a module with similar capabilities that can also be used in Drupal
8, the Accessibility module is the one closest to the a11y module - it’s geared more
towards content editors and site maintainers, though. It provides a set of available
accessibility tests that check the content published by your editors and other users
for any accessibility errors, such as a missing alt text (granted, with Drupal 8 this is
already automatic). 

So, for a Drupal 7 site, these two modules can be employed in tandem: one is used for
ensuring accessibility in development, while the other is used in the live environment to
make sure that the content and design meet accessibility standards. Just a disclaimer,
though: the Accessibility module is not covered by Drupal’s security advisory
policy, since it uses the QUAIL jQuery plugin which is no longer supported.

A11y

Accessibility

Drupal 9 status: none of the modules are compatible with Drupal 9.

 
Accessibility Scanner

Accessibility Scanner is a relatively new module; the first development version was
released in March, while the latest alpha version was released just about two months
ago (June 20). With this module, you can use Drupal together with achecker to perform
web accessibility scans directly in the Drupal admin interface. 

Accessibility Scanner

Drupal 9 status: the module is compatible with Drupal 9.

Style Switcher

The Style Switcher module provides incredibly useful functionality for visitors that
suffer from color blindness. It allows themers to create themes with alternate
stylesheets, and site builders to add other alternate stylesheets right in the admin
section. 

A site visitor is then presented with all those styles as links in a block, and they can
choose the one that they prefer, e.g. one with the optimal contrast for their specific
type of color blindness.

Style Switcher

Drupal 9 status: the module is compatible with Drupal 9.

Block ARIA Landmark Roles

This module was already mentioned in part 2 of our series on web accessibility in
Drupal; it’s available for Drupal 7 and 8. It allows you to assign ARIA landmark roles
and/or ARIA labels to a block, which makes it easier for screen readers and other
assistive technologies to identify the type and purpose of a certain piece of content.
This greatly simplifies site navigation for visitors using such technologies. 

Block ARIA Landmark Roles

Drupal 9 status: the module is compatible with Drupal 9.

Text Resize

While it’s quite easy to resize the text of a page using the keyboard (‘ctrl’ and either
‘+’ or ‘-’), not everyone browsing the web is aware of that. The Text Resize module,
available for both Drupal 7 and Drupal 8, allows visitors to change the font size of a text
through a special block. It also comes with a ‘reset’ option which has to be enabled
from the admin page.

Text Resize

Drupal 9 status: the module is not compatible with Drupal 9.

Automatic Alternative Text

With this Drupal 8 module, you can automatically generate an alt text for an image for
which the user hasn’t provided any. This is done using the Microsoft Azure Cognitive
Services API.

It provides one or more descriptions of an image which are ordered according to

their confidence. The default descriptions are in English, but it is also possible to
translate them into other languages. 

Providing an alternative text is crucial for blind or visually impaired visitors using
screen readers, as it is pretty much the only means for them to take in the full content of
a page. On top of that, images with the provided alt text are more SEO-friendly and
thus help with your site's search engine ranking.

Even though Drupal 8 demands alt text by default for content creators, content
submitted by users should also include it, and this module enables just that.

Automatic Alternative Text

Drupal 9 status: the module is compatible with Drupal 9.

 
Fluidproject UI Options

The UI Options module by Fluid enables users to modify a page’s font size, line height,
font style, contrast and link style according to their preferences. All changes made are
retained thanks to cookies. 

The module does have some limitations, however. Bootstrap themes, for example,
need some additional CSS for font-sizing and line heights to work as they should,
and elements that use CSS gradients can’t have their contrast settings changed. 

Fluidproject UI Options

Drupal 9 status: the module is compatible with Drupal 9.

htmLawed

This is a very useful module not just in the context of accessibility, but also security. It
restricts and purifies HTML code so that it complies with the site administrator
policy and standards and security best practices. 

Using this module, you’re able to autocorrect and beautify HTML markup as well as
restrict HTML elements, attributes and URL protocols in the input. Moreover, it also
balances tags and ensures that HTML elements are properly nested, transforms
deprecated tags and attributes, etc. 

htmLawed

Drupal 9 status: the module is compatible with Drupal 9.

 
HTML Purifier

A very similar module to the just mentioned htmLawed, the HTML Purifier filter
library is again perfect for meeting both security and accessibility requirements. It
removes malicious code from your website while also ensuring W3C standards
compliance. 

HTML Purifier is a great fit for Drupal as it works really well with WYSIWYG
editors. With it, you get a lot of options, such as custom fonts, tables, inline styling, and
many more.

HTML Purifier

Drupal 9 status: the module is compatible with Drupal 9.

Drupal 9 bonus: Editoria11y (& CKEditor Accessibility Auditor)

Editoria11y is an accessibility checker aimed at content creators and editors which runs
automatically in the background. It provides a toggle which shows the number and
type of issues discovered, as well as giving additional information and suggestions
when clicked on. 

A similar module which also has a Drupal 9 compatible version is CKEditor

Accessibility Auditor. The main difference is that this module functions by pressing a
button which then runs HTML_CodeSniffer Accessibility Auditor. Additionally, as
its name suggests, it works exclusively with the WYSIWYG CKEditor.

Editoria11y

CKEditor Accessibility Auditor