Productafbeeldingen voor Webflow, licht genoeg om te uploaden.
Webflow stelt geen pixelformaat voor productafbeeldingen; de grens ligt bij de bestandsgrootte van elk bestand. De Productstudio neemt één foto van een product, zet het op een studio-ondergrond of in een gestylede scène en levert het in 2K of 4K. Een 2K-PNG kan zwaarder zijn dan Webflow toestaat, dus de JPG-download is het veiligere bestand voor een Webflow-winkel.
Waar Webflow zijn grenzen trekt.
- 1
Een grens aan het gewicht, niet aan het formaat
Elk afbeeldingsformaat kan naar Webflow worden geüpload, zolang het bestand onder de grens voor de bestandsgrootte blijft. Een PNG van een gedetailleerde scène wordt zwaar: in 2K kan hij die grens overschrijden, en een 4K-bestand is nog groter. De JPG-download is het veiligere bestand. Lees de bestandsgrootte van elk bestand af voordat het wordt geüpload; de grens zelf staat in de tabel op deze pagina.
- 2
Main image en More images
Een Webflow-product heeft één veld Main image en een veld More images dat een beperkt aantal verdere afbeeldingen bevat. SVG-bestanden zijn niet toegestaan in afbeeldingsvelden van producten en varianten. Geef het veld Main image het soberste aanzicht van het geheel; de verdere plekken kunnen andere hoeken, een gestylede scène en een detail van dichtbij bevatten, gemaakt uit dezelfde bronfoto.
- 3
Responsieve varianten, behalve bij import
Uit een afbeelding die breed genoeg is, genereert Webflow een reeks smallere varianten, voor inline afbeeldingen in JPG, PNG en WebP. Afbeeldingen die via een CSV-import of de API worden toegevoegd, krijgen zulke varianten niet, en Webflow zegt dat ze al het juiste formaat horen te hebben en geoptimaliseerd horen te zijn. Een catalogus die per import binnenkomt, vraagt dus om vooraf voorbereide bestanden.
Wat Webflow vraagt.
Bron: 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. Gecontroleerd op 12 oktober 2026.
- Bestandsgrootte
- Maximaal 4 MB voor elke afbeelding
- Formaat
- Elk afbeeldingsformaat kan worden geüpload, mits het bestand kleiner is dan de limiet van 4 MB; voor WebP-afbeeldingen geldt een limiet van 16.383 pixels per zijde
- Bestandstypen
- PNG, JPEG, SVG en WebP worden genoemd als de beste afbeeldingsindelingen om te uploaden
- Niet toegestaan
- SVG-afbeeldingen in de afbeeldingsvelden voor producten en varianten, en geanimeerde AVIF-bestanden
- Aantal
- Een product heeft één veld ‘Main image’ en een veld ‘More images’ voor meerdere afbeeldingen, dat tot 25 afbeeldingen bevat
- Responsieve afbeeldingen
- Voor een afbeelding breder dan 3.200 pixels genereert Webflow 7 varianten van 3.200, 2.600, 2.000, 1.600, 1.080, 800 en 500 pixels; varianten worden gemaakt voor inline JPG-, PNG- en WebP-afbeeldingen
- CSV- en API-imports
- Afbeeldingen die via een CSV-import of de API worden toegevoegd, krijgen geen responsieve varianten, dus ze horen al het juiste formaat te hebben en geoptimaliseerd te zijn
- WebP en AVIF
- JPEG- en PNG-assets kunnen met de ingebouwde conversietool naar WebP of AVIF worden omgezet; de conversie is lossy en vervangt het oorspronkelijke bestand
- Alt-tekst
- Alt-tekst kan voor elke afbeelding worden ingesteld, ook voor elke afbeelding in een veld voor meerdere afbeeldingen; Webflow AI kan die genereren voor JPG, PNG, GIF, WebP en AVIF
De foto achter een productpagina in Webflow.
- Maak één foto van het hele product en één foto van dichtbij van het fijnste onderdeel, een sluiting, een wijzerplaat of een ingestikt label; het veld More images heeft naast het hoofdaanzicht ruimte voor een detailaanzicht.
- Houd elke rand van het product binnen het beeld met een marge eromheen; een deel dat door het kader is afgesneden, kan niet getrouw worden aangevuld, welke scène later ook wordt gekozen.
- Noteer de naam, het materiaal en de kleur van het product terwijl het bij de hand is: in Webflow kan voor elke afbeelding alt-tekst worden ingesteld, ook voor elke afbeelding in het veld More images.
Productfoto’s voor Webflow: de antwoorden.
Gaat de PNG of de JPG de Webflow-winkel in?
De JPG, in de meeste gevallen. Webflow begrenst de bestandsgrootte van elk afbeeldingsbestand, en een 2K-PNG van Herofab kan zwaarder zijn dan die grens, terwijl de JPG van hetzelfde beeld lichter is. PNG en JPEG horen allebei bij de formaten die Webflow voor uploads noemt. Als een PNG gewenst is, hoort eerst de bestandsgrootte te worden afgelezen; de gratis formaatchecker toetst een bestand in de browser aan de gepubliceerde grens van Webflow.
Kan de conversietool van Webflow op Herofab-beelden worden gebruikt?
De ingebouwde tool van Webflow zet JPEG- en PNG-assets om naar WebP of AVIF. Webflow omschrijft de conversie als lossy en zegt dat ze het originele bestand vervangt. Bewaar het bestand dat bij Herofab is gedownload buiten Webflow als masterkopie voordat er wordt geconverteerd, en bekijk fijne belettering op het product zodra de conversie klaar is.
Hoeveel afbeeldingen neemt een Webflow-product?
Eén in het veld Main image en een vast aantal meer in het veld More images; het aantal staat in de tabel op deze pagina. De Productstudio kan het product van voren, driekwart, van opzij of van bovenaf tonen, op een effen ondergrond of in een scène, allemaal uit één bronfoto. Elke toegevoegde afbeelding is weer een bestand onder de grens voor de bestandsgrootte, en elk kan een eigen alt-tekst dragen.
Wat kost het?
4 credits per afbeelding, plus één credit voor 4K. De kosten ziet u vóór het genereren; mislukt een opdracht, dan krijgt u de credits terug. De 20 gratis credits bij aanmelding zijn goed voor 5 afbeeldingen met deze tool.
Uw volgende collectie, deze week gefotografeerd.
20 credits bij aanmelding, geen creditcard nodig. Afbeeldingen gemaakt met gratis credits hebben een watermerk.