Når en potentiel kunde lander på din Shopify hjemmeside, bruger de billederne til at beslutte, om de vil foretage et køb. Din opgave som købmand er derfor at sikre, at billederne ikke sænker sidens indlæsningshastigheder (så for at skubbe folk væk) og at formatere og tilpasse billederne korrekt.
På denne måde fremstår billederne ikke strakte eller afskåret. I vores ultimative Shopify billedstørrelsesguide viser vi dig vigtigheden af specifikke billedstørrelser for Shopify fotografering og give de ideelle størrelser til ting som dit logo, bannerbillede og produktbilleder.
Fortsæt med at læse for at lære alt om Shopify billedstørrelser!
Hvorfor skal du bekymre dig om Shopify Billedstørrelser?
Det er kedeligt at administrere og uploade billeder. Alligevel er de ofte de største lovovertrædere, når det kommer til langsomme webstedshastigheder, SEO-problemer og lave konverteringer på et e-handelswebsted.
Og den vanskelige del ved alle webstedsbyggere og e-handelsplatforme er, at du skal holde dig til meget bestemte billedstørrelser for at sikre, at de er optimeret og ser præsentable ud.
For at opsummere det, her er hvorfor Shopify billedstørrelser betyder noget:
- Indtast hvert billede Shopify kræver unikke dimensioner, som hvordan logoer skal have en anden størrelse end bannerbilleder.
- Brugere er mere tilbøjelige til at konvertere til betalende kunder, når de tydeligt kan se billederne i det rigtige format.
- Korrekt størrelse og optimerede billeder kan booste dit SEO-potentiale.
- Fotografering i dårlig størrelse kan forårsage udstrakte eller beskårne billeder, hvilket fører til en grim hjemmeside.
- Du kan opleve, at billeder med den forkerte størrelse får dit websted til at sænke farten, eller forhindrer kunder i at ville vente helt.
Sammen med disse punkter: skarpe billeder i god størrelse præsenterer et vist niveau af professionalisme, og leverer følelsesmæssige reaktioner til kunderne, at du er en betroet virksomhed, og dine produkter er af højeste kvalitet. Dårlige billeder ser simpelthen ud, som om du ikke er bekymret for dine produkter eller den måde, de vises på. Dine kunder kan spørge, "hvor ellers skærer de hjørner?"
Med det sagt, tag et kig på vores hurtige referenceguide om det bedste Shopify billedstørrelser for områder som produktsider, bannerbilleder og logoer.
Det bedste Shopify Billedstørrelser (Baseret på hvor billederne bruges)
Ikke alle disse er hårde regler, men det er bedst at holde sig til den "ideelle størrelse" så meget som muligt. Temaer har af og til deres egne billedstandarder, så hold øje med det. Ellers forklarer vi, hvornår du har lidt spillerum i forhold til dimensionerne.
Er der en Go-to-billedstørrelse at bruge på tværs Shopify?
Nej, men hvis du planlægger at tage den tilgang, er her, hvad vi anbefaler:
- Sørg for, at alle billeder er store nok til at vise de indviklede detaljer om produktet.
- Hold dog billederne små nok til ikke at hindre webstedets ydeevne.
- En god tommelfingerregel er at holde sig til 2048 × 2048 pixels for firkantede billeder.
- Undgå alt mindre end 800 × 800 pixels for kvadratiske billeder.
- Undgå noget større end 4472 × 4472 for kvadratiske billeder.
For ikke-firkantede billeder foreslår vi bestemt at bruge guiderne nedenfor. Det er også værd at bemærke, at nogle temaer beskærer billeder anderledes, så du skal muligvis gætte og tjekke for at se, hvilke billedstørrelser der fungerer bedst for din onlinebutik.
For den bedste vejledning, tag et kig på det ideelle Shopify billedstørrelser nedenfor, alle kategoriseret baseret på billedtype:
1. Shopify Produktbilledstørrelse (ideel størrelse: 2048 × 2048 pixels)
Produktbilleder fungerer som de primære former for medier, der bruges til at lave salg. Shopify's temaer gør et ret godt stykke arbejde med at beskære og optimere produktbilleder for dig, men du bør aldrig stole på de automatiserede værktøjer.
anbefalede dimensioner til produktbilleder på Shopify er 2048 x 2048 pixels.
Dette er et vidunderligt sted at sikre, at dine billeder ikke sænker dine sidehastigheder, samtidig med at det sikrer, at kunderne ser rigdommen i detaljer fra dine originale billeder.
Vi foreslår et firkantet billede til produktfotos, for at undgå uønsket beskæring fra Shopify temaer.
Skærmbilledet nedenfor viser et billede uploadet som 2048 × 2048 pixels, og det resulterede i ingen beskæring.
Længere og bredere billeder kan stadig fungere til produktbilleder, men der er mindre kontrol over, hvad temaet gør ved dine billeder. Du kan opleve, at landskabsbilleder bliver formindsket i størrelse i forhold til portrætformatet.
2. Shopify Samlingsbilledstørrelse (ideel størrelse: 2048 × 2048 pixels)
Tilføjelse af en samling kræver ikke nødvendigvis et billede, men det giver dig mulighed for at oprette en separat side for den samling, næsten som en landingsside, der kun er lavet til en lille undergruppe af produkter.
Et samlingsbillede uploades under Opret samling afsnit i Shopify.
Herefter kan du tilføje et produkt til samlingen og vise det i en indholdsblok på hjemmesiden eller som en side for sig selv.
Hvis du forlader Billede felt tomt på en samlingsside, vil det tage et af de fremhævede produktbilleder fra den samling som standard.
Den anbefalede Shopify billedstørrelsen for samlinger er 2048 × 2048 pixels.
De firkantede dimensioner hjælper med at etablere et standardiseret format på tværs af alle samlinger, især når de vises ved siden af hinanden.
Du vil også opdage, at firkantede billeder er nemmere at arbejde med, når du bruger indholdsblokke, der viser samlinger.
Som altid kan dine resultater variere baseret på det anvendte tema. Nogle temaer tilbyder faktisk yderligere muligheder med dine samlingsbilleder, så du kan dele billedet som et banner på en separat samlingsside. I dette tilfælde kan den optimale størrelse på dit samlingsbillede være helt anderledes end det, vi har talt om her. Samlet set er din bedste handlingsplan at gå gennem test med dit tema. Upload flere billeder af unikke størrelser til dine samlinger. Skriv dem ned, der virker, og brug derefter altid disse dimensioner. Bare sørg for, at billederne ikke er for store eller for små, så klarer du dig.
3. Shopify Logo billedstørrelse (ideel størrelse: 450W × 250H pixels)
Logoet skiller sig ud som markeringen af din e-handelsbutik. Det vises lige, når nogen lander på din hjemmeside, og på hele webstedet, i betragtning af at det normalt er synligt i header-området.
Shopify brugere, der har problemer med logostørrelser, kan opleve, at logoet ikke er stort nok, eller det gør navigationsmenuen deformeret på en eller anden måde. Eller du vil måske opdage, at logoet efterlader en masse hvid plads under eller over.
For at løse de fleste af disse problemer foreslår vi, at du bruger logodimensioner på 250 pixels i højden og 450 pixels i bredden.
I virkeligheden, Shopify anbefaler aldrig at gå højere end disse mål for bredde og højde. Når det er sagt, kan du gå mindre, så længe dit tema tillader det.
Ind imellem kaster sidebjælken ting af sig, eller måske har din navigationsmenu for mange elementer, der skubber logoet i en mærkelig retning. Uanset hvad er det bedst at lege med dit logos dimensioner og webstedsindstillinger for at opnå det bedste udseende.
Som et alternativ ser nogle temaer godt ud med firkantede logoer, men hold det under 250 x 250 pixel mærket, så det ikke fylder for meget.
For den mest alsidighed, gå til Indstillinger > Mærke in Shopify at tilføje en Standard og Square billede. På denne måde kan du uploade enten afhængigt af situationen.
4. Shopify Bannerbilledstørrelse (ideel størrelse: 2000 W × 600H pixels)
Det kaldes jævnligt et Hero-billede eller billedbanner, og det er de større billeder, du kan placere øverst på en hjemmeside for at fremvise nye produkter og inkludere tekst med en knap. Det er vigtigt, at bannerbilleder har høj opløsning for at forhindre kornethed efter ændring af størrelse, og når de ses på forskellige enheder.
Shopify også har en Header indholdssektion, som fungerer på samme måde som Bannerbillede indholdssektion.
Uanset hvilken du vælger, anbefaler vi, at du holder dig til dimensionerne 1200 pixels i bredden x 600 pixels i højden for bannere og heltebilleder.
Når det er sagt, kan du ofte slippe afsted med alt fra 1200–2000 pixels for din bredde og 400–600 pixels for højden. Og som altid afhænger det af dit tema.
Endelig er det også klogt at justere indstillinger for alle billedbannere og heltebilleder. Du kan ændre bannerhøjden for de fleste temaer og fortælle Shopify hvor du gerne vil have bannerindholdet til at sidde, f.eks. i nederste højre hjørne eller øverst – for at få et bedre overblik over billedet bag indholdet.
5. Shopify Slideshow billedstørrelse (ideel størrelse: 2000W × 600H pixels)
Ligesom et banner skal du bruge billeder i høj opløsning i diasshows. Disse indholdssektioner giver dig mulighed for at vise flere fotografier i ét område på en side. De glider derefter til det næste billede i rækkefølge.
Da de minder så meget om bannere, vil du faktisk bevare den samme bredde og højde, som du ville have for en helt eller et bannerbillede. Anbefalingen er en bredde på 2000 pixels og en højde på 600 pixels. Højden kan dog variere fra 400–600 pixels, og bredden kan gå fra 1200–2000 pixels.
Sørg for at administrere alle diasshowindstillinger for at etablere den bedste formatering til dit diasshow. Du skal muligvis flytte indholdsboksen til en anden placering, eller måske ville diasshowet se bedre ud, hvis du udvidede højden lidt.
En af hovedreglerne for et diasshow er altid at uploade billeder af samme størrelse til det samme diasshow. Du er mere end velkommen til at justere dimensioner, når du laver et separat diasshow, men sørg bare for, at billederne kombineret i ét diasshow alle har de samme dimensioner, for kontinuitet og brugeroplevelse.
Sådan optimeres Shopify Billeder
Optimeringen af dine billeder hjælper dig med at forbedre, hvordan billeder indlæses på din e-handelsbutik. Det hjælper dig også med at skabe en mere brugervenlig oplevelse på hjemmesiden, idet billederne skal komplementere shoppingoplevelsen, ikke overdøve den.
Der er flere aspekter at overveje, når du optimerer dine billeder til Shopify. Disse områder omfatter optimale billedformater, komprimeringer, billedkilder, styling og mere. Fortsæt med at læse for at lære alt om de bedste fremgangsmåder og trin til at optimere billeder i Shopify.
Trin 1: Vælg det optimale billede Format
Shopify billedstørrelser er vigtige, men det første skridt i enhver fotooptimering bør involvere at vælge det bedste billedformat.
Det er der mange billedformater Shopify tillader.
Her er hvad der gør dem specielle:
- JPEG/JPG: Måske det mest almindelige filformat for billeder, og med rette. JPEG'er komprimerer godt og giver fremragende kvalitet. Vi anbefaler dem til produktsider, især når du har fine detaljer i billederne.
- PNG: Denne filtype er faktisk bedre end JPEG'er til at bevare kvaliteten efter at have reduceret billedstørrelsen. Du kan dog opleve, at PNG'er ikke komprimerer så meget. De er bedst, når du har brug for en gennemsigtig baggrund (understøttes ikke af JPEG'er), så vi kan lide dem til logoer og nogle bannerbilleder.
- GIF: GIF er et billedformat til animationer. Det er i bund og grund ligesom at omdanne en kort video til et levende billede, hvilket er nyttigt til kort at forklare et produkt uden den anmassende størrelse af en video. Vi kan lide dem på hjemmesider, produktsider og blogindlæg. Overbrug dog ikke GIF'er, da de mangler den rige farvekvalitet, der findes i andre formater som JPEG, TIFF og PNG.
- WebP: WebP er måske det mest alsidige af alle billedformater, og WebP bliver mere og mere almindeligt, da det tilbyder stærkere komprimering og kvalitet end både JPEG og PNG, sammen med gennemsigtighedsfordelene ved PNG. For ikke at nævne, du kan også lave animationer med WebP. Overvej at bruge WebP til alle typer billeder i Shopify. Vi forventer at se WebP blive brugt hyppigere på tværs af internettet i fremtiden.
Andet end det, Shopify understøtter formater som HEIC, progressiv JPEG og AVIF. HEIC er billedformatstandarden, der bruges på tværs af Apple-enheder. Det er ekstremt kompakt, kan indeholde flere billeder i ét billede og giver fremragende kvalitet. De er dog inkompatible med de fleste ikke-Apple-enheder, hvilket gør det svært at anbefale. AVIF-billedformatet har ret stærke fordele på grund af dets høje kvalitet og dramatiske komprimeringshastigheder. Kort sagt burde din præstation med en AVIF faktisk være stærkere end med JPEG- og WebP-billeder. Det tager dog et stykke tid for desktop- og mobilbrowsere at adoptere det som en filformatstandard. Så vi kan ikke anbefale det lige nu. Ikke før næsten alle med en internetforbindelse faktisk kan se billederne online.
Baseret på hvad du planlægger at bruge billedet til, vælg det passende format ovenfra. Gå derefter til næste trin, så dine billedstile forbliver de samme på tværs af dit websted.
Trin 2: Optag for den samme stil på alle fotografier
Kontinuitet er nøglen til fotografi i e-handel. Det etablerer det overordnede udseende af dit brand og skaber en standardiseret følelse på tværs af hele dit websted.
For eksempel er det almindeligt, at mærker bruger én baggrundsfarve til alle produktbilleder.
Dette gælder også for billedernes dimensioner og stil. Hvis de fleste af dine produktbilleder er i liggende retning, skal du undgå at blande nogle få billeder med liggende retning. Du er mere end velkommen til at inkorporere både livsstils- og produktbilleder i blandingen, men det er bedst at holde sig til én stil til størstedelen af dine optagelser.
Trin 3: Skab en blanding af både produkt- og livsstilsfotografering
Som nævnt vil du højst sandsynligt bruge én type fotografistil til størstedelen af dine produktbilleder. Det er dog vigtigt at inkludere nogle livsstilsbilleder for at komplementere standardproduktbillederne med ensfarvet baggrund og anderledes visning af produkterne.
E-handelsvirksomheder har en ulempe, hvor kunderne ikke kan prøve eller røre ved produkterne lige dér. Det er her, livsstilsbilleder spiller ind. Brugere kan se, hvordan produkterne ser ud i aktion. Hvordan en skjorte draperer over kroppen, eller på størrelse med et skateboard, hvor nogen rent faktisk står på den.
Trin 4: Vælg passende filnavne og titler
Hver billedfil har et navn, og Shopify tager det filnavn og udgiver det i metadataene på dit websted (enhver e-handelsplatform gør dette).
Så hvis du gemmer billeder som nyt-foto(1).jpg på din computer, og upload dem til din butik, vil søgemaskinerne ikke have nogen information om indholdet af billedet. Dette kan skade din SEO.
Når du optimerer billeder, skal du gennemgå disse trin for at sikre, at søgemaskinerne (og dem med synshandicap) kan forstå, hvad der foregår på billedet:
- Tilføj et filnavn, der minder om det, der er inde i billedet.
- Hvis du tilfældigvis uploader et generisk filnavn, skal du ændre billedet Titel in Shopify. Dette erstatter standarden.
- Brug alt-tags for en endnu stærkere repræsentation af, hvad der vises på billedet. Det er de vigtigste elementer, som søgemaskinerne ser på, da det viser, at din brugeroplevelse er forbedret for synshandicappede.
Trin 5: Komprimer billeder før eller under upload
Shopify tilbyder automatisk komprimering af alle billeder, der er uploadet til dens servere, men du skal ikke stole helt på det.
Dit bedste bud er enten at bruge et tredjepartsværktøj til at komprimere billeder før upload til Shopify, eller installer en Shopify plugin der automatisk komprimerer billeder ved upload.
Det er meget nemmere at gå app-vejen, men de fleste af dem kræver et abonnement, så vi forstår, hvis du skal forblive på et budget.
Nogle apps, der fungerer godt til billedkomprimering, omfatter:
Test disse apps med deres gratis prøveversioner for at forstå, hvor godt de komprimerer billeder, og hvor automatiseret processen er for dig. Derefter kan du binde dig til et abonnement. Til tredjepartsværktøjer anbefaler vi TinyPNG og Image Resizer.
Trin 6: Overvej gratis Image Finder-apps
Selvom det stærkt anbefales, at e-handelsmærker tager deres egne billeder (i stedet for at finde gratis alternativer eller tage dem fra en producents hjemmeside), er der nogle områder i en onlinebutik, der er egnede til brug med gratis billeder.
For eksempel kan du have brug for et naturskønt billede af en person, der kigger ud over en kløft, for at komplementere et blogindlæg. På den anden side vil du måske bruge et foto som baggrund til et heltebillede, så du kan slippe selve produktbilledet og beskrivelsen oven på baggrunden.
I disse situationer foreslår vi, at du bruger nogle af disse Creative Commons-licenserede billedwebsteder:
Det er vigtigt at påpege, at en Creative Commons-licens ikke betyder, at du bare kan tage billedet gratis og lægge det på din hjemmeside. Nogle gange er det tilfældet, men du skal tjekke hvert billede for at sikre, hvilke rettigheder du har til dets brug.
For eksempel fortæller Creative Commons-licenser dig:
- Hvis du kan bruge billedet til kommercielle eller ikke-kommercielle formål
- Når du skal kreditere skaberen, eller hvis det blot anbefales, at du gør det
- Hvis du har lov til at ændre billedet på nogen måde
Derudover er der masser af gratis billedredigeringsapps til at tage kontrol over størrelsesændring, filtre og beskæring uden at betale en skilling:
Vi foreslår:
Trin 7: Kør A/B-testning for at finde ud af de bedste billeder og Formats
Efter at have givet dine billeder relevante filnavne, ændret størrelse på dem, beskåret dem og besluttet det perfekte format og størrelse, er det tid til at se, hvordan de ser ud i din butik.
Heldigvis skal du ikke krydse fingre og håbe på, at billederne er de bedste til konverteringer. Du har mulighed for at uploade flere varianter af de samme billeder på produktsider, landingssider og hjemmesider og derefter se, hvilke af dem der klarer sig bedst med hensyn til konverteringer.
Både Tema videnskabsmand og Shogun tilbyder A/B-testfunktioner til flere dele af din Shopify design.
Det gode ved A/B-test er, at eksperimentet aldrig er slut. Det giver dig mulighed for at holde øje med alle aspekter af din hjemmeside. Du kan udskifte billeder, der mister momentum over tid, og køre flere test i løbet af en periode.
Shopify Billedstørrelsesguide: Vores konklusion
At holde sig til firkantede billeder er en måde at sikre, at din e-handelsfotografering forbliver ubeskåret. Du kan dog opleve, at denne regel ikke altid er sand, når det kommer til din Shopify tema.
Derfor anbefaler vi, at du uploader flere billedstørrelser til produkter, kollektioner og bannere for at forstå, hvad dit tema kan klare bedst. Ellers kan vi godt lide standarden på 2046 × 2046 pixels. Men for bannere og logoer og diasshows, vil du gerne bruge de mere specifikke dimensioner nævnt ovenfor i denne artikel.
Fortæl os venligst i kommentarerne nedenfor, hvis du har brug for nogen afklaring vedr Shopify billedstørrelser!
Kommentarer 0 Responses