3 herramientas y 4 trucos para iniciarte en la accesibilidad web.
Desde Afaya, tanto Juan Manuel Rodriguez Perez como yo, nos preocupamos por la inclusividad y la accesibilidad. Es por ello que siempre estamos tratando de mejorar nuestros desarrollos, e ir haciéndolos más accesibles (ahora mismo estamos retocando nuestra web personal).
Si, como en nuestro caso, no tienes mucho conocimiento de accesibilidad y te gustaría mejorar tu web personal o aplicación web, aquí te dejamos unos recursos que nos encantan y unos consejos.
Accesibilidad web
Para evaluar la accesibilidad web general nos pareció muy útil Web Accesibility. Esta herramienta es similar a las que evalúan el rendimiento web y permite simplemente introduciendo una url comprobar el porcentaje de conformidad con los estándares WCAG. Nuestro objetivo, estar por encima del 85%.
Contraste de colores
A la hora de decidir la paleta de colores, tuvimos cuidado en elegir un contraste adecuado. Con esta medida no sólo beneficiamos a las personas que tienen problemas en diferenciar contrastes, sino a cualquier persona usuaria en una situación de alta luminosidad.
Para comprobarlo usamos la herramienta Color Contrast Accesibility Validator, que de nuevo es muy intuitiva y rápida.
Evaluar riesgos y errores
Para ayudarnos en el desarrollo estamos usando una extensión de Chrome y Firefox llamada a11y.css, la cual es muy útil porque va mostrando los diferentes errores y vulnerabilidades de nuestra web. Te dice además aquello que tienes que cambiar, consiguiendo que mejores enormemente la accesibilidad con pequeños cambios (por ejemplo añadirle el atributo type a un button).
Trucos
Los que nos funcionan son:
- Prueba a navegar con tabs, es indispensable para muchas personas. Con ello podemos ver si se puede, y si el flujo es el adecuado.
- Ponle siempre descripciones a las imágenes. Nosotros ahora mismo estamos aumentando las nuestras para que sean mas descriptivas y den una mayor visibilidad a todos los usuarios.
- Trata de mostrar el contenido como html, no como imágenes para que todo el mundo pueda acceder a él. Si cargamos una imagen como único contenido, aquellas personas que no puedan ver la pantalla se quedan sin ningún tipo de interacción.
- Dale una vuelta a las especificaciones, que son muy simples y son pequeños detalles a tener en cuenta que no cuesta hacer: https://lnkd.in/eq6r8Va
— — — — — —
Espero que esta publicación te haya sido útil. Si es así, por favor, dale un voto positivo y compártelo en tus redes sociales. Si lo deseas, puedes encontrarme en Twitter y en Linkedin.