Acción inaccesible

This page is not available in the language you requested. You have been redirected to the English version of the page.
Link to this page copied to clipboard
Not for use with personal data
note

Esta es una regla experimental y por lo tanto sus resultados se consideran en prueba beta. Obtenga más información sobre las reglas experimentales y cómo puede ayudar a mejorarlas.

WCAG 2.0 - 2.1.1 A Impacto - Crítico

Las vistas interactivas deben poder enfocarse con tecnología de asistencia.

Nota: Esta regla anteriormente se llamaba Vista accesible inactiva.

Impacto

Los problemas detectados por esta regla afectan a cualquier persona que utilice tecnología de asistencia. Es un problema la incapacidad de interactuar con un control utilizando tecnología de asistencia (AT), cuando sin la AT se puede interactuar con el mismo control.

note

La versión de Android, el dispositivo y el fabricante pueden influir en la detección de problemas.

Confirmación

  1. Activar TalkBack o SwitchAccess
  2. Ocurrirá uno de los siguientes casos:
    • Inaccesible: no es posible enfocar la vista ni interactuar con ella.
    • Accesible: La vista está enfocada y disponible para interactuar con ella.

Cómo solucionarlo

XML

Evite configurar la propiedad importantForAccessibility en vistas que se puedan tocar con información significativa en no. Las vistas a las que las personas pueden acceder sin tecnología de asistencia deberían estar disponibles para quienes utilizan tecnología de asistencia.

Compose

Evite marcar las vistas tappable de Compose con información significativa como invisibleToUser. Las vistas a las que las personas pueden acceder sin tecnología de asistencia deberían estar disponibles para quienes utilizan tecnología de asistencia.

En ambos ejemplos a continuación, elimine invisibleToUser para garantizar que las vistas estén disponibles para las personas que usan tecnología de asistencia.

Button(onClick = {  },
    modifier = Modifier.semantics {
        //Remove the below API to make it accessible
        invisibleToUser()
    }
) {
    Text("Click here")
}


FloatingActionButton(onClick = {  }) {
    Image(
        painter = painterResource(id = R.drawable.floating_button),
        contentDescription = "floating button",
        Modifier.semantics { 
            //Remove the below API to make it accessible
            invisibleToUser() 
        }
    )
}

React Native

Este problema de accesibilidad no puede ocurrir en la mayoría de los controles táctiles o presionables en React Native; sin embargo, este problema puede ocurrir con algunos controles activos personalizados.

Opción 1: Permitir que la vista principal gestione el foco Establezca la propiedad accessible de la vista contenedora en verdadero y es accessibilityElementsHidden propiedad en falso. Asigne lo apropiado accessibilityRole para que coincida con el comportamiento esperado. Estas propiedades permitirán que el control personalizado se active mediante tecnología de asistencia.

<View
  accessible={true}
  accessibilityElementsHidden={false}
  accessibilityRole='link'
  accessibilityLabel='Learn more about Deque'
  onTouchStart={openLink}
>
  <Image 
    source={DequeLogo}
    style={{ width: 100, height: 100 }} 
  />
</View>

Opción 2: Permitir que el elemento maneje el foco En el control, establezca la accessible propiedad en verdadero, la accessibilityElementsHidden propiedad en falso y asigne la accessibilityRole propiedad adecuada para que coincida con el comportamiento esperado. Estas propiedades permitirán que el control personalizado se active mediante tecnología de asistencia.

<Image
  source={DequeLogo}
  accessible={true}
  accessibilityElementsHidden={false}
  accessibilityRole='link'
  accessibilityLabel='Learn more about Deque'
  onTouchStart={openLink}
  style={{ width: 100, height: 100 }}
/>