Shopify vous offre plus de marge de manœuvre à l'upload que n'importe quelle marketplace — 5000×5000 pixels, 20 Mo par fichier, plusieurs formats. Cette liberté est aussi un piège. Les vendeurs téléversent ce qui sort de leur appareil photo, les thèmes recadrent d'une manière qu'ils n'avaient pas anticipée, les visiteurs mobiles patientent quatre secondes pour voir une image hero, et le taux de rebond grimpe discrètement. Cet article répond aux dix questions que les vendeurs Shopify se posent réellement sur les images produit — specs, thèmes, performance, SEO et variantes — avec les chiffres dont vous avez besoin pour décider.
Quelle taille doivent faire les images produit Shopify ?
Téléversez en 2048×2048 pixels, carré. C'est le format que la documentation officielle de Shopify recommande comme taille master, et c'est autour de cette valeur que sont construits tous les thèmes majeurs.
| Rôle de l'image | Taille recommandée | Ratio | Justification |
|---|---|---|---|
| Image produit (master) | 2048×2048 px | 1:1 | Zoom + rendu Retina |
| Image produit (minimum) | 800×800 px | 1:1 | En dessous, le zoom ne fonctionne plus |
| Image de collection | 1024×1024 px | 1:1 | Grilles d'affichage du thème |
| Hero / bannière | 1920×1080 px | 16:9 | Pleine largeur desktop |
| Slideshow | 1600×500 à 1920×600 px | 3:1 à 4:1 | Dépend du thème |
| Logo | 450×200 px | ~2:1 | Affichage en en-tête |
| Favicon | 32×32 px | 1:1 | Onglet de navigateur |
Limites strictes à l'upload : 5000×5000 px, 20 Mo. Tout ce qui dépasse est rejeté. Mais « peut être téléversé » et « devrait être téléversé » sont deux choses différentes — voir la section sur le poids des fichiers ci-dessous.
Quel poids de fichier garde les pages rapides ?
Les recommandations officielles de Shopify placent la cible pratique à 200–500 Ko par image produit, et les boutiques majoritairement mobiles devraient viser plutôt 200–300 Ko.
Pourquoi cela compte : chaque tranche de 100 Ko ajoute environ 150 à 300 ms de temps de chargement sur une connexion mobile 4G. Une page produit avec 10 images à 2 Mo chacune représente 20 Mo de payload — soit plus de 30 secondes de chargement sur les réseaux mobiles plus lents, ce que la télémétrie de Shopify corrèle fortement avec l'abandon de panier.
| Poids de l'image | Temps de chargement (4G) | Conséquence |
|---|---|---|
| <200 Ko | <1 s | Rapide, aucune latence perçue |
| 200–500 Ko | 1–2 s | Acceptable pour hero/produit |
| 500 Ko–1 Mo | 2–4 s | Délai perceptible, risque de rebond en hausse |
| >1 Mo | >4 s | Rebond significatif sur mobile |
Shopify compresse automatiquement et sert des variantes WebP, mais seulement si votre source est optimisée. Téléversez un PNG de 15 Mo et Shopify le compressera, mais la compression automatique reste conservatrice — vous obtenez bien de meilleurs résultats en compressant en JPEG qualité 80-85 avant l'upload.
Faut-il utiliser JPEG, PNG, WebP ou SVG ?
Le choix du format dépend du type d'image.
| Format | À utiliser pour | À éviter pour | Notes |
|---|---|---|---|
| JPEG | Photos produit, plans lifestyle | Images nécessitant de la transparence | La qualité 80-85 est le meilleur compromis |
| PNG | Logos, icônes, infographies avec transparence | Photographies (poids inutilement élevé) | À utiliser uniquement si vous avez besoin d'un canal alpha |
| WebP | Tout (si vous pouvez l'exporter) | Navigateurs anciens (problème rare en 2026) | 25 à 35 % plus léger que JPEG à qualité égale |
| SVG | Icônes, logos, graphismes simples | Photos produit | Redimensionnable à l'infini, poids minime |
| GIF | Démos animées (avec parcimonie) | Tout le reste | Utilisez plutôt MP4/WebM pour l'animation |
Shopify sert automatiquement du WebP aux navigateurs compatibles, peu importe ce que vous téléversez — inutile donc de stresser sur le format d'upload. Concentrez-vous sur la qualité de la source et sur le respect de la cible de poids. Le JPEG qualité 85 est le choix sûr par défaut pour la photographie produit.
Dois-je obligatoirement utiliser des images carrées sur Shopify ?
Non — mais c'est sans doute ce qu'il vous faut. La plupart des thèmes Shopify affichent par défaut des grilles carrées, et les uploads non carrés sont recadrés. Si votre thème attend du 1:1 et que vous téléversez du 4:3, soit le haut soit le bas de votre produit est coupé, soit l'image flotte dans une boîte blanche qui semble incohérente à côté des autres.
Quand le carré fonctionne : grilles produit par défaut, pages collection, résultats de recherche, carrousels de produits liés. Soit 90 % des cas d'usage.
Quand vous pourriez choisir le portrait (3:4 ou 4:5) : boutiques mode centrées sur des photos pleine silhouette portées, où la composition verticale compte. Cela exige un thème conçu spécifiquement pour les ratios portrait (Dawn avec les réglages adéquats, Impact, Impulse) — n'imposez pas le portrait dans un thème par défaut en carré.
Quand le paysage (16:9) convient : bannières hero, scènes lifestyle utilisées en images secondaires. Jamais pour l'image produit principale sur un thème à grille carrée.
Le workflow sûr : shootez plus large que nécessaire, recadrez en 2048×2048 carré pour votre image produit master, puis créez des variantes 2048×2048 supplémentaires pour les autres angles. Les compositions paysage ne servent que pour les bannières et les slideshows.
Comment les thèmes Shopify influent-ils sur l'affichage des images ?
Chaque thème recadre et redimensionne les images différemment — c'est la première source de plaintes du type « mes photos rendent mal sur mon site ». Avant de finaliser vos specs d'image, testez dans votre thème réel.
| Thème | Recadrage page produit | Grille collection | Notes |
|---|---|---|---|
| Dawn (défaut Shopify) | Configurable (carré, portrait, paysage, natif) | Suit le réglage de la page produit | Le plus flexible |
| Debut | Carré imposé | Carré | Affichage 1:1 strict |
| Impact | Compatible portrait | Configurable | Optimisé mode |
| Motion | Pleine page, contrôlé par le thème | Style carte | Orienté animation |
| Minimal | Centré avec padding | Carré | Ajoute du blanc si l'image n'est pas carrée |
Test pratique : après upload, visualisez votre page produit et votre page collection sur desktop et mobile. Si le recadrage produit semble faux, corrigez l'image source — ne comptez pas sur des ajustements CSS du thème, qui sautent à chaque mise à jour.
Comment cela se compare-t-il à Amazon et eBay ?
Si vous vendez sur plusieurs plateformes depuis la même bibliothèque produit, les specs divergent sur des points importants.
| Spec | Shopify | Amazon | eBay |
|---|---|---|---|
| Taille recommandée | 2048×2048 px | 2000×2000 px | 1600×1600 px |
| Taille minimum | 800×800 px | 1000×1000 px (zoom) | 500×500 px |
| Taille max | 5000×5000 px, 20 Mo | 10000 px côté le plus long | 7 Mo |
| Ratio | Flexible selon le thème | 1:1 obligatoire | 1:1 recommandé |
| Arrière-plan | Libre | Blanc pur (image principale) | Propre, blanc non obligatoire |
| Logos/filigranes | Autorisés | Interdits sur l'image principale | Interdits sur l'image principale |
| Texte en surimpression | Autorisé | Interdit sur la principale, permis sur les secondaires | Limité sur la principale |
| Format de fichier | JPEG, PNG, WebP, GIF, SVG | JPEG, PNG, TIFF, GIF | JPEG, PNG, GIF, BMP, TIFF |
Conséquence pratique : une image unique conforme Amazon (2000×2000 sur blanc pur, sans texte) fonctionne partout, mais elle reste trop sobre pour Shopify où les visuels lifestyle et les infographies convertissent mieux. Construisez votre bibliothèque d'images autour d'un master propre 2048×2048, puis empilez des variantes par-dessus.
Quel texte alternatif écrire pour le SEO ?
Le texte alt sert trois publics : les lecteurs d'écran, la recherche d'images Google, et le fallback lorsqu'une image est cassée. Écrivez pour les deux premiers — le troisième se gère tout seul.
Formule d'un bon texte alt : [Nom du produit] [descripteur clé] [contexte si pertinent]
| Type d'image | Alt faible | Alt solide |
|---|---|---|
| Produit principal | « tasse blanche » | « Tasse à café céramique blanche 35 cl finition mate » |
| Variante de couleur | « version rouge » | « Tasse à café céramique rouge 35 cl finition mate » |
| Plan lifestyle | « tasse sur une table » | « Tasse céramique blanche sur table en bois au petit-déjeuner avec café du matin » |
| Plan détail | « gros plan » | « Gros plan sur tasse céramique blanche mate montrant la texture de l'anse » |
| Infographie | « schéma » | « Infographie des dimensions de la tasse indiquant 9 cm de hauteur et 10 cm de diamètre » |
Règles :
- Sous les 125 caractères (les lecteurs d'écran tronquent à cette longueur)
- Intégrez le mot-clé principal naturellement, pas de bourrage
- Décrivez ce qui est réellement montré, ne recopiez pas le titre du produit
- Un alt différent pour chaque image du même produit (pas de copies identiques)
- Évitez les tournures du style « image de » ou « photo de » — les technologies d'assistance les ajoutent automatiquement
Comment gérer les images de variantes (couleur, taille, style) ?
Shopify permet d'associer des images à des variantes spécifiques. C'est là que la plupart des boutiques sous-performent.
Configuration minimum viable : une image par variante de couleur montrant cette couleur exacte. C'est ce que les clients attendent — cliquer sur « rouge » doit afficher le produit rouge, pas le blanc.
Meilleure configuration en mode et maison :
- Image principale de variante : produit sous le même angle, avec le même éclairage et la même composition pour toutes les couleurs (pour faciliter la comparaison visuelle)
- Image lifestyle secondaire : produit en usage, dans une teinte qui correspond à la variante
- Image détail : gros plan rendant fidèlement la couleur/texture
Les variantes de taille ne nécessitent pas d'images séparées sauf si le produit a visuellement un aspect différent selon les tailles (p. ex. petit sac vs grand sac aux proportions distinctes). Pour le prêt-à-porter, un seul set de photos portées plus un tableau de tailles suffisent.
La fidélité colorimétrique est critique : les acheteurs attendent que l'image de la variante corresponde à la réalité à l'écran. Si l'éclairage studio décale les couleurs, corrigez-le en post avant l'upload. Les retours liés à la couleur sont largement dus à un écart image/réalité sur les variantes de teinte.
La vitesse de la page et le poids des images influent-ils vraiment sur la conversion ?
Oui, de façon mesurable. Les données Core Web Vitals de Google et les études benchmark e-commerce convergent :
- LCP (Largest Contentful Paint) sous 2,5 s : seuil minimum pour un bon classement
- LCP entre 2,5 et 4 s : baisse notable des indicateurs d'engagement
- LCP supérieur à 4 s : envolée du taux de rebond sur mobile
Votre image produit hero est généralement l'élément LCP d'une page produit. Lui retirer 500 Ko fait typiquement baisser le LCP de 200 à 500 ms en 4G mobile, ce qui s'ajoute sur l'ensemble de la session.
| Amélioration de vitesse | Effet typique sur la conversion |
|---|---|
| 1 s → 2 s | Ligne de base, aucun effet |
| 3 s → 2 s | +3 à 7 % de conversion |
| 5 s → 2 s | +10 à 15 % de conversion sur mobile |
| 8 s → 3 s | +25 à 30 % de conversion sur mobile |
Voilà pourquoi la cible de 200-500 Ko par fichier compte plus qu'on ne le pense. Dix images à 500 Ko, c'est une page de 5 Mo. Dix images à 2 Mo, c'est une page de 20 Mo — la différence se ressent chez chaque visiteur mobile.
Checklist avant upload
Parcourez cette liste avant d'ajouter des images à un produit :
- Taille master en 2048×2048 pixels (ou 2000×2000 si multi-canal)
- Ratio carré cohérent avec la grille par défaut du thème
- Export JPEG qualité 80-85 (ou WebP qualité 80)
- Poids de fichier entre 200 et 500 Ko par image
- Nom de fichier descriptif :
nom-produit-couleur-angle.jpg(pasIMG_4821.jpg) - Texte alt rédigé pour chaque image, sous 125 caractères
- Couleurs conformes à la réalité (vérifiées sur écran calibré)
- Images de variantes correctement assignées dans l'admin Shopify
- Prévisualisation vérifiée sur desktop et mobile après upload
- Recadrage testé dans votre thème spécifique
FAQ
Shopify compresse-t-il automatiquement mes images ?
Oui. Shopify sert une version optimisée via son CDN, souvent en WebP aux navigateurs compatibles, dimensionnée selon le viewport. Mais la compression est lossy par-dessus ce que vous téléversez — une source pré-optimisée donne toujours de meilleurs résultats que le recours à la compression automatique.
Puis-je utiliser les mêmes images produit sur Shopify et Amazon ?
Votre image produit principale — oui, un visuel 2000×2000 sur fond blanc pur fonctionne sur les deux. Les images secondaires diffèrent généralement : Amazon interdit les logos et la plupart des surimpressions de texte sur l'image principale et applique des règles plus strictes sur les secondaires, tandis que Shopify laisse toute liberté créative. Gardez des dossiers séparés étiquetés par canal.
Quelle est la taille idéale de la bannière hero pour ma page d'accueil ?
1920×1080 pixels est la valeur par défaut sûre. Certains thèmes gèrent le 2400×1200 pour les écrans ultra-larges. Prévoyez toujours un recadrage mobile dédié (1080×1080 ou 1080×1350) — les mobinautes doivent voir un cadrage serré sur le produit, pas une tranche du milieu de votre bannière desktop.
Combien d'images par produit devrais-je avoir ?
Sept à huit images, c'est le sweet spot pour la plupart des catégories : principale fond blanc, 2-3 angles supplémentaires, 1-2 lifestyle/en usage, 1 référence d'échelle/taille, 1 infographie. Moins de quatre donne l'impression d'une fiche incomplète ; plus de dix ajoute du bruit sans booster la conversion.
Pourquoi mes images produit semblent-elles floues sur mobile ?
Trois causes fréquentes : (1) l'image source était en dessous de 2048 px et a été étirée, (2) le thème sert une variante très compressée parce que votre source est trop lourde, (3) les écrans Retina mobiles rendent différemment du desktop — une image nette en desktop peut paraître molle sur un écran mobile 3x. Solution : téléversez une source 2048×2048 nette et laissez Shopify gérer la réduction.
