Categorías
Actualidad General

5 maneras de hacer que su sitio web sea accesible

Tecnologías de asistencia son todos aquellos dispositivos como lectores o magnificadores de pantalla, audífonos o líneas braille destinados a facilitar la navegación a través de la web, a todos aquellos usuarios con alguna discapacidad que les impida hacerlo por sí mismos.

Crear una interfaz amigable para estos usuarios y sus dispositivos es responsabilidad de programadores y diseñadores, quienes deben tomar en cuenta una serie de sencillos pasos que no solo ayudarán a estas personas, sino que, incluso, le harán la vida y la navegación más fácil a los usuarios convencionales.

1. Asegúrese de que su sitio web sea compatible con el teclado

Muchas tecnologías de asistencia dependen únicamente del teclado para navegar los sitios web, es por eso que es de primordial importancia que cualquier página o sitio puedan funcionar sin el uso de un mouse. Es decir, a la hora de programar, debe pensar qué haría un usuario si se le “escapa el ratón”, ya sea que se le rompa, se le descomponga o se le pierda.

En un caso así, o en el caso de las tecnologías de asistencia, el usuario debería tener la posibilidad de acceder a todas las funciones principales de la página usando sólo su teclado y la forma más común para hacerlo es usando la tecla Tab. Al presionar esta tecla, el usuario debe saltar entre las áreas de una página que cuentan con un “enfoque de teclado”, lo cual incluye enlaces, botones y formularios.

Por lo tanto, su objetivo debe ser garantizar que se pueda acceder a todo el contenido web y la navegación mediante Tab.

2. Todo el contenido debe ser fácilmente accesible

Otro problema a tomarse en cuenta para la fácil accesibilidad de la página es el contenido dinámico. Además de hacer que el sitio sea compatible con el teclado, también hay que asegurarse de que todo el contenido del sitio sea realmente accesible.

El contenido dinámico es aquel que cambia dependiendo de la actividad del usuario en el sitio —como las recomendaciones que nos hacen los sitios de compras luego de haber agregado artículos al carrito— o su ubicación geográfica —como las recomendaciones de restaurantes de algunas apps para ordenar comida a domicilio—.

En este caso, el problema es con las herramientas de asistencia, ya que si el sitio no les informa sobre dichos cambios, el usuario no se enterará de la existencia del nuevo contenido.

Por ejemplo, muchos lectores de pantalla leerán únicamente el sitio tal como aparece cuando se carga por primera vez; sin embargo, lo ideal es que le informen al usuario cuando el contenido cambie, para que este no se pierda el nuevo contenido.

Una de las formas de solucionar esto es usando puntos de referencia ARIA, que son como un banderín de un árbitro asistente en el futbol; este le avisa al lector de pantalla, que sería el árbitro principal, sobre lo que está sucediendo en un sector específico del campo de juego o, en este caso la pantalla.

Etiquetar el contenido dinámico como una “región en vivo” le permitirá a los lectores de pantalla y dispositivos similares comprender el contenido a medida que cambia.

3. Agregar texto alternativo a todas las imágenes

Es más o menos el mismo caso de los contenidos dinámicos. El texto alternativo de una imagen es lo que aparece en pantalla cuando el contenido gráfico no se puede cargar, por ejemplo “foto de una planta verde” dentro del recuadro donde debería estar la imagen de dicha planta.

Los lectores de pantalla acceden al texto alternativo (a veces denominado atributos alternativos, descripciones alternativas o etiquetas alternativas) para “leer” la imagen; por ello es preciso llenar estos campos con las descripciones necesarias, dándole a los usuarios un contexto que, de otra forma, se perderían.

Se puede pensar en estos como las notas a pie de página en un libro; estos le indican al lector de qué otro libro se extrajo el dato o la cita que está leyendo en ese momento o que aclaran alguna cifra o un dato extra, sin afectar la estructura del resto del texto.

4. Elige tus colores con cuidado

El daltonismo es mucho más que ver las cosas en blanco y negro o la incapacidad para distinguir el rojo del verde; como todo en la vida, hay grados de gris, es decir, hay diferentes niveles de daltonismo, incluso entre quienes no son formalmente daltónicos, cada persona percibe los colores de forma única.

Es por ello que es necesario asegurarse de que los colores seleccionados para su sitio tengan un adecuado nivel de contraste, para que todos puedan distinguir con claridad los diferentes elementos de la página.

Especialmente el texto necesita un buen contraste contra el fondo; en este caso lo ideal es establecer un color oscuro sobre uno claro, asegurándose de que no se desvanezcan entre sí.

Lo más usual es negro sobre blanco, ya que es la que se lee mejor y es eficaz para textos largos; el contrario, blanco sobre negro, se puede usar para textos cortos, que necesitan resaltar; cualquier otra combinación es poco recomendable, especialmente en el caso de gente con algún grado de ceguera al color, además de que suele considerarse que los textos en color son poco serios.

5. Use encabezados para estructurar el contenido correctamente

El uso correcto de los encabezados es clave para que su sitio sea accesible; son como las señales de carretera o como las líneas que marcan una cancha de futbol: le dan estructura al texto y le permiten al usuario y/o a los lectores de pantalla saber dónde están y qué están leyendo.

Además de mejorar el flujo de la página y ayudar a los lectores de pantalla, es muy fácil de hacer; los niveles de encabezado son autoexplicativos, el H1 es el más grande y de ahí puede llegar hasta el H6, que es el más pequeño.

No obstante, como ya se dijo, hay que usarlos de forma adecuada; por ejemplo, solo debe haber un H1 por página, ya que es el título del texto y lo primero que lee el usuario; a este le siguen todos los subtítulos, empezando por el H2, en los que se anidan los H3 y en estos, a su vez, los H4 y así sucesivamente.

Debe evitarse, por todos los medios, usar un H4 debajo de un H1 o de un H2, ya que sería como si el manchón penal estuviera a la mitad del campo o las líneas del área chica se extendieran fuera del área grande en un campo de futbol.

Conclusión

El correcto uso de los recursos de programación y diseño es clave para garantizar la accesibilidad de un sitio o página web; emplear de forma correcta y secuencial los encabezados, una buena selección de color, etiquetar cada imagen con su respectivo texto alternativo harán más amigable la experiencia no solo del usuario que necesita apps o dispositivos de asistencia, sino del público en general.

Esto último, a su vez, es una forma de incentivar la lealtad del usuario, el cual no solo querrá regresar a su página cada que lo necesite, sino que mejora las probabilidades de que la recomiende; así, el tráfico se incrementará y con ello las oportunidades de negocios también crecerán.

0 Reviews

Write a Review