Caso de Estudio: Cómo Mejoramos las Core Web Vitals en un 60% en Dos Semanas

El Antes

Un sitio de e-commerce con Next.js, 12.000 SKUs y $2M de ingresos mensuales. Su tráfico orgánico había estado decayendo durante seis meses. Google Search Console mostró el problema: el 68% de las URL en el grupo de LCP "poor".

Después: 92% "good" en las tres métricas. Esto es exactamente lo que cambiamos.

LCP: 4.2s → 1.1s

La imagen hero de cada página de producto se cargaba a resolución completa: 4000x4000px, 2.3MB. El eslogan decía "optimizado", pero usaban un CDN genérico sin conversión a WebP. Para un desglose completo de cómo diagnosticar y arreglar el LCP, consulta nuestra guía de LCP en profundidad.

Lo que hicimos:

• Convertimos todas las imágenes hero a WebP con un 85% de calidad
• Añadimos fetchpriority="high" a la imagen LCP
• Implementamos tamaños de imagen responsivos mediante el componente Image de Next.js con el atributo sizes
• Movimos el widget de reseñas de terceros debajo del pliegue (cargaba 180KB de JS antes del hero)

La mayor victoria fue el widget de reseñas. Eliminar una sola etiqueta