Accesibilidad
no es lo que piensas Alberto Calvo – Senior Design Manager en Cabify
Slide 2
El portal de mi casa
Slide 3
¿Qué es ser un discapacitado?
Slide 4
Personas en silla de ruedas…
Slide 5
…o con un carrito de la compra…
Slide 6
… de bebé…
Slide 7
… o personas con movilidad reducida
Slide 8
Podrías ser tú
Slide 9
No es un binario, y puede ser temporal
Slide 10
Cada decisión tiene el potencial de
perjudicar o excluir a personas
Slide 11
La indiferencia hacia las personas y la realidad en la que viven es en realidad el único pecado cardinal en el diseño. — Dieter Rams
Slide 12
No es indiferencia, es ignorancia del problema y, a veces, de las plataformas para las que diseñamos
Slide 13
— EJEMPLOS —
Discapacidad
visual
Slide 14
Ser invidente…
Slide 15
… o tener baja visión…
Slide 16
1
1
Diferentes contrastes tipográficos experimentados desde la perspectiva de alguien con baja visión.
Slide 17
… incapacidad para diferenciar colores…
Slide 18
… o estar bajo luz directa del sol
Slide 19
Visual – ¿Qué hacer? 1. Cuidar la jerarquía del contenido 2. Utilizar componentes nativos o marcado semántico 3. Utilizar tamaños, pesos y contraste tipográfico suficiente 4.Asegurarnos de que la información no esté representada sólo por el color 5. Proporcionar descripciones alternativas para todas las imágenes que transmiten significado
Slide 20
Sabías que…
En 2008, 45 millones de personas sólo en Estados Unidos tenían una discapacidad visual
Slide 21
Visual – ¿Qué más hacer? 1. Dejar que el usuario cambie el tamaño del texto 2. No truncar el contenido cuando el tamaño del texto aumente
Slide 22
2
2
Dynamic Type en acción, aplicado en Mail.app.
Slide 23
3
3
Lo mismo, desde la perspectiva de alguien con baja visión.
Slide 24
Sabías que…
El simple uso de tipografías custom tiene un impacto
Slide 25
— EJEMPLOS —
Discapacidad
cognitiva
Slide 26
Tener dislexia, autismo, o una discapacidad de aprendizaje…
Slide 27
Slide 28
…estar cansado, estresado o deprimido…
Slide 29
… estar distraído o con prisa…
Slide 30
… o leer algo que no está en tu idioma o es muy denso
Slide 31
Slide 32
Cognitiva – ¿Qué hacer? 1. Proporcionar interfaces y contenidos sencillos, sin complicaciones y sin errores 2. Cuidar la jerarquía de ese contenido 3. Traducir nuestros contenidos a diferentes idiomas
Slide 33
— EJEMPLOS —
Discapacidad
física y motora
Slide 34
Tener una afección, como parálisis cerebral o atritis…
Slide 35
…o un control motor disminuido y menos preciso…
Slide 36
Slide 37
… estar lesionado…
Slide 38
… o estar en un vehículo en movimiento
Slide 39
Física y motora – ¿Qué hacer? 1. Ofrecer áreas de interacción suficientemente grandes en nuestros elementos interactivos 2. Soportar navegación por teclado o dispositivos de ayuda 3. Mostrar correctamente el foco de los elementos interactivos 4.Ofrecer control por voz
Slide 40
— EJEMPLOS —
Otros tipos
de discapacidad
Slide 41
Tener una discapacidad auditiva…
Slide 42
… estar en una reunión…
Slide 43
… tener mala conexión o un dispositivo de baja calidad…
Slide 44
… o tener un desorden vestibular, como el vértigo
Slide 45
Sabías que…
Las animaciones pueden provocar náuseas y vértigo
Slide 46
Otros – ¿Qué hacer? 1. Incluir subtítulos en nuestros contenidos 2. Proporcionar feedback visual y/o háptico 3. Mejorar tiempos de respuesta y latencia 4.Servir assets optimizados en peso 5. Proporcionar un modo offline 6.No requerir animaciones ni reproducir vídeo automáticamente 7. Proporcionar el control al usuario para desactivarlas
Slide 47
Accesibilidad y
negocio
Slide 48
Slide 49
Slide 50
Slide 51
Slide 52
Slide 53
Slide 54
Slide 55
Beneficios para el negocio 1. Impulsa la innovación, resolviendo problemas no anticipados 2. Mejora la imagen de marca 3. Minimiza el riesgo legal 4.Amplía el alcance del mercado
Slide 56
La accesibilidad es el fin. El diseño inclusivo es el medio. — Heydon Pickering
What the heck is inclusive design? – Heydon Pickering (24Ways)
Slide 57
No es diseñar para unos pocos, sino diseñar para todos
Inclusive Design at Microsoft by Kris Woolery
Slide 58
¿Quién se beneficia de…? ✔ Mejor navegación y localización de contenidos ✔ Mejor estructura y semántica ✔ Mayor contraste y legibilidad ✔ Mejor uso del lenguaje y simplicidad ✔ Mayor predictibilidad y consistencia ✔ Mejor prevención de errores y estados ✔ Mayor rapidez de carga y respuesta ✔ Mejor adaptación a las personas y a su situación