Principio 1/1.4 Distinguible/1.4.13-A

De WCAG Wiki

1.4.13-A. Control de contenido emergente por hover o focus

Discapacidades afectadas

Este criterio puede afectar a distintas personas con discapacidad. A continuación se indican las más relevantes.

Enunciado del criterio (Observatorio de Accesibilidad Web)

  • Cuando un componente de la interfaz recibe y luego pierde el foco (de puntero o teclado), y esto genera que un contenido adicional se haga visible y luego se oculte, se cumplen las tres condiciones siguientes:
    • Descartable: el contenido puede cerrarse sin mover el puntero ni el foco (por ejemplo, pulsando ESC).
    • Desplazable: si se activó con puntero, el puntero puede moverse sobre el contenido sin que este desaparezca.
    • Persistente: permanece visible hasta que el puntero o el foco se retira o se descarta.

Comprensión del criterio

Descripción resumida

Cualquier contenido que aparezca al pasar el cursor (hover) o al recibir el foco (focus) debe ser controlable, no obstruir la interacción y permanecer visible el tiempo necesario. El usuario debe poder mover el ratón sobre él, descartar el contenido fácilmente y mantenerlo visible hasta que lo cierre o mueva foco/ratón.

Objetivo

Facilitar el acceso a la información que aparece al pasar el puntero o enfocar un elemento, evitando que desaparezca de forma inesperada o bloquee contenido esencial.

Importancia de cumplir el criterio

Cuando tooltips, submenús o avisos aparecen y desaparecen sin control, pueden impedir la interacción, dificultar la lectura y frustrar tareas críticas, especialmente para personas que usan teclado, tienen temblores, necesitan más tiempo para procesar información o pueden activar elementos por error.

Referencias WCAG

  • SCR39: Ensuring hover content is dismissible, hoverable, and persistent
  • F95: Fallo por contenido en hover no accesible

Recursos de apoyo

  • Usar rol ARIA role="tooltip" cuando aplique
  • Utilizar :hover, :focus y control mediante teclado
  • Proveer botón de cierre accesible y ESC para cerrar
  • No depender del atributo title del navegador

Evaluación del criterio

Tipo de evaluación

Evaluación Comprobación manual

Procedimiento de evaluación

  1. Paso 1. Activar tooltips, menús o contenido emergente mediante ratón y teclado.
  2. Paso 2. Verificar que el contenido puede cerrarse fácilmente sin perder foco (ESC o botón cerrar).
  3. Paso 3. Pasar el puntero sobre el contenido y verificar que no desaparece.
  4. Paso 4. Comprobar que permanece visible hasta retirarlo o cerrarlo.

Resultado esperado

El contenido emergente cumple las condiciones de descartable, desplazable y persistente.

Ejemplo

Correcto: Tooltip con botón cerrar y ESC habilitado, permanece visible mientras el cursor está encima y desaparece al salir.

Incorrecto: Tooltip que desaparece cuando el puntero entra en él o que solo puede cerrarse retirando el foco.

Otras herramientas de evaluación

Navegación por teclado y pruebas manuales de movimiento del puntero.










Ejemplos accesibles y no accesibles creados por alumnos

Comentarios

A continuación se muestran comentarios sobre el criterio 1.4.13-A. Control de contenido emergente por hover o focus

Loading comments...




Obtenido de «https://wikiwcag.udl.cat/index.php?title=Principio_1/1.4_Distinguible/1.4.13-A&oldid=3347»