Google Core Web Vitals 2026: Guía Completa para No Morir en el Intento

Google Core Web Vitals 2026: La guía definitiva para que tu web no muera en el intento

Si tu sitio web en Colombia está en rojo en PageSpeed Insights, este artículo es para ti. Si ni siquiera sabes qué son los Core Web Vitals, también — porque en 2026 son la diferencia entre aparecer en la primera página de Google y ser invisible.

Desde que Google los hizo factor de ranking, los Core Web Vitals evolucionaron de “métrica técnica de nicho” a “requisito de entrada” para competir en búsquedas comerciales. Y con el mobile-first indexing, lo que importa es cómo se comporta tu sitio en un celular gama media con 4G — no en tu portátil con fibra.

¿Qué son los Core Web Vitals?

Son tres métricas con las que Google mide la experiencia real de tus usuarios. No son simulaciones: se calculan con datos de navegadores Chrome reales (el dataset CrUX), así que no puedes “maquillarlos”.

Métrica	Qué mide	Objetivo (p75)
LCP — Largest Contentful Paint	Tiempo hasta que el contenido principal es visible	< 2.5 segundos
INP — Interaction to Next Paint	Latencia de todas las interacciones (clics, taps, teclado)	< 200 ms
CLS — Cumulative Layout Shift	Estabilidad visual: cuánto se mueve la página al cargar	< 0.1

LCP: que tu contenido principal aparezca rápido

El LCP mide cuánto tarda en renderizarse el elemento más grande visible: la imagen hero, un video de fondo o un bloque de texto principal. Es la métrica que más se correlaciona con el abandono: cada segundo extra de LCP puede costar hasta 20% de conversión.

Por qué falla el LCP en sitios colombianos:

• Imágenes de 2-5 MB subidas directo desde el celular, sin comprimir
• La imagen hero cargando con loading="lazy" (grave error: lo importante debe cargar primero)
• Hosting lento o sin CDN, con servidores fuera de LATAM
• JavaScript y CSS que bloquean el render (típico de temas de WordPress recargados de plugins)

Cómo mejorar el LCP:

• Convierte imágenes a WebP o AVIF y apunta a menos de 300 KB en el hero
• Usa fetchpriority="high" en la imagen principal y quítale el lazy loading
• Sirve assets desde un CDN con nodos en América Latina (Cloudflare, Vercel)
• Elimina CSS y JS no críticos del render inicial: inline crítico, difiere el resto
• Preconecta orígenes de terceros (fuentes, analytics) solo si son imprescindibles

Ejemplo real: en nuestro propio sitio, el LCP móvil pasó de 8.4s a 1.0s moviendo los scripts de analytics a Web Workers y optimizando todas las imágenes. La misma página, el mismo diseño, diez veces más rápida.

INP: la métrica que reemplazó al FID (y la más difícil)

El INP mide la latencia de TODAS las interacciones del usuario durante la visita: cada clic, tap y pulsación de tecla. No es solo “la primera interacción” como su antecesor. Un sitio con INP malo se siente lento y tosco aunque cargue rápido.

Causas comunes de INP alto:

• JavaScript pesado en el hilo principal: sliders, animaciones scroll, mapas interactivos
• Analytics y píxeles ejecutándose en el hilo principal (GA4, Meta Pixel, Clarity)
• Funciones costosas sin debounce en eventos de scroll/resize
• Temas de WordPress con 30+ scripts y constructores visuales pesados

Cómo mejorar el INP:

• Offloada analytics a Web Workers (Partytown es la solución estándar)
• Divide el código en chunks y carga solo lo necesario por página (code splitting)
• Usa requestIdleCallback para tareas no críticas
• Elimina animaciones continuas que recalculen layout en cada frame
• Simplifica el tercer plugin: cada script de terceros es una apuesta contra tu INP

Dato clave: un INP pésimo suele ser el culpable silencioso cuando “el sitio carga bien pero las posiciones no suben”. Google lo pondera fuerte porque mide exactamente lo que siente el usuario.

CLS: el enemigo de los clics (y de las conversiones)

Ese momento en que vas a tocar “Comprar” y el botón salta porque cargó una imagen — eso es CLS. Más allá de lo molesto, genera clics accidentales, ventas perdidas y una señal de ranking negativa.

Causas comunes de CLS:

• Imágenes sin dimensiones declaradas (width/height)
• Banners o iframes que se inyectan dinámicamente (cookies, chat, promociones)
• Fuentes web que cambian de tamaño al cargar
• Contenido insertado por JavaScript encima del contenido existente

Cómo mejorar el CLS:

• Declara width y height en TODAS las imágenes y usa aspect-ratio en CSS
• Reserva espacio para embeds: iframes de mapas, videos y widgets de chat
• Usa font-display: swap para evitar texto invisible que luego salta
• Carga banners y popups desde el servidor, no con JS que reacomoda la página

Las métricas que acompañan a los Core Web Vitals

Aunque el trío oficial es LCP, INP y CLS, hay dos señales más que vigilar:

• TTFB (Time to First Byte): cuánto tarda el servidor en responder. En Colombia, hosting gringo sin CDN puede agregar 300-800 ms de TTFB solo por distancia. Usa CDN con nodos LATAM.
• FCP (First Contentful Paint): la primera impresión de velocidad. Se mejora con las mismas técnicas del LCP.

Herramientas para medir (todas gratis)

Herramienta	Para qué sirve
PageSpeed Insights	Diagnóstico completo móvil + desktop con datos reales (CrUX)
Google Search Console > Core Web Vitals	Estado CWV de todo tu sitio, página por página
Chrome DevTools → Lighthouse	Pruebas locales antes de publicar
web-vitals.js	Monitoreo de usuarios reales en producción

Caso real: antes y después en un e-commerce colombiano

Uno de nuestros clientes con tienda en WooCommerce llegó con estos números móviles:

Métrica	Antes	Después	Cambio
LCP	6.8s	1.4s	-79%
INP	480ms	145ms	-70%
CLS	0.32	0.02	-94%
Puntaje PSI móvil	31	96	+65 puntos

Qué hicimos (en orden de impacto):

1. Eliminamos 14 plugins del tema (cada uno cargaba CSS/JS en todas las páginas). Pasamos el sitio a una base ligera con solo lo esencial.
2. Imágenes: conversión masiva a WebP con tamaños responsivos (srcset) y dimensiones declaradas. De 4.2 MB de imágenes en la home a 480 KB.
3. Analytics a Partytown: GA4 y el píxel de Meta dejaron de bloquear el hilo principal. El INP cayó a la mitad.
4. CDN con nodos LATAM: el TTFB pasó de 900ms a 120ms para usuarios en Bogotá.
5. Checkout aligerado: la página de pago pasó a un template sin scripts de marketing.

Resultado a 3 meses: +38% de conversión móvil y el tráfico orgánico creció 27%. No fue rediseño: fue la misma tienda, optimizada. La velocidad vende — literalmente.

Si tu tienda está en una situación parecida, el diagnóstico es lo primero. Nuestra auditoría gratuita te muestra exactamente dónde pierdes tiempo de carga.

Mitos sobre los Core Web Vitals

“Si mi puntaje es 100, voy a rankear #1.” Falso. CWV es un factor de desempate y de elegibilidad, no un multiplicador mágico. Un sitio de 100 sin contenido ni autoridad seguirá abajo.

“Los puntajes de laboratorio (Lighthouse local) son mi nota real.” No exactamente: Google rankea con datos de campo (CrUX). Lighthouse local puede mostrar 100 en tu MacBook mientras el usuario real en un Redmi con 4G experimenta 40.

“Una web bonita con animaciones no puede ser rápida.” Falso. Con astro, code splitting y animaciones transform-only (que no tocan layout), se puede tener diseño premium y CWV en verde. Eso hacemos todos los días.

Checklist final de optimización

• Imágenes WebP/AVIF < 300 KB, con dimensiones declaradas
• Hero con fetchpriority="high" y sin lazy loading
• Analytics en Web Workers (Partytown)
• Code splitting: JS dividido por página
• CDN con nodos LATAM + TTFB < 300 ms
• Sin scripts de terceros innecesarios
• CWV verificados en Search Console, no solo en Lighthouse

Preguntas frecuentes

¿Cada cuánto debo medir los Core Web Vitals? Después de cada cambio relevante (rediseño, plugin nuevo, cambio de hosting) y al menos una vez al mes como rutina. Search Console te muestra la tendencia por grupo de páginas.

¿Puedo llegar a verde con WordPress? Sí, pero requiere disciplina: pocos plugins, tema ligero, caché + CDN, imágenes optimizadas. Los constructores visuales pesados son el obstáculo #1. Si tu tema carga 2 MB de JS, ninguna caché lo salva.

¿Cuánto afectan al SEO real? En búsquedas competitivas, el desempeño puede ser el factor que te separa del top 3. En nichos locales poco competidos, estar en amarillo no te bloquea. Pero con la entrada de las AI Overviews y la búsqueda generativa, la velocidad vuelve a ser condición de cita.

¿Necesito desarrollador para mejorar mis métricas? Los fixes básicos (imágenes, dimensiones, fuente) se hacen en minutos. Los avanzados (code splitting, workers, arquitectura) sí requieren ingeniería. Por eso existe nuestro servicio de mantenimiento y optimización web.

---

¿Quieres saber cómo está tu sitio?

En Softhian ofrecemos una auditoría gratuita de velocidad web que analiza tus Core Web Vitals reales (datos de campo de PageSpeed Insights), te muestra el score móvil y desktop, y prioriza exactamente qué corregir. Sin registro, sin costo, sin compromiso.

Analiza tu web ahora →

¿Necesitas un sitio nuevo que nazca en verde? Conoce nuestro servicio de Diseño de Páginas Web o escríbenos por WhatsApp.