Des images produit Webflow, assez légères pour l’import.
Webflow ne fixe aucune taille en pixels pour les images produit ; sa limite porte sur le poids de chaque fichier. Le Studio produit prend une photo d’un produit, le place sur un fond studio ou dans une mise en scène et le livre en 2K ou en 4K. Un PNG 2K peut peser plus que ce que Webflow autorise : le téléchargement JPG est donc le fichier le plus sûr pour une boutique Webflow.
Là où Webflow pose ses limites.
- 1
Une limite de poids plutôt qu’une taille
Une image de n’importe quelle taille peut être importée dans Webflow pourvu que le fichier reste sous sa limite de poids. Le PNG d’une scène détaillée s’alourdit : en 2K il peut dépasser cette limite, et un fichier 4K est plus lourd encore. Le téléchargement JPG est le fichier le plus sûr. Lisez le poids de chaque fichier avant de l’importer ; la limite elle-même figure dans le tableau de cette page.
- 2
Les champs « Main image » et « More images »
Un produit Webflow a un champ « Main image » et un champ « More images » qui reçoit un nombre limité d’images supplémentaires. Les fichiers SVG ne sont pas autorisés dans les champs image des produits et des variantes. Donnez au champ « Main image » la vue entière la plus simple ; les autres emplacements peuvent recevoir d’autres angles, une mise en scène et un détail en gros plan réalisés à partir de la même photo source.
- 3
Des variantes responsives, sauf à l’import
À partir d’une image suffisamment large, Webflow génère une série de variantes plus étroites, pour les images JPG, PNG et WebP insérées dans la page. Les images ajoutées par un import CSV ou par l’API ne reçoivent pas ces variantes, et Webflow indique qu’elles devraient déjà être à la bonne taille et optimisées. Un catalogue importé demande donc des fichiers préparés à l’avance.
Ce que Webflow demande.
Source : Webflow Help Center — Responsive images; Image; Image file types; Image resolution; Multi-image Collection field; Ecommerce Collections overview; Assets panel; Image conversion tool; Import/export Ecommerce products and variants; Include alt text on images. Vérifié le 12 octobre 2026.
- Poids du fichier
- 4 Mo au maximum pour chaque image
- Taille
- Toute taille d’image peut être envoyée pourvu que le fichier reste sous la limite de 4 Mo ; les images WebP ont une limite de 16 383 pixels par côté
- Formats
- PNG, JPEG, SVG et WebP sont cités comme les meilleurs formats d’image à envoyer
- Interdit
- Images SVG dans les champs d’image de produit et de variante, et fichiers AVIF animés
- Nombre
- Un produit a un champ Main image et un champ multi-images More images, qui contient jusqu’à 25 images
- Images adaptatives
- Pour une image de plus de 3 200 pixels de large, Webflow génère 7 variantes en 3 200, 2 600, 2 000, 1 600, 1 080, 800 et 500 pixels ; les variantes sont créées pour les images JPG, PNG et WebP insérées comme éléments d’image
- Imports CSV et API
- Les images ajoutées par un import CSV ou par l’API ne reçoivent pas de variantes adaptatives ; elles devraient donc déjà être à la bonne taille et optimisées
- WebP et AVIF
- Les fichiers JPEG et PNG peuvent être convertis en WebP ou en AVIF avec l’outil de conversion intégré ; la conversion se fait avec perte et remplace le fichier d’origine
- Texte alternatif
- Un texte alternatif peut être défini pour chaque image, y compris pour chaque image d’un champ multi-images ; Webflow AI peut le générer pour les JPG, PNG, GIF, WebP et AVIF
La photo derrière une page produit Webflow.
- Prenez une photo du produit entier et une photo rapprochée de sa partie la plus fine, un fermoir, un cadran ou une étiquette cousue ; le champ « More images » a de la place pour une vue de détail à côté de la vue principale.
- Gardez chaque bord du produit dans l’image, avec une marge autour ; une partie coupée par le cadre ne peut pas être restituée fidèlement, quelle que soit la scène choisie ensuite.
- Notez le nom, la matière et la couleur du produit tant que vous l’avez en main : Webflow permet de définir un texte alternatif pour chaque image, y compris pour chacune de celles du champ « More images ».
Photos produit pour Webflow : les réponses.
Faut-il mettre le PNG ou le JPG dans une boutique Webflow ?
Le JPG, dans la plupart des cas. Webflow limite le poids de chaque fichier image, et un PNG 2K de Herofab peut être plus lourd que cette limite, alors que le JPG de la même image est plus léger. Le PNG et le JPEG figurent tous deux parmi les formats que Webflow nomme pour l’import. Si un PNG est souhaité, son poids devrait être lu d’abord ; le vérificateur de taille d’image gratuit teste un fichier dans le navigateur au regard de la limite publiée par Webflow.
L’outil de conversion de Webflow peut-il servir sur les images Herofab ?
L’outil intégré de Webflow convertit les fichiers JPEG et PNG en WebP ou en AVIF. Webflow décrit cette conversion comme une conversion avec perte et précise qu’elle remplace le fichier d’origine. Avant de convertir, gardez hors de Webflow le fichier téléchargé depuis Herofab comme copie maîtresse, et regardez les petits textes du produit une fois la conversion faite.
Combien d’images un produit Webflow reçoit-il ?
Une dans le champ « Main image » et un nombre défini d’autres dans le champ « More images » ; ce nombre figure dans le tableau de cette page. Le Studio produit peut montrer le produit de face, de trois-quarts, de profil ou de dessus, sur un fond uni ou dans une scène, le tout à partir d’une seule photo source. Chaque image ajoutée est un fichier de plus sous la limite de poids, et chacune peut porter son propre texte alternatif.
Combien cela coûte-t-il ?
4 crédits par image, plus un crédit pour la 4K. Le coût est affiché avant la génération, et si une tâche échoue, les crédits sont restitués. Les 20 crédits offerts à l’inscription couvrent 5 images avec cet outil.
Votre prochaine collection, photographiée cette semaine.
20 crédits à l’inscription, sans carte bancaire. Les images réalisées avec les crédits offerts portent un filigrane.