Estaba depurando una tienda Shopify el mes pasado cuando algo hizo clic. El dueño había pasado semanas optimizando el código del tema, eliminando aplicaciones no utilizadas y minificando CSS — todos los consejos estándar de rendimiento. Pero su puntuación Lighthouse seguía en los 40. ¿El culpable? Una página de colección que cargaba 24 imágenes de producto, cada una de más de 800KB, directamente de la cámara.
Aquí está la verdad incómoda sobre el rendimiento en Shopify y otras plataformas como MercadoShops o Tiendanube: puedes tener el código de tema más limpio del mundo, pero si las imágenes de tus productos están infladas, tus puntuaciones de Core Web Vitals no van a ninguna parte. Y con el énfasis de Google en 2026 en el INP (Interaction to Next Paint) como factor de posicionamiento determinante, las páginas de producto lentas te cuestan directamente tráfico orgánico y conversiones.
Por qué las tiendas online tienen tantas imágenes
La mayoría de los sitios web de contenido tienen 5-15 imágenes por página. ¿Una página de colección típica de una tienda online? 20-50 miniaturas de producto. ¿Una página de detalle de producto? Normalmente 5-8 imágenes de variante en alta resolución, más vistas con zoom. Añade un slider de página principal, banners promocionales y fotos de estilo de vida, y tienes más de 60 imágenes en una sola sesión.
La CDN de imágenes de Shopify las sirve de forma eficiente, al igual que las de MercadoLibre y Tiendanube, pero la CDN no hace mágicamente pequeños los archivos de 2MB. Solo los entrega rápido. El navegador aún tiene que descargar, decodificar y renderizar cada byte — y en una página de colección, esto ocurre 30 veces seguidas.
La matemática es demoledora. Si la imagen promedio de tu producto es de 1.5MB y cargas 30 en una página de colección, son 45MB de imágenes. Incluso en una conexión rápida (50Mbps), eso son más de 7 segundos de pura descarga de imágenes — antes de que ocurra cualquier renderizado. ¿En el móvil? Olvídalo.
Qué miden realmente los Core Web Vitals (y por qué las imágenes los hunden)
Las tres métricas de Core Web Vitals de Google se desglosan de forma diferente cuando las imágenes son el cuello de botella:
- LCP (Largest Contentful Paint): Normalmente es tu imagen principal o la primera foto del producto. Si pesa más de 1MB, tu LCP está condenado. Google quiere LCP por debajo de 2.5 segundos. Una sola imagen principal sin optimizar puede superar los 5 segundos por sí sola.
- CLS (Cumulative Layout Shift): Las imágenes sin atributos explícitos de ancho/alto hacen que el contenido salte mientras se cargan. Los temas de Shopify han mejorado en esto, pero las cuadrículas de productos con carga diferida aún pueden desplazarse si las dimensiones no están definidas.
- INP (Interaction to Next Paint): Esta es la novedad para 2026. Cuando un usuario toca un filtro de colección o desliza entre imágenes de variante, ¿cuánto tarda la página en responder? Las imágenes grandes en memoria ralentizan cada interacción porque el navegador está ocupado decodificando y componiendo.
Una tienda Shopify que audité tenía un LCP de 6.8 segundos. Después de comprimir sus imágenes de producto (mismas dimensiones, solo correctamente optimizadas), el LCP bajó a 1.9 segundos. El mismo tema. El mismo código. Solo imágenes más pequeñas.
El flujo de trabajo de compresión de imágenes que funciona
Shopify (y plataformas similares como MercadoShops) crea automáticamente versiones redimensionadas de las imágenes subidas para diferentes contextos (miniaturas, cuadrículas de colección, vistas de zoom). Pero esto es lo que la mayoría de los vendedores pasan por alto: Shopify no comprime la imagen de origen que subes. Sirve el archivo exacto que le diste, solo redimensionado. Si subiste un JPEG de 3MB sin optimizar, cada variante que Shopify genere hereda ese peso excesivo.
Así que la solución ocurre antes de la subida. Aquí está el flujo de trabajo:
1. Comprime tus imágenes de origen primero
Antes de que nada toque los servidores de Shopify o Tiendanube, pasa tus fotos de producto por compresión. Yo uso un enfoque de dos pasadas:
- Pasada 1: Comprime con calidad 75-80. Para la mayoría de las fotos de producto, esto produce una reducción del 60-70% en el tamaño del archivo sin pérdida visible de calidad. Una foto de producto de 3.2MB se convierte en aproximadamente 900KB.
- Pasada 2: Comprueba el resultado comprimido al tamaño real de visualización en la tienda (normalmente 600-800px de ancho). Si sigue viéndose nítido, publícalo. Si hay artefactos visibles, sube la calidad a 85 y vuelve a comprimir.
2. Usa el formato adecuado
Shopify admite JPEG, PNG y WebP. Para fotos de producto:
- JPEG calidad 75-80: Lo mejor para la mayoría de las fotos de producto. Buena compresión, compatible universalmente.
- WebP: Aproximadamente un 25% más pequeño que JPEG con la misma calidad. Shopify convierte automáticamente a WebP para usuarios de Chrome/Firefox, pero subir archivos de origen WebP ahorra la sobrecarga de conversión del lado del servidor.
- PNG: Solo para imágenes de producto que necesiten transparencia. Para fotos estándar, JPEG será 5-10 veces más pequeño.
3. Procesa tu catálogo en lote
Nadie tiene tiempo para comprimir 200 imágenes de producto una por una. CompactJPG gestiona la compresión por lotes — suelta toda tu carpeta de fotos de producto, configura la calidad a 75 y comprime todo de una vez. Descarga el ZIP y listo.
Métricas reales de la renovación de una tienda online
Esto es lo que realmente sucedió cuando ayudé a una tienda a optimizar sus imágenes:
| Métrica | Antes | Después |
|---|---|---|
| LCP (página de colección) | 6.8s | 1.9s |
| Peso total de la página | 28.4MB | 6.2MB |
| Tamaño medio de imagen de producto | 1.42MB | 310KB |
| INP (interacción con filtro de categoría) | 380ms | 95ms |
| Tráfico orgánico (30 días después) | Referencia | +18% |
El aumento de tráfico no fue magia — las mejores puntuaciones de CWV mejoraron su posición para las palabras clave existentes. Mismo contenido, mismos productos, páginas más rápidas.
Errores comunes de imágenes en tiendas online que debes evitar
- Subir directamente desde tu cámara DSLR: Las cámaras generan archivos enormes pensados para impresión, no para web. Comprime siempre antes de subir a Shopify o Tiendanube.
- Usar PNG para fotos: Lo veo constantemente. Una foto de producto PNG de 4MB que podría ser un JPEG de 300KB. La transparencia no vale la penalización de velocidad de página a menos que realmente la necesites.
- Imágenes "retina" de doble resolución: Imágenes de 2000px de ancho en una ficha de producto de 400px. Sí, se ven nítidas en pantallas retina. No, la mayoría de los usuarios no notan la diferencia entre densidad 2x y 1.5x. Considera 1.5x donde la calidad lo permita.
- Ignorar el móvil: Tus analíticas de Shopify probablemente muestren más del 60% de tráfico móvil. Esas imágenes de escritorio de 800px de ancho se están sirviendo a pantallas de teléfono de 375px de ancho. Usa las etiquetas de imagen responsive de la plataforma y sirve variantes del tamaño adecuado.
Conclusión
Plataformas como Shopify, MercadoShops o Tiendanube te dan una base excelente. Pero no pueden arreglar lo que tú les das de comer. Si subes imágenes sin optimizar, tu tienda será lenta — punto. La buena noticia es que la compresión de imágenes es la mejora de rendimiento más fácil que puedes conseguir. Sin programación. Sin editar el tema. Solo pasa tus fotos de producto por un buen compresor antes de subirlas, y observa cómo suben tus puntuaciones de Core Web Vitals.
Tus clientes no notarán la compresión. Solo notarán que tu tienda carga antes de que pierdan la paciencia y se vayan.