Los usuarios de servicios de accesibilidad (como los lectores de pantalla) dependen de las etiquetas de contenido para entender el significado de los elementos que aparecen en las interfaces.
En algunos casos, como cuando la información se expresa de forma gráfica en un elemento, las etiquetas de contenido proporcionan un texto descriptivo de la acción o el significado asociado a ese elemento.
Si los elementos de una interfaz de usuario no cuentan con etiquetas de contenido, puede que a algunos usuarios les cueste entender la información que se muestra o realizar acciones en la interfaz.
Implementación
ViewSi se utilizan ciertos tipos de Views
en una interfaz, deben proporcionar etiquetas de contenido que describan la acción o el fin asociados a esa clase View
.
Cómo proporcionar etiquetas de contenido
android:contentDescription
A la hora de usar ImageView
, ImageButton
, CheckBox
u otra clase View
que exprese la información de forma gráfica, utiliza un atributo android:contentDescription
para incluir una etiqueta de contenido en esa clase View
.
En ocasiones, las etiquetas de contenido dependen de información que solo está disponible durante el tiempo en ejecución o el significado de una clase View
puede cambiar a lo largo del tiempo. Por ejemplo, es posible que el botón Reproducir se sustituya por el botón Pausar cuando la música se esté reproduciendo. En casos como este, utiliza View#setContentDescription(CharSequence contentDescription)
para actualizar la etiqueta de contenido en el momento adecuado.
Normalmente, si un servicio de accesibilidad describe una clase ViewGroup
, significa que combina etiquetas de contenido de sus clases Views
secundarias. Para anular este comportamiento e indicar que quieres incluir tu propia descripción en ese elemento y sus clases Views
secundarias no enfocables, configura contentDescription
en ViewGroup
. Es posible que tengas que incluir etiquetas de contenido de Views
secundarias en contentDescription
si has configurado ViewGroup
.
android:hint
En el caso de EditTexts
o TextViews
editables, utiliza un atributo android:hint
para indicar el objetivo del campo de texto. android:contentDescription
no se debe utilizar como una etiqueta de contenido de Views
editables.
android:labelFor
Utiliza un atributo android:labelFor
para indicar que una clase View
debería funcionar como una etiqueta de contenido de otra clase View
.
Casos en los que no se necesitan etiquetas de contenido
En algunos casos, las etiquetas de contenido no se deben proporcionar de forma específica:
- El texto renderizado mediante
TextView
(o sus subclases) se proporciona automáticamente a los servicios de accesibilidad. Las etiquetas de contenido adicionales no suelen ser necesarias. - Las imágenes decorativas o que no expresen información relevante de forma gráfica no necesitan etiquetas de contenido. En estos casos, configura un atributo
android:contentDescription
como"@null"
o un atributoandroid:importantForAccessibility
como"no"
.
Para obtener más información sobre cómo implementar etiquetas de contenido, consulta la página de formación para desarrolladores de Android y las guías de API.
Si se utilizan ciertos tipos de componibles en una interfaz, estos deben proporcionar etiquetas de contenido que describan la acción o el fin asociados a ellos.
Cómo proporcionar etiquetas de contenido
Descripciones de contenido
A la hora de proporcionar una etiqueta de contenido para Image
, Icon
u otro componible de nivel bajo que muestre información de forma gráfica, configura la descripción de contenido.
- Las etiquetas de contenido pueden depender de la información que se muestra en el tiempo de ejecución y el significado del componible puede cambiar. Por ejemplo, es posible que el botón Reproducir se sustituya por el botón Pausar cuando la música se esté reproduciendo.
- En estos casos, usa State para que Compose pueda observar los cambios en la descripción del contenido y vuelva a componerlo con el valor nuevo.Obtén más información sobre cómo usar State y Jetpack Compose.
- En algunos casos, es recomendable combinar los elementos en un solo elemento enfocable que incluya las etiquetas de contenido de sus elementos descendientes. Obtén más información sobre cómo combinar elementos.
Parámetro "label"
Algunos componibles, como TextField
, admiten el parámetro opcional label
. Si la etiqueta está configurada, el elemento muestra el componible que se ha transferido a label
. Se pueden utilizar los servicios de accesibilidad para describir el componible.
Casos en los que no se necesitan etiquetas de contenido
Las etiquetas de contenido no se deben añadir en determinados casos:
- El texto renderizado en
Text
u otros componibles que contenganText
se proporciona de forma automática a los servicios de accesibilidad. - Las imágenes decorativas o que no expresen información relevante de forma gráfica.
- En estos casos, configura el parámetro
contentDescription
o la propiedadModifier.semantics#contentDescription
comonull
o realiza una llamada aModifier#clearAndSetSemantics
.
- En estos casos, configura el parámetro
Diseño
Al diseñar una interfaz de usuario, debes tener muy en cuenta cómo debes etiquetar el contenido representado de forma gráfica para los usuarios de servicios de accesibilidad. Las etiquetas de contenido se deben basar en los siguientes principios:
- Describen de forma breve y clara el significado de la acción asociada a un elemento.
- No incluyen ningún tipo o estado del elemento.
- Si el elemento se ha asociado a una acción, describen la acción en lugar de la representación gráfica.
- No indican a los usuarios cómo deben interactuar con el elemento.
Para informarte más al respecto, lee las directrices para redactar contenido de accesibilidad de Material Design.
Pruebas
Sigue estos pasos para verificar de forma manual que no falta ninguna etiqueta de contenido en la interfaz de usuario de la aplicación:
- Activa TalkBack.
- Abre la aplicación.
- Utiliza gestos de navegación lineal para que el enfoque de accesibilidad recorra cada elemento de la pantalla.
- Si TalkBack resalta algún elemento, pero no explica en voz alta lo que este representa de forma significativa o dice un mensaje que no se corresponde con ninguna etiqueta, es posible que falte una etiqueta de contenido en dicho elemento.
Las herramientas de prueba automáticas de Android pueden detectar cuando faltan etiquetas de contenido. Te recomendamos que utilices Test de Accesibilidad para Android para probar tu aplicación manualmente en el dispositivo. Si quieres realizar pruebas automáticas, activa las comprobaciones de accesibilidad en Espresso y Robolectric.