Tiene un rol de accesibilidad válido

Link to Tiene un rol de accesibilidad válido copied to clipboard
Free Trial
Not for use with personal data

ID de regla: tiene un rol de accesibilidad válido

WCAG 2.0 (A) 4.1.2

accessibilityRole comunica el propósito de un componente al usuario de tecnología de asistencia.

accessibilityRole Puede ser uno de los siguientes:

  • ajustable Se utiliza cuando un elemento se puede "ajustar" (por ejemplo, un slider).
  • alerta Se utiliza cuando un elemento contiene texto importante para ser presentado al usuario.
  • botón Se utiliza cuando el elemento debe tratarse como un botón.
  • casilla de verificación Se utiliza cuando un elemento representa una casilla de verificación que puede estar marcada, desmarcada o tener un estado marcado mixto.
  • cuadro combinado Se utiliza cuando un elemento representa un cuadro combinado, que permite al usuario seleccionar entre varias opciones.
  • encabezado Se utiliza cuando un elemento actúa como encabezado para una sección de contenido (por ejemplo, el título de una barra de navegación).
  • imagen Se utiliza cuando el elemento debe tratarse como una imagen. Se puede combinar con un botón o enlace.
  • botón de imagen Se utiliza cuando el elemento debe tratarse como un botón y también es una imagen.
  • tecla del teclado Se utiliza cuando el elemento actúa como una tecla del teclado.
  • enlace Se utiliza cuando el elemento debe tratarse como un enlace.
  • menú Se utiliza cuando el componente es un menú de opciones.
  • barra de menú Se utiliza cuando un componente es un contenedor de varios menús.
  • elemento de menú Se utiliza para representar un elemento dentro de un menú.
  • ninguno Se utiliza cuando el elemento no tiene ningún rol.
  • progressbar Se utiliza para representar un componente que indica el progreso de una tarea.
  • radio Se utiliza para representar un radio.
  • radiogroup Se utiliza para representar un radiogroup.
  • barra de desplazamiento Se utiliza para representar una barra de desplazamiento.
  • search Se utiliza cuando un elemento de campo de texto también debe tratarse como un campo de búsqueda.
  • botón de incremento y decremento Se utiliza para representar un botón que abre una lista de opciones.
  • resumen Se utiliza cuando un elemento se puede usar para proporcionar un resumen rápido de las condiciones actuales de la aplicación cuando esta se inicia por primera vez.
  • interruptor Se utiliza para representar un interruptor que se puede encender y apagar.
  • pestaña Se utiliza para representar una pestaña.
  • lista de pestañas Se utiliza para representar una lista de pestañas.
  • texto Se utiliza cuando el elemento debe tratarse como texto estático que no puede cambiar.
  • temporizador Se utiliza para representar un temporizador.
  • botón de alternancia Se utiliza para representar un botón de alternancia. Debe usarse con accessibilityState checked para indicar si el botón está activado o desactivado.
  • barra de herramientas Se utiliza para representar una barra de herramientas (un contenedor de botones de acción o componentes).
  • cuadrícula Se utiliza con ScrollView, VirtualizedList, FlatList o SectionList para representar una cuadrícula. Agrega los anuncios de entrada y salida de la cuadrícula a GridView de Android.

Por qué es importante

Los elementos a los que se les asignan valores de roles no válidos no son interpretados por la tecnología de asistencia según lo previsto por el desarrollador.

Cuando los lectores de pantalla y otras tecnologías de asistencia no conocen la función de cada elemento, no pueden interactuar con él de forma inteligente ni tampoco pueden comunicar dicha función al usuario. Las características, propiedades y métodos de transmisión de información hacia y desde el usuario de un elemento no se pueden comunicar a través de tecnologías de asistencia cuando un valor de rol no es válido.

Cómo solucionar el problema

Asegúrese de que el valor accessibilityRole sea un rol válido.

Ejemplos exitosos

<TouchableOpacity accessibilityRole="button">
  <Text>Increase Count</Text>
</TouchableOpacity>

Ejemplos de fallos

<TouchableOpacity accessibilityRole="secondary-button">
  <Text>Increase Count</Text>
</TouchableOpacity>

Recursos