CLS (Cumulative Layout Shift): qué es y cómo evitarlo
CLS es la tercera métrica de Core Web Vitals. Es un valor sin unidad entre 0 y varios puntos que cuantifica la suma de desplazamientos inesperados del contenido durante la carga.
Umbrales:
- Bueno: menos de 0.1 (casi imperceptible)
- Regular: entre 0.1 y 0.25
- Malo: más de 0.25 (visiblemente incómodo)
Causas típicas: imágenes sin width/height reservados, anuncios o widgets que cargan con retraso, fuentes web sin font-display: swap configurado, banner de cookies que empuja el contenido al aparecer.
Por qué importa
CLS no se arregla con optimización: es puramente higiene de desarrollo. Reservar espacio a las imágenes desde el HTML, anclar banners tardíos en overlays, y controlar el swap de fuentes elimina la mayoría de los problemas. Un CLS visible es frustración pura para el usuario.
¿Esto aplica a tu web?
En 10 segundos te decimos cómo está tu sitio respecto a los términos del glosario: Core Web Vitals, schema, seguridad, accesibilidad, SEO técnico.