Destacada accesibilidad wordpress

Accesibilidad en WordPress

Es posible que la mayoría de los usuarios no aprecien ciertas funcionalidades que se destacan por brindar distintas y mejores formas de comprender el contenido de un sitio web. Esto no quita que en algunos casos, estas herramientas resulten fundamentales para usuarios con ciertas limitaciones cognitivas.

El objetivo de trabajar la accesibilidad de una página web es conseguir que el mayor número de usuarios, incluyendo personas con discapacidad que dependen de tecnología de asistencia para recorrer sitios web, puedan navegar sin problemas.

Las principales fortalezas que posee un sitio web con una accesibilidad elaborada están vinculadas a la inclusión, un mejor rendimiento, una audiencia más amplia y SEO de mayor calidad.

A continuación detallaremos algunas de las prácticas recomendadas para conseguir resultados positivos en materia de accesibilidad web.

  1. Usar textos alternativos en imágenes
  2. Escribir títulos descriptivos para las imágenes
  3. Escribir enlaces descriptivos
  4. Usar encabezados apropiadamente
  5. Elegir bien las tipografías y colores a utilizar
  6. Añadir transcripciones al contenido multimedia
  7. Configurar las etiquetas ARIA en los hipervínculos

Usar textos alternativos en imágenes

El agregar una descripción como texto alternativo para las imágenes de nuestro sitio web va a garantizar que usuarios con impedimentos de visión puedan comprender qué tipo de imagen tienen en frente al utilizar herramientas como la de “texto a voz“.

A su vez, este texto alternativo servirá para que los motores de búsqueda entiendan de qué trata la imagen.

Esto se puede editar desde la configuración de la imagen en Gutenberg, el editor de WordPress, o mismo desde la galería multimedia.

Escribir títulos descriptivos para las imágenes

Cuando se carga una imagen hay que considerar la experiencia de todos los usuarios, en especial la de quienes no pueden verla.

Esta descripción puede ser más creativa, a diferencia del texto alternativo que debe ser más literal, buscando reflejar el sentimiento que genera la imagen. Este texto se carga de manera similar al texto alternativo.

Escribir enlaces descriptivos

A la hora de presentar un hipervínculo asociado a un texto, por ejemplo no es lo mismo agregarlo a la palabra “Clic aquí” que a la palabra “Entrar en contacto“. De esta manera, el usuario puede interpretar de mejor forma la función de ese vínculo.

Usar encabezados apropiadamente

A la hora de insertar encabezados, es importante considerar que si bien se pueden aplicar con cierta libertad, deben estar ordenados jerárquicamente.

Al escribir una entrada en WordPress, podremos repasar estas jerarquías, así como el número de caracteres, palabras y el tiempo de lectura del artículo en la sección de “Resumen del documento” en la esquina superior izquierda del editor.

Si hay algún tipo de conflicto con el orden de los encabezados, lo veremos detallado en la lista para poder ubicarlo y corregirlo.

Elegir bien las tipografías y colores a utilizar

A la hora de elegir tipografías y colores es importante considerar la claridad y legibilidad para que el contenido sea accesible. Un ejemplo válido es tener en cuenta que el color de fondo del sitio tenga buen contraste en relación a los colores elegidos para textos y títulos.

En la configuración de color se podrá apreciar un mensaje de aviso en caso de que WordPress detecte si hay colores con poco contraste.

Añadir transcripciones al contenido multimedia

Si tu sitio web tiene contenido de audio y videos, es recomendable cargar subtítulos no solo de diálogos sino transcripciones documentando sonidos y acciones que se dan en pantalla.

Se recomienda que tanto audios como videos no se reproduzcan automáticamente pero en caso de que esto no sea posible, es recomendable ofrecer opciones de control para la reproducción, pausa y volumen del contenido.

Configurar las etiquetas ARIA en los hipervínculos

Finalmente destacamos la relevancia de las etiquetas ARIA (Accessible Rich Internet Applications), atributos HTML cuyo fin es proveer al usuario de información adicional sobre el propósito y funcionalidad de determinados elementos.

En Elementor, por ejemplo, podemos agregar una etiqueta ARIA al seleccionar por ejemplo un botón. Al elegirlo, deberemos ir al ícono de “Opciones del enlace” para acceder al campo de “Atributos personalizados”. Una vez allí, se deberá ingresar la etiqueta de la siguiente manera: aria-label|Texto de ejemplo.

De esta manera el botón quedará listo para que los usuarios que utilizan la funcionalidad de “texto a voz”, al tabular y seleccionar dicho elemento, puedan escuchar a la asistencia de voz que leerá en voz alta “Texto de ejemplo”.

Podemos concluir que el desarrollo de la accesibilidad de un sitio web es un beneficio tanto para quienes lo diseñan y quienes lo visitan. Ofrecer soluciones como las que repasamos en este artículo implica mejorar el rendimiento del sitio a nivel SEO y llegar a una audiencia mayor mientras que ofrecemos una experiencia más amena y completa a quienes poseen algún tipo de impedimento para consumir contenido audiovisual.

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Web Hosting Profesional

Más de 20 años de experiencia online a su disposición.