· 11 min de lectura
Core Web Vitals: guía completa de LCP, INP y CLS
Los Core Web Vitals son tres métricas con las que Google resume la experiencia que tienen los usuarios reales al usar una página: cuánto tarda en aparecer el contenido principal, cuánto tarda en responder a una interacción y cuánto se mueve el contenido mientras carga.
LCP: Largest Contentful Paint
Mide cuándo se pinta el elemento visible más grande del viewport inicial, normalmente una imagen de cabecera o un titular. El objetivo es que ocurra en menos de 2,5 segundos.
Las causas habituales de un LCP alto son un servidor lento, una imagen principal muy pesada, recursos que bloquean el renderizado por delante de ella o una carga diferida mal aplicada al propio elemento LCP.
- Reduce el TTFB con caché de página
- Sirve la imagen LCP en formato moderno y tamaño adecuado
- Nunca apliques lazy loading al elemento LCP
- Precarga el recurso crítico y evita CSS/JS bloqueantes por delante
INP: Interaction to Next Paint
Sustituyó a FID en 2024 y mide la latencia de las interacciones reales durante toda la visita: clics, toques y pulsaciones de teclado. El objetivo es mantenerlo por debajo de 200 milisegundos.
Un INP alto casi siempre significa que el hilo principal está ocupado ejecutando JavaScript. Los culpables típicos son maquetadores pesados, scripts de terceros y manejadores de eventos que hacen demasiado trabajo de golpe.
- Reduce y difiere el JavaScript no crítico
- Trocea las tareas largas para liberar el hilo principal
- Carga chats, mapas y widgets solo cuando el usuario los necesita
- Revisa el coste real de cada etiqueta del gestor de etiquetas
CLS: Cumulative Layout Shift
Mide cuánto se desplaza el contenido de forma inesperada durante la carga. El umbral recomendado es 0,1. Es la métrica más molesta para el usuario: provoca clics equivocados y sensación de web descuidada.
- Define width y height en todas las imágenes e iframes
- Reserva espacio para banners, avisos de cookies y anuncios
- Carga las tipografías evitando cambios bruscos de tamaño
- No insertes contenido por encima de lo que ya está visible
Cómo hacer seguimiento
Search Console agrupa tus URL en buenas, mejorables y deficientes usando datos de campo. Es el panel de referencia para saber si el trabajo ha funcionado. PageSpeed Insights sirve para investigar URL concretas y ver qué recomendación aplica a cada caso.
Ten paciencia con la ventana de 28 días: es habitual implementar mejoras y ver el cambio reflejado varias semanas después.
