Core Web Vitals: qué son y cómo te afectan

Desde 2021, Google usa una métrica nueva para decidir qué sitios ranquean primero en búsquedas: la experiencia del usuario. No es suficiente tener contenido bueno. Tu sitio tiene que ser rápido, responsivo, y estable.

Los Core Web Vitals son los números que Google usa para medir esto. Y la mayoría de sitios en México están reprobando. El costo: menos visibilidad, menos clientes.

¿Qué son los Core Web Vitals?

Son tres métricas técnicas que Google usa para evaluar la experiencia de usuario en tu sitio:

• LCP (Largest Contentful Paint) — Velocidad de carga
• INP (Interaction to Next Paint) — Tiempo de respuesta a interacciones
• CLS (Cumulative Layout Shift) — Estabilidad visual

Introducidas en 2021, se volvieron un factor de ranking en 2024. Esto significa que un sitio con Core Web Vitals excelentes va a ranquear mejor que uno con malos Core Web Vitals, si el contenido es similar.

LCP — Largest Contentful Paint (Velocidad)

¿Qué es? El tiempo que tarda en renderizarse el elemento más grande visible en tu pantalla. Es decir, cuánto tarda tu sitio en mostrar el contenido principal.

¿Cuál es el objetivo?

• Bueno: menos de 2.5 segundos
• Malo: más de 4 segundos

¿Por qué importa? Un usuario ve la página en blanco. Espera 2.5 segundos. Ve el contenido. Buena experiencia. Un usuario espera 5 segundos. Se aburre. Se va.

Causas comunes de LCP lento:

• Imágenes grandes sin optimizar (especialmente fotos de alta resolución)
• Hosting lento — tu servidor tarda en responder
• CSS y JavaScript que bloquean el renderizado
• Fuentes web que se cargan tarde

INP — Interaction to Next Paint (Respuesta)

¿Qué es? El tiempo que tarda tu sitio en responder cuando el usuario hace algo: clic en un botón, llena un formulario, scrollea.

¿Cuál es el objetivo?

• Bueno: menos de 200 milisegundos
• Malo: más de 500 milisegundos

¿Por qué importa? El usuario hace clic en "contacto". El sitio debería responder en menos de 0.2 segundos. Si tarda 1 segundo, se siente lento. El usuario piensa que se congeló.

Causas comunes de INP lento:

• JavaScript pesado — código que se ejecuta en segundo plano
• Plugins en conflicto (especialmente en WordPress)
• Código desorganizado que corre en el main thread

CLS — Cumulative Layout Shift (Estabilidad)

¿Qué es? La suma de todos los cambios inesperados de posición de elementos mientras la página carga. Ves un botón, haces clic, pero mientras carga se mueve el botón y haces clic en el anuncio de al lado.

¿Cuál es el objetivo?

• Bueno: menos de 0.1
• Malo: más de 0.25

¿Por qué importa? Es frustrante. El usuario intenta hacer algo y la página se mueve. Mala experiencia. Además, Google penaliza.

Causas comunes de CLS alto:

• Imágenes sin dimensiones definidas (el navegador no sabe qué espacio reservar)
• Anuncios que cargan tarde
• Fuentes web que se cargan después (y cambian el tamaño del texto)
• Videos embebidos sin tamaño fijo

Cómo medir tus Core Web Vitals hoy

Google PageSpeed Insights (gratis, inmediato): Ve a https://pagespeed.web.dev/, pega tu URL, espera 30 segundos. Te dice exactamente en qué estás reprobando y qué arreglar.

Google Search Console (gratis): Si tu sitio está en Google Search Console, hay una sección "Experiencia de página" que muestra Core Web Vitals de tus usuarios reales.

Chrome DevTools (gratis): Abre tu sitio en Chrome, presiona F12, ve a Lighthouse, corre un reporte. Más técnico, pero muy completo.

¿Qué pasa si repruebas Core Web Vitals?

Dos cosas:

1. Menor visibilidad en búsquedas. Google te baja en ranking. Un competidor con mejores Core Web Vitals aparece arriba. Pierdes clientes orgánicos.

2. Los usuarios que llegan se van rápido. Aunque llegues a los primeros resultados, si tu sitio es lento, rebote alto, menos conversiones.

Juntos, es un golpe doble.

Las soluciones más frecuentes

Para LCP (velocidad):

• Optimizar imágenes — convertirlas a WebP, reducir tamaño
• Usar lazy loading — cargar imágenes solo cuando están visibles
• Usar un CDN — servir contenido desde servidores distribuidos
• Mejorar hosting — algunos hosting son simplemente lentos

Para INP (respuesta):

• Reducir JavaScript innecesario
• Eliminar plugins que no usas (en WordPress especialmente)
• Optimizar el código existente

Para CLS (estabilidad):

• Definir dimensiones (width y height) en todas las imágenes
• Evitar anuncios sin espacio reservado
• Cargar fuentes en async o con font-display: swap

La buena noticia: no requiere rediseño completo. Son ajustes técnicos específicos.