Al hacer que su sitio web sea accesible para personas con discapacidades, el usuario termina siendo accesible para todos. De hecho, hacer que su sitio web sea más accesible puede incluso ayudar a las personas a encontrar su sitio web en los motores de búsqueda. ¿Por qué? Porque los motores de búsqueda utilizan algunas de las mismas señales que los lectores de pantalla para encontrar y entender el contenido de su sitio web.
¿Pero exactamente cómo se hace un sitio web accesible sin convertirse en un experto en codificación?
Estos son algunos consejos y trucos que casi cualquier persona con conocimientos básicos de HTML puede usar para mejorar la accesibilidad de su sitio web.
Herramientas de accesibilidad web
W3C tiene una fantástica lista de herramientas de accesibilidad web que puede utilizar como comprobador para detectar posibles problemas con su sitio web. Dicho esto, todavía recomiendo explorar un poco con un lector de pantalla y experimentarlo por ti mismo.
Comprensión de los lectores de pantalla
Una de las maneras más importantes en que puede mejorar la accesibilidad de su sitio web es asegurarse de que los lectores de pantalla puedan entenderlo. Los lectores de pantalla utilizan una voz sintetizada para leer el texto en la pantalla. Eso suena bastante sencillo; sin embargo, es posible que los lectores de pantalla u otra tecnología de asistencia no entiendan su sitio web de la forma en que lo tiene configurado actualmente.
Lo primero que debe hacer es probar un lector de pantalla y ver cómo funciona. Si está usando una Mac, intente usar VoiceOver.
- Ir Preferencias del Sistema.
- Seleccionar Accesibilidad.
- Seleccionar Narración.
- Revisa la caja para Habilitar VoiceOver.
Puede activarlo y desactivarlo mediante el comando F5.
Si está en una máquina con Windows, es posible que desee descargar NVDA. Puede configurarlo para que se active y desactive con el control de acceso directo + alt + n.
Ambos lectores de pantalla funcionan al permitir que el usuario navegue por el teclado (esto tiene sentido, si no puede ver, usar un mouse sería un desafío) y al crear un área de enfoque para la navegación. El enfoque es esencialmente donde el teclado está "señalado", pero generalmente se muestra como un cuadro resaltado alrededor del objeto de enfoque en lugar de un cursor.
Puede cambiar tanto el tono de la voz como la velocidad a la que se lee la voz si la configuración predeterminada es molesta (y después de unos cinco minutos de escuchar una lectura de voz lenta estándar, generalmente lo son). Las personas ciegas generalmente leen sitios web con sus lectores de pantalla configurados a altas velocidades.
Puede ayudar a cerrar los ojos mientras hace esto, pero también puede ayudar a mantenerlos abiertos y comparar. Algunas de las cosas que puede notar inmediatamente cuando intenta escuchar su sitio web es que parte del texto puede estar fuera de orden. Los títulos y las tablas se pueden mezclar. Las imágenes se pueden omitir o pueden decir "imagen" o algo igualmente inútil. Las tablas tienden a leerse como una serie de elementos sin contexto.
Usted puede, con suerte, arreglar esto.
Alt-Tags o atributo alternativo
La etiqueta alt o el atributo alternativo (alt) se usa en HTML para describir una imagen. En HTML, se ve algo como esto:
Incluso si realiza su sitio web con una herramienta visual que oculta su código HTML, casi siempre tendrá la oportunidad de ingresar una descripción de la imagen. No puede ingresar nada (alt = ""), pero sería mejor darle a cada imagen una descripción útil. Si fueras ciego, ¿qué necesitarías saber sobre la imagen? "Mujer" no es de mucha ayuda, pero tal vez "Mujer dibujando un diagrama de flujo de diseño que incluya accesibilidad, facilidad de uso, marca y diseño".
Texto del título
Los sitios web no siempre muestran la etiqueta de título HTML, pero es útil para los lectores de pantalla. Asegúrese de que cada una de las páginas de su sitio web tenga un título descriptivo (pero no excesivamente detallado) que informe a los visitantes de qué trata la página.
Dale a tu sitio web una buena jerarquía de información
Divida grandes trozos de texto con encabezados y, si es posible, use los encabezados con la jerarquía H1, H2, H3 de manera adecuada. No solo hace que su sitio web sea más fácil para los lectores de pantalla, sino que también lo hace más fácil para todos los demás. También es una gran señal para que Google y otros motores de búsqueda los ayuden a indexar mejor su sitio web.
Del mismo modo, debe asegurarse de que su sitio web se encuentre en un orden de contenido lógico y que no aparezca ningún recuadro de información no relacionada. Si está utilizando anuncios, observe que sus anuncios no sean demasiado intrusivos y que rompa el texto en su sitio web con demasiada frecuencia.
Hacer mejores mesas
Si está utilizando tablas HTML, puede agregar títulos a sus tablas utilizando la etiqueta para que los lectores de pantalla las entiendan con más facilidad, en lugar de simplemente hacer que el título de una tabla aparezca en negrita. También puede agregar el elemento "alcance" y etiquetar claramente las nuevas filas y columnas en su tabla para que los lectores de pantalla no se limiten a marcar una serie de celdas de la tabla sin dar contexto.
Teclado de navegación
En general, cualquier cosa que coloque en su sitio web debe ser algo que alguien podría hacer usando solo un teclado. Eso significa que sus botones de navegación no deberían ser botones desplegables animados si no puede usarlos con un lector de pantalla (pruébelo y vea si no está seguro, algunos botones están programados para usar con el teclado).
Subtítulos
Si agrega videos o elementos de audio a su sitio web, deberían tener subtítulos. HTML5 y muchos servicios de transmisión de video (como YouTube) ofrecen soporte de subtítulos. Los subtítulos son útiles no solo para la accesibilidad, sino también para los usuarios que pueden navegar por su sitio web en algún lugar donde no puedan reproducir audio, como en una oficina o en una ubicación ruidosa.
Para podcasts u otros elementos de audio, considere proporcionar una transcripción de texto. No solo es útil para las personas que no pueden escuchar el audio, tener el texto facilitará que Google y otros motores de búsqueda indexen ese contenido y ayuden a su ranking de Google.
ARIA
Si desea acceder al nivel avanzado de accesibilidad, las especificaciones HTML5 ARIA o WAI-ARIA pretenden ser el nuevo estándar en el futuro. Sin embargo, este es un manual técnico complejo (y en evolución), por lo que lo que podría hacer es usar un validador ARIA para analizar si su sitio web tiene algún problema que pueda resolver. Mozilla también tiene una guía más accesible para comenzar con ARIA.
