Mi travesía por la accesibilidad: Lo que he aprendido hasta ahora
Por Manuel Matuzović. Original en inglés, traducción al español por Liliana Ballesteros
El año pasado di una charla sobre CSS y accesibilidad en el stahlstadt.js meetup en Linz, Austria. Luego, un asistente me preguntó porque estaba interesado en accesibilidad: ¿Tenía yo o alguien en mi vida alguna discapacidad?
Estoy acostumbrado a responder esta pregunta — cuya respuesta es no — porque me la hacen todo el tiempo. Mucha gente parece asumir que una conexión personal es la única razón por la que alguien se interesaría en la accesibilidad.
Esto es un problema. Para que la web sea verdaderamente accesible, todo los que crean sitios web deben preocuparse por la accesibilidad. Tendemos a usar nuestras propias habilidades como punto de partida cuando diseñamos y desarrollamos sitios web. En cambio, necesitamos tener presente a nuestros diversos usuarios y sus diversas habilidades para asegurarnos que estamos creando productos incluyentes que no solo estén diseñados para un grupo específico de personas.
Otra razón por la que todos deberíamos pensar en accesibilidad es que nos hace mejores en nuestro trabajo. En 2016 participé en 10k Apart, una competencia organizada por Microsoft y An Event Apart. El objetivo era construir una experiencia web llamativa que funcionara sin JavaScript y que pudiera entregarse en 10kB. Además de eso, el sitio tenía que ser accesible. En ese momento, conocía algunos aspectos básicos de la accesibilidad como el uso de HTML semántico, proporcionar descripciones a las imágenes, y esconder contenido visualmente. Pero todavía quedaba mucho por aprender.
En cuanto seguí investigando, me di cuenta de que había mucho más sobre accesibilidad de lo que había imaginado, y que hacer sitios accesibles básicamente significa hacer un gran trabajo como desarrollador (o diseñador o gestor de proyecto, o escritor).
La accesibilidad es fascinante
La accesibilidad web no se trata solamente de una tecnología determinada. No se trata de escribir el código más sofisticado o de encontrar la solución más ingeniosa a algún problema; se trata de los usuarios y si son capaces de usar nuestros productos.
El enfoque en los usuarios es la principal razón por la cual me estoy especializando en accesibilidad y no sólo en animación, rendimiento, infraestructuras de JavaScript, o WebVR. Enfocarse en los usuarios significa que tengo que mantenerme al día con casi todas las disciplinas web, porque los usuarios van a cargar una página, tratarán con el markup de alguna manera, usarán un diseño, leerán texto, controlarán un componente JavaScript, verán animaciones, pasarán por un proceso, y navegarán. Lo que todas esas cosas tienen en común es que son realizadas por alguien al frente de un dispositivo. Lo que las hace fascinantes es que no sabemos qué dispositivo será, o qué sistema operativo o navegador. Tampoco sabemos cómo se utilizará nuestra aplicación o sitio, quién lo utilizará, qué tan rápida será su conexión a Internet o qué tan potente será su dispositivo.
Hacer sitios accesibles te obliga a comprometerte con todas estas variables — y te empuja, en el proceso, a hacer un gran trabajo como desarrollador. Para mí, hacer sitios accesibles significa hacer sitios rápidos y resistentes, con gran UX, que sean divertidos y fáciles de usar incluso en condiciones que no son ideales.
Lo sé, suena abrumador. La buena noticia, sin embargo, es que he pasado el último año centrándome en algunas de esas cosas, y he aprendido varias lecciones importantes que estoy feliz de compartir.
1. La accesibilidad es un concepto amplio
Mucha gente, como yo antes del 2016, piensa que hacer su sitio accesible es sinónimo de hacerlo accesible a las personas que utilizan lectores de pantalla. Eso es ciertamente muy importante, pero es sólo una parte del rompecabezas. Accesibilidad significa acceso para todos:
- Si tu sitio tarda 10 segundos en cargar en una conexión móvil, no es accesible.
- Si tu sitio sólo está optimizado para un navegador, no es accesible.
- Si el contenido de tu sitio es difícil de entender, tu sitio no es accesible.
No importa quién está usando tu sitio web o cuándo, dónde, y cómo lo están haciendo. Lo que importa es que puedan hacerlo.
La creencia de que hay que aprender nuevo software o incluso hardware para comenzar con la accesibilidad es una barrera para muchos desarrolladores. En cierto punto tendrás que aprender a usar un lector de pantalla si realmente quieres que todo quede bien, pero hay mucho más por hacer antes de eso. Podemos hacer muchas mejoras que ayuden a todos, incluyendo gente con discapacidades visuales, simplemente siguiendo mejores prácticas.
2. Existen discapacidades permanentes, temporales y circunstanciales
¿Quién se beneficia de un sitio de teclado accesible? Sólo un porcentaje pequeño de usuarios, podrían argumentar algunos. Aaron Gustafson me señaló el Kit de herramientas de diseño de Microsoft, que me ayudó a ampliar mi perspectiva. Las personas con discapacidades permanentes no son las únicas que se benefician de la accesibilidad. También hay personas con discapacidades temporales y circunstanciales que estarían felices de tener una forma alternativa de navegar. Por ejemplo, alguien con un brazo roto, alguien que recientemente se tatuó el antebrazo, o un padre que sostiene a su bebé en brazos mientras tiene que revisar algo en línea. Cuando ves a un desarrollador usar su editor, a veces pareciera como si no supiera que tiene un ratón. ¿Por qué no darl a los usuarios la oportunidad de utilizar tu sitio web de forma similar?
Al pensar en la gama de personas que podrían beneficiarse de las mejoras de accesibilidad, el grupo de beneficiarios tiende a crecer mucho más. Como dijo Derek Featherstone, “Cuando algo funciona para todos, funciona mejor para todos.”
3. El primer paso es hacer de la accesibilidad un requerimiento
Me han preguntado muchas veces si vale la pena el esfuerzo de arreglar la accesibilidad, cuánto cuesta, y cómo convencer a jefes y colegas. Mi respuesta a esas preguntas es que puedes mejorar las cosas significativamente sin tener que usar nuevas herramientas, gastar dinero extra, o pedirle permiso a nadie.
El primer paso es hacer de la accesibilidad un requerimiento — si no en papel, entonces al menos en tu cabeza. Por ejemplo, si estás buscando un componente de slider, escoge el que sea accesible. Si estás trabajando en un diseño, asegúrate que el contraste de colores sea lo suficientemente alto. Si estás escribiendo contenido, usa lenguaje que sea fácil de entender.
Nos hacemos muchas preguntas cuando hacemos decisiones de diseño y desarrollo: ¿Está limpio el código? ¿El sitio se ve bien? ¿El UX es genial? ¿Es lo suficientemente rápido? ¿Está bien documentado?
Como primer paso, agrégale otra pregunta a tu lista: ¿Es accesible?
4. Hacer sitios web accesibles es un deporte de equipo
Otra razón por la cual hacer sitios web accesibles suena aterrador para algunos desarrolladores es que hay una creencia de que somos los únicos responsables de hacerlo bien.
De hecho, como Dennis Lembree nos recuerda, “Casi todos en la organización son responsables de la accesibilidad en cierto nivel.”
El trabajo de un desarrollador es crear un sitio accesible desde el punto de vista del código, pero hay muchas cosas que hay que tener en cuenta antes y después de eso. Los diseños deben ser intuitivos, las interacciones claras y útiles, el texto debe ser comprensible y legible. Las personas y casos de uso relevantes deben ser definidos, y tienen que llevarse a cabo las pruebas correspondientes. Lo más importante es que las directivas y los equipos deben considerar la accesibilidad como un principio central y un requerimiento fundamental, lo que me lleva al siguiente punto: la comunicación.
5. La comunicación es clave
Después de hablar con una variedad de personas en reuniones y conferencias, creo que una de las razones por las que la accesibilidad a menudo no tiene el lugar que se merece, es que no todo el mundo sabe lo que significa. Muchas veces ni siquiera tienes que convencer a tu equipo, sino simplemente explicar qué es accesibilidad. Si quieres que la gente se una a la iniciativa, es importante cómo los abordas.
El primer paso es escuchar. Habla con tus colegas y pregúntales por qué toman ciertas decisiones de diseño, desarrollo o gestión. Intenta averiguar si no hacen las cosas de manera accesible porque no quieren, no les es permitido, o simplemente nunca lo han pensado. Tendrás mejores resultados si no se sienten mal, así que no intentes culpar a nadie por nada. Sólo escucha. Tan pronto sepas por qué hacen las cosas de de la manera en que las hacen, sabrás cómo abordar tus inquietudes.
Resalta los beneficios más allá de la accesibilidad
Puedes hablar de accesibilidad sin mencionarla. Por ejemplo, habla sobre la tipografía y el número ideal de caracteres por línea y lo hermoso que es el texto en combinación perfecta de tamaño de fuente y altura de línea. Demuestra cómo un mejor rendimiento impacta en las tasas de conversión y cómo enfocarse en la accesibilidad puede promover un pensamiento innovador que mejore la usabilidad en general.
Desafía a tus colegas
A algunas personas les gustan los retos. En una reunión, una diseñadora que se especializa en accesibilidad dijo una vez que una de las razones principales por las que le encanta diseñar con restricciones en mente es porque le exige mucho más que hacerlo de la manera fácil. Pregúntale a tus colegas, ¿Podemos llegar a un índice de velocidad por debajo de a 1000? ¿Crees que puedes diseñar ese componente de tal manera que sea accesible desde el teclado? ¿Mi Nokia 3310 tiene un navegador — no sería genial si pudiéramos lograr que nuestro próximo sitio web funcione allí también?
Ayuda a la gente a empatizar
En su charla “Every Day Website Accessibility,” Scott O’Hara señala que puede ser difícil para alguien empatizar si no sabe con qué debería empatizar. Algunas veces las personas no saben que ciertas implementaciones podrían ser problemáticas para otras. Puedes ayudarles explicando cómo las personas que son ciegas o no pueden usar un mouse, utilizan la web. Mejor aún, muéstrales videos de cómo la gente navega por la web sin mouse. Los Estímulos de Empatía (Empathy prompts) son también una gran manera de ilustrar diferentes circunstancias en las que la gente está navegando la web.
6. Habla sobre la accesibilidad antes del inicio de un proyecto
Por supuesto, es bueno si estás arreglando problemas de accesibilidad en un sitio que ya está en producción, pero eso tiene sus limitaciones. En cierto punto, los cambios pueden ser tan complicados y costosos que alguien argumentará que no vale la pena el esfuerzo. Si todo tu equipo se preocupa por la accesibilidad desde el inicio, antes que se dibuje una caja, o se escriba una línea de código, es mucho más fácil, efectivo, y rentable hacer un producto accesible.
7. Un conocimiento sólido de HTML resuelve muchos problemas
Es impresionante ver cómo JavaScript y la manera en que lo usamos ha cambiado en los últimos años. Se ha vuelto increíblemente poderoso y más importante que nunca para el desarrollo web. Al mismo tiempo, parece que HTML se ha vuelto menos importante. Hay una discusión en curso sobre CSS en JavaScript y si es o no más eficiente y limpio que el CSS normal desde el punto de vista del desarrollo. De lo que deberíamos hablar es del uso excesivo de los elementos <div> y <span> a expensas de otros elementos. Hay una gran diferencia entre usar un enlace o un<div> con un onclick handler. También hay una diferencia entre enlaces y botones cuando de accesibilidad se trata. Los elementos del formulario necesitan el elemento <label>, y un esquema sólido del documento es esencial. Estos son sólo algunos ejemplos de conceptos absolutamente básicos que algunos de nosotros olvidamos o nunca aprendimos. El HTML semántico es una de las piedras angulares del desarrollo web accesible. Aunque escribamos todo en JavaScript, HTML es lo que finalmente se reproduce en el navegador del usuario.
(Re)aprender HTML y usarlo a conciencia previene y arregla muchos problemas de accesibilidad.
8. JavaScript no es el enemigo y a veces incluso mejora la accesibilidad
Yo soy una de esas personas que cree que la mayoría de sitios web deberían ser accesibles incluso cuando JavaScript falla en ejecutarse. Eso no significa que odie JavaScript, claro que no — paga parte de mi alquiler. JavaScript no es el enemigo, pero es importante que lo usemos con cuidado porque de lo contrario es muy fácil cambiar la experiencia de usuario para mal.
No hace mucho tiempo, no sabía que JavaScript podía mejorar la accesibilidad. Podemos aprovechar su poder para hacer que nuestros sitios web sean más accesibles para los usuarios de teclado. Podemos hacer cosas como atrapar el foco en una ventana de modal, añadir controles de tecla a componentes personalizados, o mostrar y ocultar contenido de manera accesible.
Hay muchas implementaciones impactantes y creativas de sólo CSS en widgets comunes, pero a menudo son menos accesibles y producen peor UX que sus equivalentes de JavaScript. En una entrada sobre la creación de una herramienta de ayuda completamente accesible, Sara Soueudan explica porqué JavaScript es importante para la accesibilidad. “Cada una de las soluciones sin-JS presentaba un inconveniente muy grave que afectaba negativamente a la experiencia del usuario,” escribe.
9. Es un buen momento para saber CSS y JavaScript puros
Por mucho tiempo, hemos dependido de bibliotecas, frameworks, sistemas de retícula (grid systems) y polyfills porque le exigíamos a los navegadores más de lo que nos podían proporcionar. Naturalmente, nos acostumbramos a muchas de esas herramientas, pero de vez en cuando deberíamos dar un paso atrás y preguntarnos si realmente las necesitamos todavía. Hubo muchos problemas que Bootstrap y JQuery resolvieron, pero ¿todavía existen esos problemas, o es más fácil para nosotros escribir $() en lugar de document.querySelector()?
jQuery sigue siendo relevante, pero las inconsistencias de los navegadores no son tan malas como solían ser. La composición de retícula CSS (CSS Grid Layout) es compatible con los principales navegadores de escritorio, y gracias a la mejora progresiva aún podemos ofrecer experiencias a los navegadores heredados. Podemos hacer detección de funciones nativamente con feature queries, hacer pruebas se ha vuelto más fácil y caniuse y MDN nos ayudan a entender lo que los navegadores son capaces de hacer. Mucha gente usa frameworks y bibliotecas sin saber qué problemas están resolviendo esas herramientas. Para decidir si tiene sentido o no agregar el peso extra a tu sitio, necesitas un entendimiento sólido de HTML, CSS y JavaScript. En lugar de aumentar el peso de la página para los navegadores más antiguos, a menudo es mejor realzar una experiencia progresivamente. La mejora progresiva de nuestros sitios web — y la reducción del número de solicitudes, kilobytes y dependencias — los hace más rápidos, más robustos, y por lo tanto, más accesibles.
10. Sigue aprendiendo sobre accesibilidad y comparte tu conocimiento
Estoy verdaderamente agradecido por haber aprendido todo esto en los últimos meses. Anteriormente, yo era una parte muy pasiva de la comunidad web durante mucho tiempo. Desde que comencé a participar en línea, a asistir y organizar eventos y a escribir sobre temas relacionados con la web, especialmente accesibilidad, las cosas han cambiado significativamente para mí y he crecido tanto personal como profesionalmente.
Comprender la importancia del acceso y la inclusión, ver las cosas desde diferentes perspectivas, y cuestionar mis decisiones me ha ayudado a ser un mejor desarrollador.
Saber cómo deben hacerse las cosas es genial, pero es sólo el primer paso. Estar verdaderamente interesados, implementar y lo más importante, compartir tu conocimiento es lo que genera impacto.
Comparte lo que sabes
No temas compartir lo que has aprendido. Escribe artículos, habla en reuniones, y ofrece talleres internos. La cultura distintiva de compartir el conocimiento, es una de las cosas más importantes y hermosas de nuestra industria.
Ve a conferencias y reuniones
Asistir a conferencias y reuniones es muy valioso porque llegas a conocer muchas personas diferentes de las que puedes aprender. Existen varios eventos dedicados a la accesibilidad y muchas conferencias que incluyen al menos una charla sobre accesibilidad.
Organiza reuniones
Dennis Deacon describe su decisión de comenzar y dirigir una reunión de accesibilidad como una experiencia que cambia la vida. Las reuniones son muy importantes y valiosas para la comunidad, pero organizar una reunión no sólo aporta valor a los asistentes y oradores. Como organizador, conoces a todas estas personas y aprendes de ellas. Al escuchar y entender cómo ven y abordan las cosas, y lo que es importante para ellos, eres capaz de ampliar tus horizontes. Creces como persona, pero también conoces otros profesionales, agencias y compañías de las cuales también te puedes beneficiar profesionalmente.
Invita a expertos a tu reunión o conferencia
Si eres un organizador de reuniones o conferencias, puedes lograr un gran impacto en el papel que juega la accesibilidad en nuestra comunidad. Invita a expertos en accesibilidad a tu evento y dale un foro de discusión al tema.
Sigue a expertos en accesibilidad en Twitter
Sigue a expertos en Twitter para saber en qué están trabajando, qué les molesta, y qué piensan sobre los últimos avances en el desarrollo y diseño web inclusivo en general. He aprendido mucho de las siguientes personas: Aaron Gustafson, Adrian Roselli, Carie Fisher, Deborah Edwards-Onoro, Heydon Pickering, Hugo Giraudel, Jo Spelbrink, Karl Groves, Léonie Watson, Marco Zehe, Marcy Sutton, Rob Dodson, Scott O’Hara, Scott Vinkle, y Steve Faulkner.
11. Simplemente comienza
No tienes que ir con todo desde el principio. Si mejoras una sola cosa, ya estás haciendo un gran trabajo acercándonos a una mejor web. Sólo comienza y sigue trabajando.
Existen muchos recursos disponibles, y tratar de averiguar cómo y por dónde empezar puede resultar abrumador. He recopilado algunos sitios y libros que me ayudaron; espero que te ayuden a ti también. Las siguientes listas no son de ninguna manera exhaustivas.
Videos
- Este curso gratis de Udacity es una gran manera de comenzar.
- Rob Dodson cubre muchos temas diferentes de accesibilidad en su video series A11ycasts (a11y es abreviación de accesibilidad — el número once representa el número de letras omitidas).
Libros
- Heydon Pickering — Inclusive Design Patterns
- Laura Kalbag — Accessibility for Everyone
Blogs
Circulares
Componentes accesibles de JavaScript
Recursos y lecturas adicionales
- “A Developer’s Guide to Better Accessibility” (artículo)
- “Growing an Accessibility Meetup” (artículo)
- “Every Day Website Accessibility” (video)
- “5 Common Misconceptions About Web Accessibility” (artículo)
- “Designing the Conversation” (video)
- “Building a Culture of Accessibility: Leadership Roles” (artículo)
- “The Web Should Just Work for Everyone” (artículo)
- “A Very Good Time to Understand CSS Layout” (artículo)
- “JavaScript Is Not an Enemy of Accessibility!” (artículo)
- “Writing CSS with Accessibility in Mind” (artículo)
- “Understanding Progressive Enhancement” (artículo)