Qué son los Core Web Vitals
Los Core Web Vitals son tres métricas con las que Google mide la experiencia real de quien usa una página. No miden «lo rápido que carga todo», sino tres momentos concretos: cuándo aparece lo importante, cuándo responde la página a un toque y si el contenido se mueve sin avisar.
| Métrica | Qué mide | Objetivo «bueno» |
|---|---|---|
| LCP (Largest Contentful Paint) | Cuándo se muestra el elemento más grande visible: una imagen, un vídeo o un bloque de texto | 2,5 segundos o menos |
| INP (Interaction to Next Paint) | Cuánto tarda la página en reaccionar a clics, toques y teclas | 200 milisegundos o menos |
| CLS (Cumulative Layout Shift) | Cuánto se desplaza el contenido de forma inesperada | 0,1 o menos |
Según web.dev, una página supera la prueba cuando cumple los tres objetivos en el percentil 75 de las visitas, separando móvil y escritorio. Es decir, tiene que funcionar bien para la gran mayoría de visitas, no solo en tu ordenador.
¿Influyen en el posicionamiento?
Google recomienda «encarecidamente» conseguir buenos Core Web Vitals y dice que se alinean con lo que buscan sus sistemas de clasificación. Pero no promete una subida de posición: es una parte de la experiencia de página, junto a otros factores.
La razón práctica para mejorarlas es más simple: una web lenta pierde visitantes antes de enseñarles nada. Lee también la guía sobre cómo posicionar tu web en Google para ver dónde encaja la velocidad.
Cómo medir tu web antes de tocar nada
Abre PageSpeed Insights y analiza tu página de inicio y una página de servicio. Fíjate primero en los datos reales de usuarios, si aparecen, y después en el análisis de laboratorio.
Si tu web está en Search Console, abre el informe de Core Web Vitals: agrupa tus URL por estado y por móvil y escritorio.
Anota los tres valores actuales y la página donde peor van.
Cambia una cosa cada vez y vuelve a medir. Si cambias diez a la vez no sabrás qué funcionó.
Datos reales o de laboratorio
El laboratorio simula una visita; los datos reales vienen de usuarios de verdad y tardan en actualizarse. Una mejora puede tardar un tiempo en reflejarse en el informe de Search Console.
Cómo mejorar el LCP (carga del contenido principal)
web.dev divide el LCP en cuatro partes: el tiempo hasta el primer byte del servidor, el retraso hasta que empieza a cargar el recurso, la duración de su descarga y el retraso hasta que se pinta. Conviene saber cuál es la tuya antes de optimizar.
- Adelgaza la imagen principal. Ajusta sus dimensiones a lo que realmente se muestra, usa formatos modernos y compresión.
- No uses carga diferida (lazy-load) en la imagen principal. web.dev advierte de que provoca un retraso innecesario; reserva esa técnica para las imágenes que quedan más abajo.
- Prioriza el recurso clave. Puedes marcar la imagen probable del LCP con `fetchpriority="high"`, sin abusar.
- Reduce lo que bloquea el pintado: CSS pesado y scripts síncronos en la cabecera.
- Mejora la respuesta del servidor: caché, una red de distribución de contenidos (CDN) y evitar redirecciones en cadena.
Ojo: acortar una parte puede desplazar el tiempo a otra. Comprimir una imagen no sirve de mucho si el problema es que un script retrasa el pintado.
Cómo mejorar el INP (respuesta a interacciones)
El INP observa los clics, toques y pulsaciones de teclas durante toda la visita y se queda con el peor valor (descartando casos anómalos). No cuenta el desplazamiento ni pasar el ratón por encima.
- Reduce el JavaScript que se ejecuta al cargar: menos plugins, menos widgets, menos librerías.
- Revisa los scripts de terceros (chats, analítica, píxeles, mapas): cada uno compite por el mismo procesador.
- Evita tareas largas. web.dev recomienda dividir el trabajo para que el navegador pueda responder entre una y otra.
- Mantén el DOM pequeño: páginas con miles de elementos tardan más en actualizarse.
En webs de WordPress, la causa más habitual suele ser acumular plugins y constructores visuales. Un buen mantenimiento web incluye revisar qué sobra.
Cómo mejorar el CLS (que nada salte)
El CLS mide la mayor ráfaga de desplazamientos inesperados durante la vida de la página. Es esa sensación de ir a pulsar un botón y que se mueva justo antes.
- Indica siempre ancho y alto en imágenes y vídeos, o reserva el espacio con `aspect-ratio`.
- Reserva espacio para anuncios, banners de cookies, vídeos incrustados y cualquier cosa que cargue tarde.
- Cuida las fuentes web: elige una fuente de reserva parecida y precarga las críticas para que el cambio no mueva el texto.
- Anima con `transform` en lugar de modificar posición o tamaño, porque no provoca desplazamientos.
Por dónde empezar si tienes poco tiempo
Comprime y redimensiona las imágenes más grandes de la página de inicio.
Quita plugins, scripts y widgets que no uses.
Pon dimensiones a todas las imágenes.
Comprueba que el hosting responde bien y que hay caché.
Vuelve a medir y repite con la siguiente página.
No hace falta llegar a la perfección: se trata de pasar los umbrales «buenos» en las páginas que más importan. Y recuerda que una web rápida no sustituye a un buen contenido; ambas cosas se refuerzan, como cuenta la guía de qué debe tener la web de un negocio.
Preguntas frecuentes
¿Qué velocidad de carga es buena?
Google no fija un único tiempo de carga total. Usa tres métricas: el contenido principal visible en 2,5 segundos o menos (LCP), respuesta a interacciones en 200 milisegundos o menos (INP) y un desplazamiento visual de 0,1 o menos (CLS), medidos en el percentil 75 de las visitas.
¿Mi web va bien en mi ordenador pero mal en PageSpeed?
Es habitual. Tu equipo y tu conexión suelen ser mejores que los de muchos usuarios, y la prueba de laboratorio simula un móvil más modesto. Por eso Google evalúa con datos reales de usuarios, separados entre móvil y escritorio.
¿Basta con instalar un plugin de caché?
Ayuda, sobre todo con el tiempo de respuesta del servidor, pero no arregla imágenes pesadas, scripts de terceros ni elementos que se desplazan. Un plugin es una pieza más; la mejora suele venir de simplificar la web.
¿Cada cuánto debo revisar estas métricas?
Tras cada cambio importante (un plugin nuevo, un rediseño, un banner) y de forma periódica con el informe de Search Console. Los datos reales tardan en actualizarse, así que no esperes ver el efecto de un cambio al día siguiente.
Fuentes consultadas6
- web.dev — Web Vitalsweb.dev (se abre en una pestaña nueva)
- web.dev — Optimize Largest Contentful Paintweb.dev (se abre en una pestaña nueva)
- web.dev — Interaction to Next Paint (INP)web.dev (se abre en una pestaña nueva)
- web.dev — Optimize Interaction to Next Paintweb.dev (se abre en una pestaña nueva)
- web.dev — Optimize Cumulative Layout Shiftweb.dev (se abre en una pestaña nueva)
- Google Search Central — Core Web Vitals y Búsquedadevelopers.google.com (se abre en una pestaña nueva)
