Verkkokaupassa tuotteiden kuvat tulevat suoraan ERP:stä, joten tuotekuvien koko ja kuvasuhde kannattaa miettiä jo tuotekuvia tehtäessä.
Tässä artikkelissa käymme läpi minkä kokoisia kuvia kannattaa käyttää verkkokaupan sisällössä. Kuvat elävöittävät verkkokauppaa, luovat tunnelmaa ja vahvistavat brändiviestiäsi. Jokainen kuva tuo kuitenkin sivuillesi lisää sisältöä. joka vaikuttaa suoraan siihen, kuinka nopeasti verkkokauppa latautuu. Mitä suurempia kuvia, sitä kauemmin sivun latautuminen kestää.
Graafikkomme huomioivat tämän aina verkkokaupan suunnittelu vaiheessa, oli sitten kyse uuden verkkokaupan avaamisesta tai verkkokaupan tuoreutuksesta. Jos teet sisältöä tai mainosbannereita itse, ota huomioon seuraavat seikat.
Tiedoston koko vs. kuvan koko
Tiedoston koko mitataan kilotavuina, Kt tai megatavuina, Mt (Englanniksi Kilobyte, Kb ja Megabyte Mb).
Hyvänä muistisääntönä voi pitää, että verkkokauppaan ladattava kuva ei saa olla yli 500 Kt.
Kuvankäsittelyohjelmalla voit kompressoida kuvia niin, että laatu pysyy hyvänä vaikka tiedostokoko pienenee.
Kuvan koko mitataan pikseleinä, px ja verkkokaupan mainospaikkoihin om jokaiseen omat suosituskoot.
Sisällössä käytettävien kuvien koko voi vaihdella pienestä some-ikonista, osasto- tai tuoteryhmä kuvaan.
Kuvien kokoa suunniteltaessa on jo hyvä huomioida kuinka moneen kolumiin ja riviin sisältö aiotaan jakaa.
Mainosbannerien kuvakoot löydät tästä ohjeesta.
Esimerkkejä erikokoisista kuvista:
Miten tarkistan kuvakoon?
Jos tiedosto on tallennettu koneelle:
Tarkempaa tietoa kuvasta saat klikkaamalla hiiren oikealla kuvaa ja valisemalla Ominaisuudet.
Tiedostoformaatti ja kuvan nimeäminen
Mitä tiedostoformaattia voin käyttää verkkokaupan sisällössä?
Yleisohjeena voi käyttää JPG ja PNG -tiedostoja. Jos kuvassa pitää olla läpinäkyvä tausta, tällöin kuvan pitää olla PNG-muodossa. Yleisesti PNG on suurempi kokoinen kuin JPG ja JPG on varsin hyvä kuvaformaatti verkkokaupan sisältöön käytettäväksi.
Jos käytät sisällössä graafisia ikoneita, nämä ovat yleensä PNG-muodossa.
Verkkokaupan logot graafikomme tekevät vektorimuodossa.
Myös GIF-tiedostoja voi käyttää sisällössä ja mainosbannereissa, mutta niiden kanssa kannattaa olla tarkkana, eikä niitä kannata käyttää yltäkylläisesti.
Muista nimetä kuva
Jos kuvasi nimi on esim. image2.jpg, tällöin hakukoneet eivät pysty tulkitsemaan kuvaa.
Optimoinnin kannalta on siis tärkeää, että nimeät kuvat tuoteryhmän tms. mukaan. Älä kuitenkaan käytä ääkkösiä tai erikoismerkkejä.
Lisää vaihtoehtoinen teksti eli alt-teksti
Hakukoneet ymmärtävät myös kuvaan liitetyn alt-tekstin ja tilanteessa, jossa kuva ei jostain syystä lataudu, näkyy ruudulla alt-teksti. Se kannattaa siis kirjoittaa niin, että tekstistä käy ilmi sama asia kuin kuvasta.
Alt-tekstin ei tarvitse vastata kysymykseen ”mitä kuvassa on?” vaan ”mitä kuvasta pitäisi ymmärtää?”
Julkisen puolen toimijoita koskee lisäksi saavutettavuusdirektiivi, joka astui voimaan 2019.