No me gusta nada usar Elementor en Wordpress pero hoy una amiga me ha pedido arreglar un problema que tenía en una web. Se trataba de una web dentro del programa del KIT Digital, que sí o sí ha de obtener una puntuación de 100 en el apartado de accesibilidad de PageSpeed Insights para poder pasar la justificación del programa.
Total, que he visto que el problema era que en un listado de entradas los links de las imágenes no tenían un aria-label y que para ponerlo en Elementor como atributo la opción recomendada era ir a «Avanzado > Atributos» dentro del bloque y añadirlo ahí, pero resulta que esa opción solo es para la versión PRO y aunque mi amiga usa una versión de pago de Elementor de 5€ al mes, no paga la que permite arreglar cosas de accesibilidad, que son mínimo 14€ al mes, cosa que es inasumible para ella.
Así que he investigado varias opciones, como esta propuesta de añadir las aria label a través del archivo functions.php pero al final he usado este plugin, que sirve para cualquier Wordpress (con o sin Elementor):
Web Accessibility Toolkit – ARIA Labels & Roles for WCAG & ADA Compliance
En los ajustes hay una pestaña para «ARIA» y allí se pueden añadir las etiquetas sin demasiadas complicaciones.
pd1: No lo he probado, pero si en vez de añadir aria-label en Elementor queremos hacerlo en el propio editor de bloques de Gutenberg este plugin parece interesante.
pd: Si queréis más información sobre el uso de ARIA (Accessible Rich Internet Applications) y Wordpress este post está muy bien:
