En una tienda online, las imágenes son el principal argumento de venta. El cliente no puede tocar el producto, así que la fotografía debe compensarlo. Pero imágenes demasiado pesadas ralentizan la tienda y ahuyentan compradores. Encontrar el equilibrio perfecto entre calidad visual y rendimiento es uno de los retos técnicos más importantes del e-commerce. Esta guía te da los números exactos.
¿Por qué el tamaño de imagen afecta las ventas?
Los datos son claros:
- El 53% de usuarios abandona un sitio móvil que tarda más de 3 segundos en cargar (Google)
- Cada segundo adicional de carga reduce las conversiones en un 7%
- Las imágenes representan típicamente el 50–70% del peso total de una página de producto
- Amazon descubrió que un retraso de 100 milisegundos le costaba el 1% de sus ventas
Optimizar imágenes no es solo una tarea técnica: es una inversión directa en ingresos.
Tamaños recomendados según el tipo de imagen
Imagen principal de producto
- Dimensiones: 1000×1000 px (mínimo) hasta 2000×2000 px (para zoom)
- Formato: WebP (con fallback JPG) o JPG calidad 80–85
- Peso: 100–300 KB
- Nota: la mayoría de plataformas como Shopify recomiendan 2048×2048 px para aprovechar el zoom
Imágenes de galería / vistas adicionales
- Dimensiones: 800×800 px a 1500×1500 px
- Formato: WebP / JPG
- Peso: 50–150 KB
Miniaturas en listados de categoría
- Dimensiones: 300×300 px a 600×600 px
- Formato: WebP / JPG
- Peso: 20–60 KB
Imágenes de banner y hero
- Dimensiones escritorio: 1920×600 px a 1920×1080 px
- Dimensiones móvil: 768×400 px a 1080×600 px (sirve una versión específica para móvil)
- Formato: WebP / JPG
- Peso: 150–400 KB
Logotipos y elementos de interfaz
- Formato: SVG (siempre que sea posible) o PNG con transparencia
- Peso: menos de 30 KB
Tabla resumen de dimensiones y pesos
| Tipo de imagen |
Dimensiones (px) |
Formato |
Peso máximo |
| Producto principal |
1000×1000 – 2000×2000 |
WebP / JPG |
300 KB |
| Galería de producto |
800×800 – 1500×1500 |
WebP / JPG |
150 KB |
| Miniatura de categoría |
300×300 – 600×600 |
WebP / JPG |
60 KB |
| Banner / Hero (escritorio) |
1920×600 – 1920×1080 |
WebP / JPG |
400 KB |
| Banner (móvil) |
768×400 – 1080×600 |
WebP / JPG |
150 KB |
| Logotipo |
Variable (vectorial) |
SVG / PNG |
30 KB |
Recomendaciones específicas por plataforma
Shopify
- Imagen de producto: 2048×2048 px máximo (cuadrada recomendada)
- Límite de subida: 20 MB por imagen
- Comprime antes de subir: Shopify no optimiza automáticamente
WooCommerce (WordPress)
- Usa un plugin como Smush o ShortPixel para optimización automática
- Configura los tamaños de miniatura en Ajustes > Medios
- Activa la carga lazy (diferida) de imágenes
Amazon
- Imagen principal: mínimo 1000 px en el lado más largo (para activar el zoom)
- Fondo blanco puro (RGB 255,255,255) obligatorio para la imagen principal
- El producto debe ocupar el 85% del encuadre
Buenas prácticas adicionales
- Fondo consistente: usa siempre el mismo color de fondo (blanco o gris claro) para coherencia visual y mejor compresión
- Proporción cuadrada: 1:1 es el estándar de facto en e-commerce y facilita los layouts en rejilla
- Imágenes responsivas: sirve diferentes tamaños según el dispositivo con
srcset
- Lazy loading: carga las imágenes solo cuando el usuario se acerca a ellas:
loading="lazy"
- CDN: usa una red de distribución de contenidos para servir imágenes desde el servidor más cercano al usuario
- Nombres de archivo descriptivos:
zapatilla-running-azul-talla-42.jpg en lugar de IMG_2034.jpg
Conclusión
Las imágenes de e-commerce deben ser lo suficientemente buenas como para vender y lo suficientemente ligeras como para cargar rápido. Con los tamaños y formatos adecuados, puedes tener imágenes de alta calidad visual que no lastren el rendimiento de tu tienda. El equilibrio está en los detalles: formato WebP, dimensiones ajustadas al uso real y compresión calibrada al 80–85%.
Cómo hacerlo sin subir el archivo
Si el archivo es confidencial, la vía más segura es la que no lo saca de tu equipo. Redimensionar imagen funciona por completo en el navegador: lee el archivo de tu disco, lo procesa en memoria y lo devuelve a tu disco; no se envía nada a ningún servidor.
- Abre Redimensionar imagen.
- Elige el archivo en tu equipo. Se lee localmente, no se sube.
- Introduce el ancho y el alto que necesitas, o elige un preajuste.
- Descarga el resultado. El original se queda donde estaba.
Hazlo en tu navegador, sin que el archivo salga de tu equipo: Redimensionar imagen
