Cómo las imágenes afectan los Core Web Vitals - y cómo solucionarlo
Las imágenes son responsables de la mayoría de los fallos de LCP (Largest Contentful Paint). Si tus Core Web Vitals están en rojo, tus imágenes probablemente son la razón. Aquí te explicamos exactamente cómo solucionarlo.
Pruébalo ahora - gratis, sin registro.
Smart Compress Images →Imágenes y LCP (Largest Contentful Paint)
LCP mide cuándo el elemento visible más grande termina de cargar. Para la mayoría de páginas, es una imagen. Google quiere LCP bajo 2,5 segundos.
- Usa WebP/AVIF: 25-50% archivos más pequeños = descarga más rápida. Convertir ahora.
- Redimensiona: Sirve el tamaño correcto para el contenedor. Redimensionar aquí.
- Precarga imágenes hero:
<link rel="preload" as="image" href="hero.webp"> - Usa un CDN: Sirve imágenes desde servidores edge cercanos a los usuarios.
- Establece fetchpriority:
<img fetchpriority="high">para imágenes sobre el pliegue.
Imágenes y CLS (Cumulative Layout Shift)
CLS mide el movimiento inesperado del diseño. Las imágenes sin dimensiones hacen que la página salte cuando cargan.
- Siempre establece width y height:
<img width="800" height="600"> - Usa aspect-ratio CSS:
aspect-ratio: 16/9;como alternativa moderna - Evita lazy loading sobre el pliegue: No añadas
loading="lazy"a tu imagen hero
La checklist rápida
- Smart Compress todas las imágenes
- Redimensionar a las dimensiones reales de visualización
- Añadir atributos width/height a todas las etiquetas
<img> - Precargar tu imagen LCP
- Lazy load todo debajo del pliegue
- Re-testear en PageSpeed Insights
FAQ
¿Qué es un buen score LCP?
Menos de 2,5 segundos es «Bueno» (verde). 2,5-4 segundos es «Necesita mejora» (amarillo). Más de 4 segundos es «Pobre» (rojo). La optimización de imágenes sola puede moverte de rojo a verde.
¿Debo hacer lazy load de todas las imágenes?
¡No! No hagas lazy load de las imágenes sobre el pliegue (especialmente tu imagen hero/LCP). Solo haz lazy load de imágenes inicialmente fuera de pantalla. El exceso de lazy loading en realidad perjudica el LCP.
¿Listo? 100% gratis, funciona en tu navegador.
Smart Compress Images →