Core Web Vitals en WordPress: LCP, INP y CLS explicados
Core Web Vitals en WordPress: LCP, INP y CLS explicados
Los Core Web Vitals son las tres métricas con las que Google mide si tu web “se siente” rápida y estable. Importan por dos razones: son señal de ranking y, sobre todo, afectan si un visitante se queda o se va.
Aquí te explico qué es cada métrica, qué umbral exige Google y cómo mejorarlas en WordPress.
Las 3 métricas y sus umbrales
| Métrica | Qué mide | Bueno | Necesita mejorar |
|---|---|---|---|
| LCP (Largest Contentful Paint) | Cuándo aparece el contenido principal | ≤ 2,5 s | > 4 s |
| INP (Interaction to Next Paint) | Capacidad de respuesta al interactuar | ≤ 200 ms | > 500 ms |
| CLS (Cumulative Layout Shift) | Estabilidad visual (saltos de contenido) | ≤ 0,1 | > 0,25 |
En marzo de 2024 Google sustituyó FID por INP; muchas guías antiguas aún mencionan FID y están desactualizadas.
Cómo medir tus Core Web Vitals
- PageSpeed Insights (pagespeed.web.dev): análisis instantáneo por página, con diagnóstico por métrica.
- Search Console → Informe Core Web Vitals: datos reales de tus visitantes (lo que cuenta para Google), por grupo de URLs.
- Chrome DevTools → Lighthouse: para medir en local antes de publicar.
Los datos de campo (Search Console) son los que Google usa; los de laboratorio (PageSpeed) sirven para depurar.
Cómo mejorar el LCP
El LCP suele ser una imagen grande (el hero) o un bloque de texto principal.
- Optimiza el hero: convierte a WebP/AVIF, usa el tamaño exacto que se muestra y comprímelo.
- Precarga la imagen LCP:
<link rel="preload" as="image">o la opción de tu plugin de caché. - Mejora el hosting y activa caché: un TTFB lento arruina el LCP por bueno que sea el resto.
- Usa un CDN para servir los recursos desde cerca del visitante.
- Elimina el JavaScript render-blocking del
<head>(retrásalo o difiérelo).
Cómo mejorar el INP
El INP penaliza JavaScript que bloquea la respuesta a clics y escritura.
- Desactiva plugins pesados que cargan scripts en todas las páginas sin necesidad.
- Retrasa JS de terceros (chats, reproductores, mapas) hasta que el usuario interactúe.
- Usa un theme ligero: los themes todo-en-uno con decenas de scripts son la causa nº 1 de INP alto.
- Carga diferida de scripts no críticos (
deferoasync).
Cómo mejorar el CLS
El CLS es el “salto” que se ve cuando un elemento se mueve mientras lees.
- Pon
widthyheighta todas las imágenes (o usaaspect-ratioen CSS): reserva el espacio antes de cargar. - Reserva espacio para embeds (videos, tweets) y anuncios con contenedores de tamaño fijo.
- Fuentes web con
font-display: swappara evitar el salto al intercambiar tipografías. - No insertes contenido dinámico (popups, banners) encima del contenido sin reservar su altura.
Checklist accionable
- Mide tu URL principal en PageSpeed Insights y anota LCP, INP y CLS.
- Optimiza la imagen más grande de la portada (WebP + dimensiones).
- Activa caché de página + precarga (ver comparativa de plugins de caché).
- Retrasa/difiere el JavaScript no crítico.
- Añade
width/heighta las imágenes del theme. - Vuelve a medir y compara.
Preguntas frecuentes
¿Los Core Web Vitals son un factor de ranking directo? Sí, pero con peso moderado. Su mayor impacto es indirecto: una web lenta aumenta el rebote y reduce el tiempo en página, y eso sí castiga el posicionamiento.
¿Cada cuánto se actualiza el informe de Search Console? Con datos de 28 días de visitas reales. Tras una mejora, espera un par de semanas a que el promedio se refleje.
¿Un page builder como Elementor arruina mis Core Web Vitals? No necesariamente, pero añade HTML y scripts extra. Con caché, imágenes optimizadas y un hosting decente, se puede lograr un resultado aceptable; con builders muy pesados cuesta más.
¿FID o INP? INP. FID quedó obsoleto; si una herramienta solo te muestra FID, está desactualizada.
Relacionado: Cómo acelerar WordPress: 10 pasos · Mejores plugins de caché