Google lleva años empujando Core Web Vitals como factor de ranking. En ecommerce el impacto es directo en conversión: un LCP que pasa de 1.8s a 3s puede costar hasta 20% de ventas. Te explicamos qué medir, qué umbral perseguir y qué optimizar.
Las tres métricas que importan
| Métrica | Qué mide | Bueno | Hay que actuar |
|---|---|---|---|
| LCP | Largest Contentful Paint: cuánto tarda en pintarse el elemento principal | < 2.5s | > 4s |
| INP | Interaction to Next Paint: respuesta a interacción | < 200ms | > 500ms |
| CLS | Cumulative Layout Shift: estabilidad visual | < 0.1 | > 0.25 |
Cómo medirlos
- Field data: CrUX (Chrome User Experience Report) — lo que ven usuarios reales.
- Lab data: PageSpeed Insights, Lighthouse, WebPageTest — útiles para diagnóstico.
- Monitoring continuo: Vercel Speed Insights, Calibre, SpeedCurve.
- GA4 + Web Vitals: enviar las métricas a tu analítica para correlacionar con conversión.
Cómo mejorar LCP
- Hosting cerca del usuario (CDN, edge).
- Optimizar la imagen hero: WebP/AVIF, dimensiones correctas, fetchpriority="high".
- Eliminar render-blocking resources (CSS no crítico async).
- Preconnect a dominios externos críticos.
- SSR/SSG en lugar de CSR para contenido above-the-fold.
Cómo mejorar INP
- Reducir JavaScript del thread principal: code splitting, tree shaking.
- Diferir scripts no críticos (analytics, chats) con async/defer/lazy.
- Throttle de event listeners en scroll, resize.
- Evitar long tasks (>50ms) en initialize.
- Web Workers para trabajo pesado fuera del main thread.
Cómo mejorar CLS
- Reservar dimensiones de imágenes y vídeos con width/height.
- No insertar contenido encima del flujo de lectura tras carga.
- font-display: optional o swap con tamaños similares al fallback.
- Anuncios y embeds con espacio reservado predeclarado.
Impacto en conversión
Datos públicos de Google y Vodafone: mejorar LCP en 0.6s aumentó ventas 19%. Reducir CLS de 0.3 a 0.1 mejoró conversion rate 8%. No es magia: usuarios molestos no compran.
