Core Web Vitals: Guía Completa de Optimización para 2026
Por José Gaspard — Consultor SEO & Estrategia Digital
Resumen clave: Los Core Web Vitals son tres métricas de experiencia de usuario que Google utiliza como señal de posicionamiento desde 2021: Largest Contentful Paint (LCP), Interaction to Next Paint (INP) e Cumulative Layout Shift (CLS). En 2026, con la consolidación del Helpful Content System dentro del algoritmo central de Google y la creciente relevancia de las búsquedas de IA, una página lenta o inestable no solo pierde tráfico orgánico, sino que queda excluida de los resultados destacados de los modelos de lenguaje. Esta guía cubre los umbrales actualizados, las herramientas de medición más confiables y un checklist accionable para que tu sitio alcance la calificación "Bueno" en los tres indicadores.
¿Qué son los Core Web Vitals?
Los Core Web Vitals (CWV) son un subconjunto de las Web Vitals de Google: métricas objetivas que cuantifican la experiencia real de los usuarios al cargar e interactuar con una página web. Google los introdujo oficialmente como factor de posicionamiento a mediados de 2021 dentro de la actualización Page Experience. Desde entonces han evolucionado: en marzo de 2024 FID fue reemplazado definitivamente por INP, y en 2025 Google confirmó que los datos de campo del CrUX (Chrome UX Report) tienen mayor peso que los datos de laboratorio de Lighthouse cuando ambos están disponibles.
En esencia, los CWV responden a tres preguntas sobre la experiencia de usuario:
- ¿Qué tan rápido se carga el contenido principal? — LCP
- ¿Qué tan rápido responde la página a las interacciones? — INP
- ¿Cuánto se mueve el contenido mientras carga? — CLS
Lo que distingue a los CWV de otras métricas de rendimiento es que están basados en datos reales de usuarios de Chrome (datos de campo), no solo en simulaciones de laboratorio. Esto los hace más representativos de lo que tus visitantes realmente experimentan, y por lo mismo más difíciles de manipular artificialmente.
Para una estrategia SEO sólida que vaya más allá del rendimiento técnico, consulta nuestra guía completa de SEO técnico donde abordamos desde rastreo e indexación hasta datos estructurados.
LCP: Largest Contentful Paint — Qué es, umbrales y cómo mejorarlo
¿Qué mide el LCP?
El Largest Contentful Paint mide el tiempo que tarda en renderizarse el elemento de contenido más grande visible en el viewport inicial. Ese elemento puede ser una imagen, un bloque de texto, un video con poster, o un elemento de fondo CSS. Google considera que el LCP es el proxy más confiable para la percepción subjetiva de "la página ya cargó".
Umbrales de LCP
- Bueno: 2.5 segundos o menos
- Necesita mejora: Entre 2.5 y 4.0 segundos
- Deficiente: Más de 4.0 segundos
Causas más comunes de LCP lento
- Imágenes sin optimizar (formatos legacy como JPEG/PNG sin conversión a WebP o AVIF)
- Imagen hero sin atributo
fetchpriority="high"ni preload - JavaScript bloqueante en el
<head>que retrasa el renderizado - Time to First Byte (TTFB) alto por hosting lento o ausencia de CDN
- CSS no crítico que bloquea el render path
Cómo mejorar el LCP
Prioriza el recurso LCP. Agrega <link rel="preload" as="image"> para la imagen hero y añade el atributo fetchpriority="high" directamente en la etiqueta <img>. Esto le indica al navegador que descargue ese recurso antes que cualquier otro.
Convierte imágenes a formatos modernos. WebP reduce el peso entre 25 y 35% respecto a JPEG con calidad visual equivalente. AVIF puede alcanzar reducciones de hasta 50%, aunque su soporte en navegadores más antiguos sigue siendo parcial.
Elimina el render-blocking. Mueve los scripts no críticos al final del <body> o usa defer/async. Inlinea el CSS crítico (above the fold) y carga el resto de forma asíncrona.
Mejora el TTFB. Usa un CDN con PoPs cerca de tu audiencia principal. Si tu sitio está en WordPress, LiteSpeed Cache o WP Rocket con object caching reducen el TTFB dramáticamente en hosting compartido.
Para profundizar en técnicas específicas de rendimiento, lee nuestro artículo sobre cómo optimizar la velocidad de tu página web.
INP: Interaction to Next Paint — El reemplazo de FID
Por qué INP reemplazó a FID
First Input Delay (FID) medía únicamente el retraso del primer evento de entrada, ignorando todos los clics, taps y pulsaciones de teclado posteriores. En la práctica, una página podía tener un FID excelente pero ser completamente insensible a interacciones durante el scroll o después de cargar contenido dinámico. INP corrige ese punto ciego midiendo la latencia de todas las interacciones a lo largo de la sesión del usuario y reportando el percentil 98 de ellas.
¿Qué mide exactamente el INP?
INP captura el tiempo total desde que el usuario realiza una interacción (click, tap, keypress) hasta que el navegador pinta el siguiente frame que refleja esa interacción. Incluye tres fases: input delay (tiempo de espera antes de que el manejador de eventos se ejecute), processing time (tiempo de ejecución del evento) y presentation delay (tiempo de renderizado del siguiente frame).
Umbrales de INP
- Bueno: 200 milisegundos o menos
- Necesita mejora: Entre 200 y 500 milisegundos
- Deficiente: Más de 500 milisegundos
Cómo mejorar el INP
Divide las tareas largas (Long Tasks). El navegador no puede responder a eventos mientras ejecuta una tarea JavaScript de más de 50ms. Usa scheduler.yield() (disponible desde Chrome 115) o setTimeout(fn, 0) para ceder el control al navegador entre bloques de trabajo.
Reduce el trabajo en los manejadores de eventos. El manejador del evento debe hacer lo mínimo indispensable. Pospón actualizaciones no críticas al DOM con requestAnimationFrame o requestIdleCallback.
Minimiza el re-layout forzado. Evita leer propiedades de layout (offsetWidth, getBoundingClientRect) inmediatamente después de escribir en el DOM dentro del mismo evento. Eso fuerza un recalculo sincrónico costoso.
Optimiza los scripts de terceros. Los scripts de analítica, chat en vivo y publicidad suelen ser las fuentes más importantes de Long Tasks. Cárgalos con type="module", defer, o mediante un facade que difiera la carga hasta la primera interacción del usuario.
CLS: Cumulative Layout Shift — Estabilidad visual
¿Qué mide el CLS?
Cumulative Layout Shift cuantifica el movimiento inesperado de elementos durante la carga de una página. Cada vez que un elemento visible se mueve sin que el usuario lo haya provocado (un anuncio que empuja el texto hacia abajo, una imagen que aparece sin dimensiones reservadas), se genera una puntuación de layout shift. El CLS acumula todas esas puntuaciones usando una ventana deslizante de 5 segundos, reportando la ventana con mayor suma.
Umbrales de CLS
- Bueno: 0.1 o menos
- Necesita mejora: Entre 0.1 y 0.25
- Deficiente: Más de 0.25
Causas frecuentes de CLS alto
- Imágenes sin atributos
widthyheightdefinidos en el HTML - Anuncios, embeds y iframes sin dimensiones reservadas
- Fuentes web que producen FOUT (Flash of Unstyled Text) severo
- Contenido dinámico insertado sobre contenido existente (banners, notificaciones)
- Animaciones CSS que modifican propiedades que afectan el layout (top, left, margin)
Cómo mejorar el CLS
Define siempre width y height en las imágenes. El navegador moderno usa esas dimensiones para reservar el espacio antes de que la imagen cargue, eliminando el desplazamiento. Si usas CSS responsive (max-width: 100%), el ratio de aspecto se preserva automáticamente.
Reserva espacio para anuncios. Establece un contenedor con altura mínima fija para cada slot publicitario, especialmente en posiciones above-the-fold. Un anuncio que no carga no debe colapsar el espacio; uno que sí carga no debe empujar el contenido.
Usa font-display: optional o swap con cuidado. optional evita el FOUT completamente (si la fuente no está lista al primer render, usa el fallback permanentemente). swap reduce el CLS si calibras el fallback font con métricas similares usando la propiedad size-adjust.
Prefiere transform y opacity para animaciones. Estas propiedades se ejecutan en el compositor del navegador sin disparar recalculos de layout, eliminando shifts involuntarios.
Tabla de umbrales de Core Web Vitals 2026
| Métrica | Qué mide | Bueno | Necesita mejora | Deficiente |
|---|---|---|---|---|
| LCP (Largest Contentful Paint) | Velocidad de carga del elemento de contenido más grande visible en el viewport | ≤ 2.5 s | 2.5 s – 4.0 s | > 4.0 s |
| INP (Interaction to Next Paint) | Capacidad de respuesta de la página a clics, taps y pulsaciones de teclado | ≤ 200 ms | 200 ms – 500 ms | > 500 ms |
| CLS (Cumulative Layout Shift) | Estabilidad visual: desplazamiento inesperado de elementos durante la carga | ≤ 0.1 | 0.1 – 0.25 | > 0.25 |
| Fuente: Google Web.dev / CrUX Handbook 2026. Los umbrales se evalúan sobre el percentil 75 de las sesiones reales de usuarios en los últimos 28 días. | ||||
Nota importante: Google evalúa el estado de una URL usando el percentil 75 de sus datos de campo. Esto significa que el 75% de tus usuarios deben experimentar la métrica dentro del umbral "Bueno" para que la URL sea calificada como tal. No basta con que el promedio sea bueno.
Cómo medir tus Core Web Vitals: PSI, GSC, Lighthouse y CrUX
PageSpeed Insights (PSI)
PageSpeed Insights combina datos de laboratorio de Lighthouse con datos de campo del CrUX en una sola interfaz. Es el punto de partida ideal para diagnosticar una URL específica. Ingresa la URL en pagespeed.web.dev y presta atención primero a la sección "Datos de campo" (si hay suficientes visitas reales) y luego usa los diagnósticos de laboratorio para identificar los recursos problemáticos.
Google Search Console — Informe de Experiencia de Página
La sección "Experiencia de página" en GSC muestra el estado de CWV a nivel de dominio, agrupando las URLs por estado (Bueno / Necesita mejora / Deficiente) tanto en móvil como en escritorio. Es la vista más relevante para SEO porque usa exactamente los mismos datos que Google usa para el ranking. Revísala semanalmente y filtra por "Móvil" ya que Google indexa mobile-first.
Lighthouse (modo local)
Lighthouse corre en tu navegador (DevTools > Lighthouse) o como CLI (npm install -g lighthouse). Proporciona datos de laboratorio controlados: útiles para debugging porque puedes reproducirlos en condiciones idénticas. No reemplaza a los datos de campo pero es indispensable para ciclos de desarrollo rápido, ya que no depende de tráfico real.
CrUX (Chrome UX Report)
CrUX es la fuente primaria de datos de campo de Google. Puedes consultarlo directamente a través de BigQuery (para análisis a escala), la CrUX API (gratis, límite de 150 solicitudes/día) o el CrUX Dashboard en Looker Studio. La ventaja de CrUX es que puedes monitorear tendencias históricas de 6 meses y comparar tu dominio contra competidores del mismo sector.
Web Vitals Extension
La extensión oficial de Chrome "Web Vitals" muestra LCP, INP y CLS en tiempo real mientras navegas cualquier página. Es útil para una verificación rápida en campo sin abrir DevTools.
Impacto real de los Core Web Vitals en el posicionamiento
La pregunta que recibo con mayor frecuencia de clientes es directa: ¿cuántos lugares pierdo si mis CWV están en rojo? La respuesta honesta es que los CWV son un desempate, no el factor dominante. Google ha confirmado repetidamente que el contenido relevante con autoridad suficiente puede superar a contenido de menor calidad con CWV perfectos. Sin embargo, ese escenario aplica principalmente en búsquedas competitivas donde la relevancia ya está equiparada.
Donde el impacto es más tangible es en tres áreas concretas:
- Elegibilidad para Top Stories y fragmentos enriquecidos en móvil. Desde 2021, la señal Page Experience (que incluye CWV) es requisito para aparecer en el carrusel Top Stories de Google News en móvil para publicaciones no AMP.
- Indexación priorizada. Google ha indicado que páginas con buena experiencia de usuario pueden ser rastreadas e indexadas más rápidamente dentro de los presupuestos de crawl asignados.
- Citabilidad por modelos de IA. Los asistentes de búsqueda basados en IA (Google AI Overviews, Perplexity, Bing Copilot) priorizan fuentes que cargan rápidamente y cuyo contenido es estable visualmente, ya que sus crawlers indexan no solo texto sino también señales de experiencia de usuario.
Un caso documentado: un cliente de e-commerce en México con 40,000 páginas de producto mejoró su LCP promedio de 5.8s a 2.1s tras migrar imágenes a AVIF y activar preload en el elemento hero. En los 90 días siguientes, el tráfico orgánico en móvil creció 34% en términos absolutos. No todo ese crecimiento es atribuible exclusivamente a CWV, pero la correlación fue estadísticamente significativa controlando por estacionalidad.
Si necesitas una auditoría integral que evalúe CWV en el contexto de tu estrategia de posicionamiento completa, visita nuestros servicios de consultoría SEO o contáctame directamente para una evaluación inicial sin costo.
Checklist de optimización de Core Web Vitals para 2026
LCP — Lista de verificación
- Identifica el elemento LCP de cada plantilla principal (home, artículo, producto) con Lighthouse o WebPageTest
- Agrega
<link rel="preload" as="image">para la imagen hero en el<head> - Añade
fetchpriority="high"en el<img>del elemento LCP - Convierte imágenes a WebP (mínimo) o AVIF con fallback JPEG
- Configura CDN con caché de assets estáticos (mínimo 1 año de TTL)
- Mide TTFB: debe ser menor a 600ms desde los principales mercados objetivo
- Elimina o difiere scripts de terceros bloqueantes en el head
- Inlinea el CSS crítico (above the fold) en el HTML
INP — Lista de verificación
- Audita Long Tasks con el panel Performance de DevTools (filtra por tareas > 50ms)
- Usa
scheduler.yield()para dividir trabajo pesado en chunks - Mueve lógica no crítica de manejadores de eventos a
requestIdleCallback - Carga scripts de terceros (analytics, ads, chat) con
defero facade pattern - Evita lecturas de layout forzadas sincrónicas en manejadores de eventos
- Valida INP en móvil de gama media (no solo en tu laptop de desarrollo)
CLS — Lista de verificación
- Todos los elementos
<img>tienen atributoswidthyheightexplícitos - Los slots de publicidad tienen altura mínima reservada con CSS (
min-height) - Las fuentes web usan
font-display: optionalo fallback consize-adjustcalibrado - Los embeds de video (YouTube, Vimeo) tienen contenedor con ratio de aspecto (
aspect-ratio: 16/9) - Las animaciones CSS solo modifican
transformyopacity - Banners de cookies y notificaciones se insertan debajo del fold, nunca encima del contenido principal
Monitoreo continuo
- Configura alertas en GSC para caídas en el informe de Experiencia de Página
- Integra la CrUX API en tu dashboard de métricas (Looker Studio o similar)
- Ejecuta Lighthouse CI en tu pipeline de CI/CD para detectar regresiones antes de deploy
- Revisa CWV después de cada actualización mayor de plugins, temas o frameworks
Herramientas esenciales para Core Web Vitals en 2026
- PageSpeed Insights —
pagespeed.web.dev. Diagnóstico rápido de campo + laboratorio por URL. Gratuito, sin límite. - Google Search Console — Informe de Experiencia de Página con datos de campo a nivel dominio. Requiere propiedad verificada.
- Lighthouse CLI — Auditorías automatizadas de laboratorio integrables en CI/CD.
npm install -g lighthouse. - WebPageTest —
webpagetest.org. Filmstrip de carga, waterfall avanzado, pruebas desde múltiples ubicaciones. La versión Pro ofrece comparativas y scripting avanzado. - CrUX API — Datos de campo por URL u origen, actualizados cada 28 días. Clave gratuita en Google Cloud Console.
- web-vitals.js — Librería oficial de Google (2KB gzip) para capturar CWV en producción y enviarlos a tu analytics.
npm install web-vitals. - Lighthouse CI (LHCI) — Servidor para almacenar histórico de auditorías de laboratorio y detectar regresiones en PRs. Open source.
- Treo Site Speed — Dashboard de CrUX con comparativas históricas y benchmarks por industria. Plan gratuito disponible.
- DebugBear — Monitoreo de CWV de campo + laboratorio con alertas por email/Slack. Especialmente útil para agencias con múltiples clientes.
- Chrome DevTools — Panel Performance — Para debugging granular de Long Tasks, layout shifts y waterfall de recursos. Sin costo, integrado en Chrome.
Preguntas frecuentes sobre Core Web Vitals
¿Los Core Web Vitals son el factor de posicionamiento más importante de Google?
No. Google ha sido consistente en comunicar que la relevancia del contenido y la autoridad del sitio siguen siendo los factores dominantes. Los Core Web Vitals actúan principalmente como desempate entre páginas con relevancia similar. Dicho esto, en nichos muy competitivos donde los primeros 10 resultados tienen contenido de calidad equiparable, una experiencia técnica superior puede ser el diferenciador que determine qué URL ocupa la posición 1 vs. la posición 5. Además, el impacto indirecto es real: páginas más rápidas tienen menor tasa de rebote, mayor tiempo en sitio y más conversiones, señales que Google interpreta como indicadores de satisfacción del usuario.
¿Cuánto tiempo tarda en reflejarse una mejora de CWV en los rankings?
Los datos de campo del CrUX se actualizan cada 28 días usando una ventana deslizante de 28 días. Esto significa que si publicas una mejora hoy, tardarás entre 4 y 8 semanas en ver el nuevo estado reflejado tanto en PageSpeed Insights como en Google Search Console. El impacto en rankings puede tardar un poco más, ya que Google procesa las señales de Page Experience durante sus actualizaciones de índice regulares. Planifica ciclos de medición de al menos 60 días para evaluar el impacto real de tus cambios.
¿Mis CWV son diferentes en móvil y escritorio? ¿Cuál importa más?
Sí, los Core Web Vitals se miden y reportan por separado para móvil y escritorio. Los datos de móvil son consistentemente peores en la mayoría de los sitios debido a las limitaciones de los dispositivos y las redes celulares. Google utiliza el índice mobile-first, lo que en la práctica significa que los datos de campo móvil tienen mayor relevancia para el posicionamiento. En GSC, presta atención prioritaria al informe de "Móvil" en la sección de Experiencia de Página. Si tienes un sitio que sirve principalmente audiencias de escritorio (herramientas SaaS B2B, por ejemplo), los datos de escritorio siguen siendo relevantes pero el mobile-first sigue aplicando a nivel de crawling e indexación.
¿Qué hago si mi URL no tiene datos de campo suficientes en CrUX?
CrUX requiere un mínimo de usuarios de Chrome para generar datos a nivel de URL (el umbral exacto no es público, pero estimaciones del sector sugieren al menos 1,000-2,000 visitas mensuales de Chrome). Si tu URL está por debajo de ese umbral, PageSpeed Insights y GSC mostrarán "datos insuficientes". En ese caso, Google puede reportar datos a nivel de origen (dominio completo) si el sitio tiene suficiente tráfico agregado. Para las decisiones de optimización, usa los datos de laboratorio de Lighthouse como proxy hasta que acumules suficiente tráfico real. También puedes usar la librería web-vitals.js para capturar datos reales de tu propio analytics aunque el volumen no llegue al umbral de CrUX.
¿Los Core Web Vitals aplican igual para sitios en WordPress, Next.js o sitios estáticos?
Las métricas aplican igualmente a cualquier tecnología, pero los puntos de mejora varían significativamente por stack. Los sitios WordPress enfrentan desafíos específicos de CLS por plugins de ads y popups, y de LCP por imágenes no optimizadas. Los sitios Next.js tienen ventajas nativas con Image Optimization y font optimization, pero pueden sufrir INP elevado por hidratación de JavaScript pesado. Los sitios estáticos (HTML/CSS puro) suelen tener los mejores CWV base, pero pueden degradarse rápidamente con la adición de scripts de terceros. La estrategia de optimización debe partir de una auditoría específica de tu stack, no de recetas genéricas.
José Gaspard
Arquitecto SEO & Full-Stack Developer
Experto SEO y desarrollador web con +15 años de experiencia. He trabajado con Google, Canva y PayPal optimizando el posicionamiento web y desarrollando soluciones full-stack escalables.
Trabajemos JuntosComentarios
Los comentarios son moderados antes de publicarse.
Preguntas frecuentes
¿Qué aprendo en esta guía sobre Core Web Vitals?
¿En cuánto tiempo veré resultados si aplico lo que se explica aquí?
¿Puedo contratar al consultor SEO José Gaspard directamente?
¿Necesitas ayuda con el SEO de tu negocio?
Auditoría SEO gratuita + plan estratégico personalizado. Respuesta en menos de 24 h.