Por qué tus imágenes de Shopify hunden tu conversión
En una ficha de producto media de Shopify, las imágenes representan del 60 al 80 % del peso total de la página. Cada segundo ganado en la carga supone alrededor de un 4 a 7 % más de tasa de conversión (fuente: estudio Deloitte Milliseconds Make Millions, 2020).
El problema clásico:
- El tema acepta una imagen de origen en JPG 4000×3000 (8 MB).
- Shopify la redimensiona en el CDN pero conserva el formato de entrada.
- El visitante móvil descarga un JPG de 350 KB donde bastaría un WebP de 90 KB, para un resultado visual estrictamente idéntico.
Con 20 productos × 5 imágenes por ficha, eso supone más de 25 MB transferidos innecesariamente por sesión.
Las tres palancas que debes accionar
1. Convertir tus fuentes a WebP (o AVIF)
El formato WebP ofrece de media un 30 % menos de peso que un JPG equivalente a calidad percibida idéntica. El AVIF baja todavía más (hasta un -50 % frente al JPG) pero su compatibilidad sigue siendo imperfecta en algunos navegadores antiguos.
Regla práctica: sube tus másteres en WebP calidad 82-88. Es el punto óptimo entre peso y fidelidad de color.
2. Calibrar la dimensión real de visualización
No tiene sentido servir una imagen 2400×1800 si se muestra a 600×450 en el tema. Para la mayoría de los temas de Shopify (Dawn, Sense, Refresh):
| Ubicación | Ancho nativo recomendado |
|---|---|
| Hero de la home | 1920 px |
| Carrusel de producto | 1200 px |
| Miniatura de colección | 600 px |
| Imagen de blog | 1200 px |
3. Activar el loading="lazy" en todo lo que esté fuera del fold
Shopify lo añade por defecto en los temas recientes, pero revisa tus
secciones personalizadas (Liquid): un <img> sin atributo bloquea
el LCP.
El flujo de trabajo concreto en 4 pasos
- Auditar: Lighthouse → pestaña Opportunities → “Serve images in next-gen formats”.
- Preparar un lote de las fotos de producto en
.jpgde alta resolución. - Convertir todo el lote a WebP con MediaBay —arrastrar y soltar, formato de salida WebP, calidad 85, tamaño máx. 1200 px.
- Volver a subir a Shopify (admin → Archivos, o directamente en la ficha de producto). El CDN de Shopify servirá después el tamaño adecuado según el viewport.
Caso real: -1,8 s en el LCP de una tienda de moda
En una tienda cliente (catálogo de ~40 referencias):
- LCP antes: 3,2 s (4G móvil)
- LCP tras la conversión del lote a WebP: 1,4 s
- Peso medio de una ficha de producto: 2,8 MB → 720 KB
El beneficio SEO es inmediato: desde 2023 Google penaliza las páginas cuyo LCP supera los 2,5 s.
¿Y la confidencialidad de tus imágenes?
Muchas herramientas de conversión en línea envían tus imágenes a sus servidores —riesgo de RGPD si tus fotos contienen personas, prototipos confidenciales o, simplemente, tu catálogo antes del lanzamiento.
MediaBay convierte 100 % en local en tu navegador, mediante WebAssembly. Sin subidas, sin almacenamiento del lado del servidor. Auditable en la pestaña Network de las DevTools.
TL;DR
- Convierte tus JPG a WebP calidad 85, tamaño máx. 1200 px en el ancho de producto.
- Comprueba el
loading="lazy"en todo<img>fuera del fold. - Mide con Lighthouse antes/después — apunta a un LCP < 2,5 s.
- Hazlo sin subir tus fotos: conviértelas en local.