Básicos de la Accesibilidad Web

La accesibilidad web es la práctica inclusiva de hacer nuestros sitios web accesibles para personas con algún tipo de discapacidad. Mediante la creación de sitios accesibles, se busca que estas personas puedan percibir, entender, navegar e interactuar con la web y aporten a sus contenidos.

El aseguramiento de la accesibilidad en la web, también beneficia a personas con discapacidades transitorias, personas de avanzada edad y a aquellas que cuentan con conexiones lentas a internet o dispositivos con pobre desempeño.

¿Por qué es importante la accesibilidad web?

Crear sitios web accesibles es lo correcto, de esta manera estamos asegurando que más personas tengan acceso equitativo a la información y servicios, sin importar su edad, condición o situación.

Al implementar la accesibilidad, lograremos atraer a una mayor cantidad de usuarios a nuestros sitios, lo que se traduciría en mejorar el posicionamiento de nuestras páginas y aumentar la reputación de la marca.

Por otro lado, en algunos países es una obligación legal, es decir, existen legislaciones que regulan su aplicación.

"El poder de la web está en su universalidad." Tim Berners-Lee , director del W3C e inventor de la World Wide Web.

Principios

La W3C, World Wide Web Consortium, es un consorcio internacional que establece las recomendaciones y estándares para la web, a través de los documentos WCAG, Web Content Accessibility Guidelines, explican cómo hacer contenido más accesible para personas con discapacidades.

Estos estándares están consolidados en cuatro principios, cada uno de estos medidos por un nivel de conformidad: A, AA y AAA, siendo el primero, el requisito mínimo de cumplimiento y el último, el que cumple con todos los criterios de accesibilidad. Veamos cuáles son:

• Perceptible: ¿Estás presentando alternativas textuales a los contenidos visuales? Las imágenes de tu página deberían incluir una descripción del contenido en modo de texto que las tecnologías de asistencia puedan leer.

• Operable: ¿Puede tu sitio ser manejado desde el teclado? Es importante facilitar la interacción del usuario con el contenido de tu página, proporcionándole distintas formas de navegación.

• Comprensible: ¿Es clara y legible la información que presentas a tus usuarios? Esta debe ser presentada de tal manera que sea entendido por el usuario, abarca desde hacer que los textos sean legibles y manejar un adecuado contraste de los colores, hasta usar textos con palabras que sean de fácil interpretación, es decir, evita el uso de palabras demasiado técnicas e intenta manejar un lenguaje sencillo.

• Robusto: ¿Usas la semántica en tus documentos HTML que permitan a las diferentes tecnologías de asistencia leer tu sitio? HTML, Hypertext Markup Language, usado de manera correcta ayuda a los lectores de pantalla a representar de manera eficaz el significado del contenido web.

Si respondiste que no a una o más preguntas, no te preocupes, algunos de los problemas de accesibilidad más comunes que dificultan o imposibilitan el uso de los sitios web se pueden solucionar fácilmente, sin incurrir en costos adicionales y sin sacrificar el diseño.

Prácticas recomendadas

Siempre será más útil tomar las decisiones de accesibilidad desde el inicio de nuestros proyectos, comenzando por la idea, pasando por el diseño y, desde luego, durante su desarrollo; esto nos ahorrará en un futuro tener que rehacer algunas cosas. Aún así, nunca es tarde para empezar a evaluar los sitios web en producción y comprender las mejoras que podemos realizar.

A continuación, veremos tres de los errores más comunes en accesibilidad y cómo podemos evitarlos:

1. Bajo contraste en el texto: De los errores más comunes cuando se prueban sitios web es el contraste de los colores, pero es relativamente fácil de solucionar. Existen herramientas online, con las cuales puedes probar el contraste de color en los textos y te ayudarán a determinar qué tan legibles son, como por ejemplo, WAVE y Contrast Ratio, entre otras. Los textos requieren un contraste de al menos 4.5:1 o más, con relación al fondo. Para textos grandes, debe ser de 3.1 y para textos normales 7.1.

2. No incluir el texto alternativo en las imágenes: Este es un problema de accesibilidad muy conocido que no ha desaparecido. Para solucionarlo, solo debemos incluir el atributo alt a las imágenes del sitio con una descripción clara y sencilla que corresponda con el contenido real de la imagen. Recuerda que el texto debe permitir que una persona que no puede ver la imagen obtenga la misma información que una persona que sí puede verla.

3. No usar HTML semántico: Cada una de las etiquetas HTML cumplen una función específica, usarlas para lo que fueron creadas garantizará que los lectores de pantalla puedan leer más facilmente nuestros sitios. Por ejemplo, nunca use un div, span o, link para crear un botón, cuando podría usar la etiqueta button, semánticamente más significativa. Aquí puede leer cómo usar HTML para garantizar una mayor accesibilidad.

Para los casos en los que el HTML no alcanza, existen los atributos Aria, Accessible Rich Internet Applications, esta especificación amplía el HTML nativo, lo que le permite cambiar la forma en que un elemento HTML se traduce para la tecnología asistiva.

BONUS

Tamaño de la fuente: En la medida de lo posible, evite el uso de los pixeles, ya que estos podrían variar dependiendo de la resolución de la pantalla. En su lugar, use rem, esta medida va a depender del tamaño del texto base y se ajusta mejor a cualquier resolución de pantalla. Si no hemos definido ningún font-size en el html, tomará el valor del navegador. Por ejemplo, 1rem = 16px, si quiere definir un tamaño de texto de 24 pixeles, use: font-size: 1.5rem.

En los siguientes links, podrás consultar más tips para hacer sitios web accesibles: Top 10 Tips for Making Your Website Accessible y WebAIM's WCAG 2 Checklist

Conclusión

Si bien, crear sitios web accesibles puede implicar un poco más de esfuerzo, no es equiparable frente a los beneficios de garantizar que una población más amplia pueda acceder a la web. Al implementar las mejores prácticas de accesibilidad, también estás mejorando la usabilidad del sitio para todos los usuarios. Preocupémonos por la inclusión y motivemos el aseguramiento de la accesibilidad en los sitios web.