Produktbilder hj?lper till att f?rsegla aff?ren n?r kunder bes?ker din webbplats. F?r att beh?lla deras intresse m?ste du ha snygga bilder som laddas snabbt. Du m?ste med andra ord optimera dina produktbilder.
Du kanske undrar hur man hittar den optimala bildstorleken, hur man komprimerar bilder och hur man optimerar bilder utan att f?rlora kvalitet.
Vi har dig t?ckt. I den h?r artikeln kommer vi in ??p?
Varf?r beh?ver du optimera bilder?
Bilder ?r en viktig del av varje webbplats. Detta g?ller s?rskilt f?r en e-handelssida. Bilder p?verkar kunder n?r de funderar p? att k?pa n?got. De l?gger till webbsidans ?vergripande design, hj?lper kunder att v?lja en produkt och f?rb?ttrar din webbplats SEO.
Du vill till exempel undvika att ladda upp stora filer. De kan sakta ner din sida, vilket p?verkar din s?kmotorrankning och driver bort potentiella kunder. Ingen vill v?nta p? att en sida ska laddas n?r han handlar online. Det ?r d?rf?r du m?ste optimera dina produktbilder.
F?rst? bildens dimensioner och proportioner
L?t oss ta reda p? vad du beh?ver vara uppm?rksam p? n?r du optimerar dina bilder.
En bilds storlek och dimensioner ?r verkligen viktiga. Dessa parametrar p?verkar filstorleken och bildens utseende p? olika enheter.
Storlek
Nu ?r eran av
Men n?r bilderna ?r f?r stora ?r de inte l?mpliga f?r Internet. De saktar ner laddningshastigheten, s?rskilt p? en telefon. Om du inte vill att dina bes?kare ska bli ot?liga och l?mna din butik b?r du minska storleken p? dina bilder.
En bild har tv? storlekar:
- Bildstorlek ?r det utrymme som en grafik tar upp p? sk?rmen. Denna storlek m?ts i pixlar (px), som ?r de individuella punkterna som bildar sk?rmen. Du kan ladda upp bilder i valfri storlek i 51视频-butiken. De optimeras sedan f?r att passa bredden p? webbl?sarf?nstret. Trots det ?r det b?st att minska dina produktbilder till cirka 1000 x 1000 px. Den storleken ?r tillr?ckligt stor f?r att visa produkten och tillr?ckligt liten f?r att laddas snabbt.
- Filstorlek ?r det minnesutrymme som bilden tar upp. Denna storlek m?ts i byte, typiskt
Kilo- (Kb),mega- (Mb) och Gigabyte (Gb). Ju st?rre filstorlek bilden har, desto mer lagringsutrymme kr?ver den.
Denna produktbilds storlek ?r 1920×1920 och dess filstorlek ?r 272 kB
St?rre filer tar l?ngre tid att ladda. Programvara f?r filkomprimering utvecklades f?r att bek?mpa detta problem. En bild komprimeras vanligtvis genom att optimera f?rgdata.
Men stark komprimering f?rs?mrar "kvaliteten" p? bilder. Det orsakar brus eller en abrupt f?rg?verg?ng.
F?r en filstorlek p? cirka 1000 px kommer en bra komprimering att ta upp cirka 200 kB.
L?t oss nu l?ra oss mer om hur du v?ljer r?tt proportioner f?r dina bilder.
proportioner
Proportionerna f?r en bild indikerar
Vissa f?rh?llanden ?r mer tilltalande f?r ?gat ?n andra. Standardupps?ttningen av proportioner ser alltid bra ut. Dessa ?r 1:1, 4:3, 3:2 och 16:9.
Proportionerna ?r viktiga eftersom de hj?lper till att definiera utseendet p? din webbplats. Str?va efter samma proportioner f?r alla dina produktbilder f?r att ge ditt skyltf?nster ett strukturerat och professionellt utseende.
Hur man v?ljer bildformat
En annan sak att t?nka p? f?r optimal bildbehandling ?r bildformat. Det ?r den typ av fil som en bild sparas i.
Det finns m?nga typer av bildformat. Var och en har sina f?rdelar och nackdelar n?r det g?ller kvalitet, komprimering och support. Du b?r v?lja det format som ger den h?gsta kvaliteten med den minsta storleken.
De tre vanligaste formaten p? webben ?r JPEG, PNG och GIF. Var och en b?r anv?ndas p? ett specifikt s?tt.
L?t oss dela upp formaten:
- GIF (Graphics Interchange Format) kan lagra komprimerad data utan kvalitetsf?rlust med h?gst 256 f?rger. Formatet st?der vanligtvis animationer. L?nge var GIF det vanligaste formatet p? Internet... tills PNG kom.
- PNG (Portable Network Graphics) anv?nder f?rlustfri komprimering och lagrar ett obegr?nsat antal f?rger.
- JPEG (Joint Photographic Experts Group, namnet p? utvecklaren) ?r det mest typiska formatet f?r att lagra foton och andra bilder. JPEG-algoritmen kan anv?nda b?de f?rlustfri och f?rlustfri komprimering (mer om det senare.) Ju st?rre filstorlek, desto mindre f?rlust.
Vilket format ska du v?lja? Om du har en animerad bild, det ?r
JPEG- och PNG-filer ?r lika, men de har ocks? avg?rande skillnader. JPEG-filer ?r mindre i storlek eftersom de anv?nder en komprimeringsprocess som tar bort vissa data. PNG, ? andra sidan, st?der transparenta bakgrunder och ?r b?ttre f?r grafisk design.
Den allm?nna regeln ?r att anv?nda JPG f?r fotografier och bilder som inte har en genomskinlig bakgrund. N?r det g?ller PNG ?r det b?ttre att anv?nda dem f?r grafik, filer med genomskinlig bakgrund och andra bilder d?r klarhet och f?rgstarkhet ?r viktigt. S? f?r produktbilder ?r det vettigt att f?redra JPEG framf?r PNG.
Denna produktbild ?r i JPEG-format
Hur man komprimerar bilder utan att f?rlora kvalitet
Komprimering hj?lper till att minska storleken p? en bild. Ju l?gre kvalitet, desto h?gre komprimering och desto mindre filstorlek.
Det finns tv? typer av komprimering:
- F?rlorad kompression minskar storleken p? en fil genom att ta bort ?verfl?diga data. Men n?r du komprimerar en fil p? detta s?tt kan det f?rs?mra bildkvaliteten avsev?rt.
- Lossless kompression ?r en teknik som h?ller kvaliteten p? en fil h?g. Det kommer dock inte att minska filstorleken s? mycket som komprimering med f?rlust. Om du beh?ver minska filstorleken utan att m?rkbart p?verka kvaliteten ?r det b?ttre att v?lja f?rlustfri komprimering.
L?s vidare f?r att l?ra dig om onlineverktyg som du kan anv?nda f?r att komprimera en bild utan kvalitetsf?rlust.
Hur man optimerar bilder f?r webben: Verktygs?versikt
Vill du ta reda p? hur man optimerar bilder f?r en webbplats? Tur f?r dig, du anv?nder onlineverktyg f?r att optimera dina bilder automatiskt utan att spendera timmar p? att titta p? Photoshop-tutorials.
F?ljande webbplatser kan automatisera optimering ?t dig:
Hur man optimerar bildstorlek: 4 enkla verktyg
Om du letar efter en filstorleksreducering, kolla in n?gon av f?ljande tj?nster. De ?r antingen gratis eller har gratis provperioder:
- : det minskar filstorleken p? JPEG-bilder. Enligt deras sida kan den minska den med mer ?n 70%!
- : samma bildkompressor men f?r PNG-filer.
- : en webbapp f?r bildkomprimering som minskar bildstorleken genom m?nga format.
- : en fotokompressor f?r JPEG-filer. Den har mer avancerade funktioner som ?r anv?ndbara f?r fotografer, inklusive att exportera bilder direkt fr?n Lightroom och Photoshop.
- : en bildoptimerare f?r Mac-enheter. Du m?ste ladda ner den f?r att kunna anv?nda den.
Optimera bilder med JPEGmini
Om du driver en 51视频-butik kan du anv?nda SEO-hastighet och bildoptimerare app fr?n 51视频 App Market. Appen till?ter
Hur man optimerar bilder f?r WordPress
Om du har en WordPress-webbplats kan du anv?nda en bildoptimerare och komprimeringsplugins. De hj?lper dig att automatiskt optimera bilder p? WordPress-webbplatser, vilket m?jligg?r b?ttre hastighet och prestanda.
F?rresten, om du letar efter ett e-handelsplugin f?r din WordPress-webbplats, kolla in det h?r . Det l?ter dig enkelt l?gga till en onlinebutik p? din WordPress-webbplats. N?r det har installerats skapar pluginet automatiskt en butikssida d?r dina kunder kan handla p? din webbplats.
EWWW Image Optimizer
?r en av de b?sta WordPress-plugins f?r att komprimera bilder och optimera bilder p? din webbplats. Hela processen med att optimera bilder ?r automatiserad. Detta inkluderar komprimering av bilder och skalning f?r att passa sidan och enheten i r?tt storlek. Plugin ?r
Komprimera JPEG & PNG
?r ett plugin skapat av teamet bakom de tj?nster vi redan har
reSmush.it
?r ett gratis plugin f?r WordPress-bildkomprimering f?r filer upp till 5MB. Du kan automatiskt optimera bilder vid uppladdning, massoptimera ?ldre bilder och utesluta vissa bilder fr?n optimeraren.
Fler automatiska bildoptimeringsverktyg
Men vad h?nder om du inte har en WordPress-webbplats? Att manuellt optimera ett stort antal bilder ?r definitivt
ImageRecycle
st?der olika bildformat, s?som JPEG, PNG, GIF och till och med PDF-filer.
Verktyget kan avg?ra vilka bilder p? din webbplats som beh?ver optimeras utifr?n bildstorlek och dimension. Ange bara din webbadress s? skickar ImageRecycle dig en kostnadsfri rapport via e-post. De har ocks? en gratis provperiod s? att du kan se deras optimeringsverktyg i aktion.
ImageKit.io
?r inte en vanlig bildkompressor utan ett bild-CDN (content delivery network). Den optimerar, ?ndrar storlek och skickar bilder genom sitt globala n?tverk av servrar. Du kan registrera dig f?r en f?r evigt gratis plan.
Verktyg f?r redigering av produktbilder
Om du inte har n?got emot att redigera bilder sj?lv och inte ?r r?dd f?r lite g?r-det-sj?lv, kan du hitta verktyg f?r fotoredigering till hj?lp. H?r ?r n?gra av dem:
Photoshop
Photoshop erbjuder en gratis f?r grundl?ggande bildmanipulering (som att besk?ra eller ?ndra storlek p? bilder). Det l?ter dig ocks? ta bort bakgrund fr?n bilder och finjustera dina foton med olika inst?llningar som kontrast, ljusstyrka, m?ttnad, v?rme eller sk?rpa.
Online Photoshop Editor har designmallar som du kan anv?nda
GIMP
?r ett gratisprogram l?mpligt f?r Windows, Mac och Linux. Den erbjuder allt du beh?ver f?r professionell grafik och fotografier, inklusive verktyg f?r lager och masker, f?rgkorrigering, retuschering och m?lning. GIMP st?der alla st?rre bildfilformat.
PicMonkey
?r en onlineredigerare med ett enkelt gr?nssnitt och alla grundl?ggande funktioner, som att besk?ra, rotera, kontrollera sk?rpan, arbeta med f?rg och v?lja foton med uppl?sning. Den tillhandah?ller mallar f?r att skapa bilder f?r annonser, sociala inl?gg, logotyper, infografik och mer. Den har en
Pixlr
erbjuder en gratis onlineredigerare och designresurser f?r nyb?rjare och proffs. Den har verktyg f?r f?rg, ritning och fotoredigering. Med Pixlr arbetar du med lager och anv?nder olika effekter och filter. Om du ?r intresserad kan du
Mer om bildoptimering
Stora bilder kan sakta ner din webbplats, s? det ?r viktigt att optimera dem f?r webben. Att hitta r?tt bildformat f?r dina bilder genom att ?ndra storlek och komprimera kan g?ra underverk f?r hastigheten p? din webbplats.
Och nu vet du de goda nyheterna: optimering ?r superl?tt att g?ra! Du kan ocks? komma tillbaka och referera till den h?r artikeln n?r du beh?ver.
Om du ?r en mer avancerad anv?ndare och ivrig efter att l?ra dig mer om hur du optimerar bilder f?r SEO rekommenderar vi att du tittar p? den h?r videon fr?n Google. Den g?r igenom n?gra avancerade tips om hur du optimerar dina bilder f?r en webbplats. Se den h?r:
Oavsett hur erfaren du ?r som e-handels?gare, gl?m aldrig bildoptimering. ?ven de enklaste verktygen kan g?ra dina bilder l?mpliga f?r webben. Genom att optimera dina bilder kan du drastiskt p?verka dina kunders k?pupplevelse. Se till att dina produktbilder ?r b?de vackra och snabba att ladda!
Om du bara ?r i b?rjan av din e-handelsresa och beh?ver skapa en onlinebutik, kolla in 51视频 fr?n Lightspeed. Det l?ter dig skapa en onlinebutik sj?lv, inga kodnings- eller designkunskaper beh?vs. Perfekt om du beh?ver b?rja s?lja online s? snart som m?jligt!
