Accesibilidad en aplicaciones móviles: normas y guías

¿Sabías que el daltonismo afecta a 1 de cada 12 hombres (8%) y a 1 de cada 200 mujeres? Esto representa aproximadamente el 4,5% de la población mundial. Esto se traduce en más de 350 millones de personas daltónicas en todo el mundo y unos 2 millones en España (Fuente: “colorblindguide”). 

Además, en España, alrededor de 1 millón de personas tienen problemas de audición, que van desde sordera profunda hasta diversos grados de pérdida auditiva, según la Confederación Estatal de Personas Sordas (CNSE). También, la “ONCE”  informa que el 2,14% de la población en España sufre alguna discapacidad visual, de las cuales 920.900 personas presentan baja visión y 58.300 son ciegas.

La accesibilidad en dispositivos móviles no solo es crucial para estas personas con discapacidades permanentes, sino también para aquellos que enfrentan discapacidades temporales o situacionales. Por ejemplo, alguien con un brazo escayolado (discapacidad temporal) o una persona que sostiene a un bebé (discapacidad situacional) y necesita usar su dispositivo con una sola mano. Por eso, es esencial diseñar interfaces móviles que sean manejables y accesibles, garantizando una experiencia de usuario eficiente para todos.

Teniendo en cuenta que hay millones de personas con discapacidades visuales, auditivas, motoras y cognitivas que necesitan acceder a las aplicaciones móviles. Diseñar con la accesibilidad en mente asegura que estos usuarios puedan interactuar con el producto de manera efectiva.

Al hacer que las aplicaciones sean accesibles, los diseñadores promueven la igualdad de oportunidades, permitiendo que todas las personas, independientemente de sus capacidades, puedan utilizar las tecnologías de manera autónoma.

¿Qué es la accesibilidad en aplicaciones móviles?

La accesibilidad en el diseño UX y UI se refiere a la creación de productos digitales que sean utilizables por todas las personas, independientemente de sus capacidades técnicas, físicas o cognitivas. Esto implica diseñar interfaces que puedan ser navegadas y comprendidas por usuarios con discapacidades, así como por aquellos que enfrentan discapacidades temporales o situacionales. 

Para UX Designers, esto significa implementar prácticas de diseño inclusivo, utilizar tecnologías de asistencia, y seguir estándares y normativas que aseguren que todos los usuarios puedan interactuar con el contenido de manera efectiva y sin barreras.

Principios de accesibilidad

Estos principios de la WCAG aseguran que las aplicaciones móviles sean accesibles y usables por todos los usuarios, incluyendo aquellos con discapacidades. 

Implementar estos principios no solo cumple con las leyes y estándares internacionales, sino que también mejora la experiencia de usuario para una audiencia más amplia. Los principales principios de accesibilidad son: 

1. Perceptible: los componentes de información y de interfaz de usuario deben ser presentables para los usuarios de manera que puedan percibirlos.
   • Esto significa que los usuarios deben poder percibir la información que se presenta (no puede ser invisible para todos sus sentidos).
2. Operable: los componentes de la interfaz de usuario y la navegación deben ser operables.
   • Esto significa que los usuarios deben poder operar la interfaz (la interfaz no puede requerir una interacción que un usuario no pueda realizar)
3. Comprensible: la información y el funcionamiento de la interfaz de usuario deben ser comprensibles.
   • Esto significa que los usuarios deben poder comprender la información y el funcionamiento de la interfaz de usuario (el contenido o el funcionamiento no pueden estar más allá de su comprensión).
4. Robusto: el contenido debe ser lo suficientemente sólido como para que pueda ser interpretado de manera confiable por una amplia variedad de agentes de usuario, incluidas las tecnologías de asistencia.
   • Esto significa que los usuarios deben poder acceder al contenido a medida que avanzan las tecnologías (a medida que las tecnologías y los agentes de usuario evolucionan, el contenido debe permanecer accesible)

Pautas de accesibilidad móvil

1. Contraste entre fondo y texto

El principio de contraste entre fondo y texto establece que debe haber una diferencia suficiente de luminosidad y color entre el texto y su fondo, un mínimo de contraste de 3 a 1 para asegurar que el contenido sea legible para todos los usuarios, incluyendo aquellos con discapacidades visuales. 

Este principio es crucial para que el texto sea fácilmente distinguible y legible en diversas condiciones de iluminación y para personas con deficiencias visuales.

2. Utiliza tipografías sencillas

Utilizar tipografías sencillas, tamaños de fuente recomendados y espaciados adecuados es esencial para mejorar la legibilidad y accesibilidad de las interfaces móviles.

• Tamaños de fuente entre 14 y 18 puntos.
• Interlineado de al menos 1,5 veces el tamaño de la fuente.
• Espaciado entre letras (tracking) de al menos 0,12 veces el tamaño de la fuente.
• Espacio entre palabras de al menos 0,16 veces el tamaño de la fuente.
• Uso de tipografías simples y sin adornos. Se recomienda utilizar las fuentes nativas del sistema operativo, como Roboto para Android y San Francisco para iOS, que están diseñadas específicamente para una buena legibilidad en dispositivos.

3. Uso de recursos gráficos adicionales al color para mejorar la accesibilidad

Acompañar las acciones con otros recursos gráficos además del color es crucial para asegurar la accesibilidad en una interfaz. Esto significa que, además de usar colores para comunicar información, se deben incluir iconos, símbolos, textos y patrones que transmitan la misma información. 

Por ejemplo, junto al color rojo para indicar un error, agregar un icono de advertencia y un mensaje de texto explicativo.

4. Título en los campos de texto

Mostrar siempre el título en los campos de texto. Los títulos o etiquetas asociadas a cada campo de texto deben ser claramente visibles en todo momento, no solo cuando el campo está vacío. 

Esto ayuda a los usuarios a comprender rápidamente qué información se requiere, especialmente aquellos con discapacidades cognitivas o problemas de memoria a corto plazo. Además, mantener las etiquetas visibles asegura que los usuarios que utilizan lectores de pantalla puedan identificar y navegar entre los campos de manera efectiva

5. Utiliza placeholders

Utilizar placeholders en los campos de texto es útil para proporcionar ejemplos de formato o información esperada, ayudando a los usuarios a entender claramente qué tipo de datos deben ingresar. Los placeholders son textos temporales dentro de los campos que desaparecen cuando el usuario empieza a escribir.

6. Ofrece textos de ayuda para una mayor comprensión

Ofrecer textos de ayuda proporciona explicaciones adicionales y aclaraciones sobre cómo utilizar una función o qué tipo de información se necesita en un campo específico. Estos textos, que pueden aparecer como consejos, descripciones o mensajes emergentes, son esenciales para usuarios que puedan necesitar orientación adicional.

7. Diseña botones grandes

Diseñar botones grandes y fácilmente reconocibles, con un área inactiva a su alrededor, mejora significativamente la accesibilidad y usabilidad de una aplicación. 

Los botones grandes son más fáciles de tocar y minimizan errores, especialmente para personas con discapacidades motoras o problemas de coordinación. El área inactiva alrededor del botón evita toques accidentales en otros elementos, facilitando una interacción más precisa y cómoda.

8. Estructura, coherencia en todas las pantallas

Esto significa que los elementos de navegación, los botones, los campos de texto y otros componentes de la interfaz deben ubicarse de manera consistente en cada pantalla. La coherencia permite a los usuarios familiarizarse rápidamente con el diseño y las funciones de la aplicación, reduciendo la curva de aprendizaje y evitando confusiones.

Por ejemplo, si tenemos una barra de herramientas, colocaremos ésta siempre en la misma zona en las diferentes pantallas.

9. Indicar el error específico

Cuando un usuario comete un error al ingresar información en un formulario, el mensaje de error debe ser claro y específico sobre qué está mal y cómo corregirlo.

En lugar de mensajes genéricos como «Error en el formulario», proporciona detalles concretos, como «El correo electrónico ingresado no es válido» o «La contraseña debe tener al menos 8 caracteres»

10. Simplifica los gestos 

Gestos complejos, como múltiples toques, pellizcos o deslizamientos en varias direcciones, pueden ser difíciles de ejecutar para muchos usuarios, especialmente aquellos con discapacidades motoras, personas mayores, o usuarios que no están familiarizados con las tecnologías táctiles. En su lugar, opta por gestos simples y estándares, como toques únicos y deslizamientos horizontales o verticales, que sean intuitivos y fáciles de recordar.

Diseñar con accesibilidad en mente no solo cumple con las normativas y estándares internacionales, sino que también amplía el alcance de la aplicación, asegurando que todas las personas usuarias puedan interactuar con ella de manera efectiva y eficiente.

---

Foto de portada de Riccardo Annandale en Unsplash.