Skeleton

• Cargas medibles que tardan más de 200 ms.
• Listas, tarjetas y bloques de detalle donde la forma del contenido es predecible.
• Cuando puedes reservar el alto y el ancho reales para no provocar saltos al pintar.

• Cargas menores a 200 ms: el destello distrae más que ayuda.
• Cargas indeterminadas o muy variables: usa un spinner.
• Bloques pequeños y aislados donde un spinner inline es suficiente.

El skeleton debe parecerse al contenido real. Mantén proporciones, número de líneas y posición de elementos para que la transición se sienta natural.

• Marca el skeleton con aria-hidden para que el lector de pantalla no lo lea.
• Acompaña la zona en carga con una región aria-live polite y un texto como Cargando expedientes.
• Al cargar, anuncia el resultado en la misma región: 14 expedientes cargados.
• Respeta prefers-reduced-motion: detén el shimmer si el usuario reduce movimiento.

• Si la carga supera 3 segundos, agrega un mensaje breve: Cargando expedientes…
• No mezcles skeletons con datos ya cargados de manera intercalada: confunde la jerarquía.