E-poes ei saa klient toodet katsuda, kaaluda ega tagant vaadata.
Ta saab vaadata sinu pilte. Kui neid on üks ja see on tarnija kataloogist, teeb ta otsuse selle põhjal — või ei tee üldse.
Samal ajal on pildid tavaliselt 60–80% e-poe lehe kaalust. Iga lisatud pilt on ka natuke aeglasem leht.
Head tootepildid lahendavad mõlemad pooled korraga.
Mitu pilti ühel tootel
| Toote tüüp | Piltide arv |
|---|---|
| Lihtne ja tuttav (raamat, tarvik) | 1–2 |
| Tavaline tarbekaup | 3–5 |
| Riided ja jalanõud | 4–6, sh mudelil |
| Mööbel ja kodutehnika | 5–8, sh mõõdud |
| Kallis või tehniline toode | 6–10 |
Rusikareegel: iga küsimus, mis kliendil tekib, väärib pilti.
Milline on tagakülg? Kui suur see päriselt on? Mis on karbis? Kuidas materjal lähedalt välja näeb?
Milliseid pilte päriselt vaja on
Põhipilt. Toode tervikuna, ühtlasel valgel või helehallil taustal. See on pilt, mis läheb kategooriasse ja otsingutulemustesse.
Mastaabipilt. Toode kasutuses või millegi tuttava kõrval. Lahendab "kui suur see on" küsimuse, mida mõõdud üksi ei lahenda.
Detailipildid. Materjal, õmblused, ühendused, viimistlus.
Mis on karbis. Eriti oluline elektroonika ja tööriistade puhul, kus küsitakse pidevalt "kas aku on kaasas".
Mõõdujoonis. Mööbli ja tehnika puhul kohustuslik.
Ühtsus loeb rohkem kui kvaliteet
Kolmkümmend head pilti, mis on kõik erineva tausta, valguse ja nurgaga, näevad kategoorias välja halvemini kui kolmkümmend keskpärast ühtset pilti.
Seadista endale reeglid ja järgi neid:
- Sama taust kõigil põhipiltidel
- Sama nurk samasse kategooriasse kuuluvatel toodetel
- Sama proportsioon — toode täidab pildist umbes sama osa
- Sama kuvasuhe — ruut on e-poes kõige praktilisem
Ruudukujuline pilt on soovitus, mida tasub tõsiselt võtta. Segatud proportsioonid teevad kategoorialehe visuaalselt räpaseks ja põhjustavad ka paigutuse nihkumist laadimisel, mis on Core Web Vitals'i mõõdik.
Tehniline pool: vorming ja suurus
Siin tehakse kõige rohkem vigu ja siin on kõige lihtsam võita.
Vorming. Kasuta WebP-d. Ta on tüüpiliselt 25–35% väiksem kui sama kvaliteediga JPG ja kõik kaasaegsed brauserid toetavad teda. AVIF on veel väiksem, aga tugi on ebaühtlasem.
Suurus. Kolm mõõtu piisab enamikule poodidele:
| Kasutus | Laius |
|---|---|
| Kategooria pisipilt | 400 px |
| Tooteleht | 1000–1200 px |
| Suurendus | 2000 px |
Failimaht. Tooteleht alla 200 kB pildi kohta, pisipilt alla 40 kB. Kui üks pilt on 3 MB, on midagi valesti.
Ära lae üles 5000-pikslist pilti ja lase brauseril seda vähendada. Brauser laadib alla terve faili ja alles siis kahandab. Kasutaja maksab mobiilse andmesidega kogu 5000 piksli eest.
Kuidas hoida pood kiirena
Laisk laadimine. Kategoorialehel on 40 pilti. Ekraanil on korraga näha 6. Ülejäänud peaksid laadima alles siis, kui nendeni keritakse.
Erand: esimene pilt lehe ülaosas ei tohi olla laisalt laetud. See on tavaliselt LCP element ja laisk laadimine muudab selle aeglasemaks.
Mõõdud koodis kirjas. Iga pilt peab omama width ja height atribuuti. Ilma nendeta ei tea brauser, kui palju ruumi jätta, ja sisu hüppab laadimisel — see on CLS.
Vastuvõtlikud pildid. srcset laseb brauseril valida seadmele sobiva suuruse. Telefon ei pea laadima arvutivaate pilti.
Mida need mõõdikud päriselt tähendavad, on lahti kirjutatud artiklis kodulehe kiirus ja Core Web Vitals.
Alt-tekstid
Alt-tekst on kirjeldus, mida näeb ekraanilugeja kasutaja ja mida loeb Google.
Halb: alt="IMG_4472" Halb: alt="trell puurtrell akutrell tööriist odav" Hea: alt="Makita 18V juhtmeta puurtrell koos kahe aku ja kohvriga"
Kirjelda, mis pildil on. Kui pilt on puhtalt kaunistav, jäta alt tühjaks — see on ekraanilugejale õigem kui väljamõeldud tekst.
Failinimi loeb ka. makita-tx4400-juhtmeta-trell.webp on parem kui IMG_4472.jpg. See on üks väheseid kohti, kus Google pildi sisu kohta vihje saab.
Kui tooteid on sadu
Käsitsi ei jõua. Vaja on protsessi.
Automatiseeri konverteerimine. WordPressis teevad seda pistikprogrammid, mis genereerivad WebP variandid üleslaadimisel. Seadista see kord ja unusta ära.
Tee pildistamine ühtseks. Sama koht, sama valgus, sama seadistus. Sada toodet ühe päevaga on realistlik, kui midagi vahepeal ei muutu.
Prioriseeri. Kui vana pildipank on korrastamata, alusta toodetest, mis toovad kõige rohkem müüki. Sada tähtsaimat toodet annab peaaegu kogu tulemuse.
Kust pildid ei tohiks tulla
Tarnija kataloog ainsa allikana. Sama pilt on kolmekümnel poel. Sa ei eristu millegagi ja Google'il ei ole põhjust just sind eelistada. Sellest räägib ka e-poe SEO: kategooria- ja tootelehed.
Google'i pildiotsingust. Autoriõiguse rikkumine, mille eest tuleb päris arveid.
Telefonist ilma valguseta. Telefoni kaamera on tänapäeval hea. Halb valgus ei ole. Aken ja valge kartong peegeldajana lahendavad enamiku sellest.
Mida mõõta
- Lehe kaal — tooteleht alla 1,5 MB kokku
- LCP — alla 2,5 sekundi mobiilis
- CLS — alla 0,1, ehk pildid ei nihuta sisu
- Konversioon enne ja pärast piltide uuendamist tähtsaimatel toodetel
See viimane on kõige veenvam. Vali kakskümmend toodet, tee uued pildid, võrdle kuu andmeid. Mõju on tavaliselt selgelt näha — vaata konversioonide mõõtmine GA4-s.
Kas ma pean pildid ise tegema?
Ei pea, aga oma pildid on peaaegu alati parem investeering kui tarnija omad. Kui tooteid on palju, tasub üks päev fotograafiga rohkem kui pool aastat optimeerimist.
Kas WebP töötab kõigis brauserites?
Jah, kõigis kaasaegsetes. Väga vanade brauserite jaoks saab jätta JPG varuvariandi, aga praktikas ei ole see enam vajalik.
Kui suur peaks tootepilt olema?
Tootelehel 1000–1200 pikslit lai, alla 200 kB. Suurendusel kuni 2000 pikslit. Suurem ei anna nähtavat kasu, aga maksab kiiruses.
Kas video asendab pilte?
Ei asenda, täiendab. Video ei tule kategoorialehele ega otsingutulemustesse. Tee kõigepealt pildid korda, siis mõtle videole.
Pood on aeglane ja pildid on segased?
Vaatame üle piltide vormingud, suurused ja laadimise ning ütleme, kui palju kiirust on kohe võita.
Vaata e-poe arendust.
Küsi ülevaatust