Google incorporó los Core Web Vitals como señal de ranking en 2021 y los ha reforzado desde entonces. En 2024, INP (Interaction to Next Paint) reemplazó a FID como métrica de interactividad. Si no has actualizado tu benchmark desde entonces, probablemente estás midiendo algo que ya no cuenta.
LCP — Largest Contentful Paint
Qué mide: el tiempo que tarda en renderizarse el elemento más grande visible en el viewport — normalmente la imagen hero o el titular principal.
Umbral: bueno <2.5s, necesita mejora 2.5-4s, malo >4s.
Causas comunes de LCP lento:
- Imagen hero sin optimizar (formato WebP/AVIF, tamaño adecuado, preload)
- Servidor lento — TTFB alto hace que todo lo demás sea lento
- CSS o JS render-blocking que retrasa la carga del elemento LCP
- Imágenes lazy-loaded que deberían cargarse con prioridad
Fix principal: añade <link rel="preload"> para la imagen hero y asegúrate de que el LCP element no tiene loading="lazy".
INP — Interaction to Next Paint
Qué mide: la latencia de respuesta a interacciones del usuario — clics, taps y pulsaciones de teclado. Específicamente, el tiempo desde la interacción hasta que el navegador actualiza visualmente la pantalla.
Umbral: bueno <200ms, necesita mejora 200-500ms, malo >500ms.
Causas comunes: JavaScript pesado que bloquea el hilo principal, event handlers mal optimizados, actualizaciones de DOM costosas tras interacciones.
Fix principal: usa la pestaña Performance del Chrome DevTools para identificar tasks largas (>50ms) en el main thread. Fragmenta el trabajo con setTimeout o requestIdleCallback cuando sea posible.
CLS — Cumulative Layout Shift
Qué mide: la cantidad total de desplazamiento visual inesperado durante la vida de la página. Un banner que empuja el contenido hacia abajo cuando carga es un ejemplo clásico.
Umbral: bueno <0.1, necesita mejora 0.1-0.25, malo >0.25.
Fix principal: reserva espacio para imágenes y embeds con atributos width y height o con CSS aspect-ratio. Los anuncios que se cargan dinámicamente son la causa más común de CLS alto.
Cómo medir en campo (no solo en laboratorio)
PageSpeed Insights y Chrome DevTools miden en condiciones de laboratorio — una sola carga, conexión estable. Los datos de campo (Chrome User Experience Report, CrUX) reflejan experiencias reales de usuarios en diferentes dispositivos y redes. Google usa los datos de campo, no los de laboratorio, para el ranking. Verifica tus Core Web Vitals reales en Search Console > Experiencia > Core Web Vitals.