Accesibilidad en Jetpack Compose

La accesibilidad es crucial para crear apps inclusivas que todos puedan usar. Compose proporciona una base para compilar IUs accesibles que permiten que todos puedan usar tus apps en cualquier lugar.

Conceptos clave

  • Semántica: Es el sistema que representa el significado de los elementos de la IU para los servicios de accesibilidad. Esto incluye propiedades como descripciones, estados y acciones que un usuario puede realizar.

  • Recorrido: Es el orden en el que los servicios de accesibilidad, como TalkBack, navegan por los elementos en pantalla. Puedes personalizar este orden para mejorar la experiencia del usuario.

  • Acciones de accesibilidad: Son acciones específicas que un usuario puede realizar en un elemento de la IU, como hacer clic, desplazarse y descartar. Tu app se los comunica a los servicios de accesibilidad.

Comenzar

La base del modelo de accesibilidad y las herramientas de Compose es la semántica. Consulta la guía Semántica en Compose para obtener más información.

Cuando desarrolles tu app, ten en cuenta desde el principio estos pasos clave para mejorar la accesibilidad de la app de Compose:

  • Considera el tamaño mínimo del objetivo táctil: Asegúrate de que los elementos interactivos y en los que se puede hacer clic tengan, al menos, 48 dp. Esto cumple con los lineamientos de accesibilidad de Material Design.
  • Agrega etiquetas de clics: Describe el comportamiento de clics con el modificador clickable o semantics si no tienes acceso directo a clickable.
  • Describe los elementos visuales: Usa el parámetro contentDescription para describir imágenes y íconos de forma textual. Establece contentDescription en null para los elementos decorativos.
  • Define encabezados: Usa la propiedad de modificador semantics para marcar elementos como encabezados y facilitar la navegación.
  • Orden de recorrido del control: Usa isTraversalGroup para marcar grupos de elementos que deben leerse juntos. Usa traversalIndex para personalizar aún más el orden de los elementos dentro de esos grupos.

Para obtener más información, consulta la guía dedicada de Pasos clave para mejorar la accesibilidad de Compose.

Herramientas

  • TalkBack: Es el lector de pantalla de Google para Android. Actívala a fin de probar cómo funciona la semántica de tu app para los usuarios que dependen de tecnologías de accesibilidad.
  • Inspector de diseño: Visualiza y depura el árbol semántico de tu app.
  • APIs de prueba de Compose: Escribe pruebas que interactúen con elementos semánticos para confirmar la accesibilidad de tus IU de Compose.

Codelab

Si deseas obtener más información para admitir la accesibilidad en tu código de Compose, realiza el codelab Accesibilidad en Jetpack Compose.

Recursos adicionales