• UI & UX

Tuotesivun suunnittelustrategiat, jotka lisäävät konversioita

  • Felix Rose-Collins
  • 7 min read
Tuotesivun suunnittelustrategiat, jotka lisäävät konversioita

Intro

Mikä on verkkosivustosi tärkein sivu?

Ei, se ei ole etusivu, vaikka etusivulla onkin keskeinen rooli ensivaikutelman luomisessa. Tässä tapauksessa voittaja on altavastaaja - tuotesivusi.

Se on täysin loogista, jos sitä ajattelee. Suuri osa sähköpostin, hakukoneoptimoinnin, sosiaalisen median ja maksetun mainonnan ponnisteluistasi tähtää siihen, että liikenne ei suuntautuisi kotisivuillesi vaan tietyille tuotesivuille. Siellä varsinainen päätöksenteko ja ostaminen tapahtuvat.

Kuitenkin keskimäärin vain 2,5-3 prosenttia verkkokaupan verkkosivukäynneistä johtaa onnistuneisiin konversioihin. Syyllinen näin alittavaan konversioasteeseen on yleensä tuotesivujen huono suunnittelu ja optimointi.

Tässä postauksessa keskustellaan siitä, mikä tekee hyvin suunnitellusta tuotesivusta hyvän ja miksi kukin strategia toimii. Kerromme myös, miten kukin strategia toteutetaan, joten lue lisää ja vie tuotesivusi suunnittelu seuraavalle tasolle.

Tee räätälöintiprosessista helppo ja intuitiivinen

Henkilökohtaistamisessa loistavat tuotemerkit tuottavat 40 prosenttia enemmän tuloja kuin jäljessä olevat. Sama tutkimus on osoittanut, että 71 prosenttia asiakkaista odottaa yrityksiltä henkilökohtaista vuorovaikutusta.

Näiden tilastojen perusteella voidaan päätellä, että räätälöityjen kokemusten tarjoaminen ja asiakkaiden tarpeiden huomioon ottaminen ei ole vapaaehtoista. Räätälöinnistä on tullut jokaisen onnistuneen tuotesivun välttämätön osa.

Tapaa Ranktracker

All-in-One-alusta tehokkaaseen hakukoneoptimointiin

Jokaisen menestyvän yrityksen takana on vahva SEO-kampanja. Mutta kun tarjolla on lukemattomia optimointityökaluja ja -tekniikoita, voi olla vaikea tietää, mistä aloittaa. No, älä pelkää enää, sillä minulla on juuri oikea apu. Esittelen Ranktracker all-in-one -alustan tehokasta SEO:ta varten.

Olemme vihdoin avanneet Ranktrackerin rekisteröinnin täysin ilmaiseksi!

Luo ilmainen tili

Tai Kirjaudu sisään omilla tunnuksillasi

Vaikka räätälöinti on helpompaa verkossa, sinun on oltava varovainen, ettet hukuta potentiaalisia asiakkaitasi. Valinnanvaikeus on todellinen asia, ja se tapahtuu, kun ihmisille esitetään useita eri vaihtoehtoja.

Hickin lain mukaan mitä enemmän vaihtoehtoja henkilöllä on, sitä kauemmin häneltä kestää tehdä päätös. Tämä viive voi johtaa siihen, että potentiaaliset asiakkaasi luopuvat ostosta ja haittaavat siten myyntiäsi.

Miten voit vähentää tätä valinnanhalvausta?

Tässä muutamia vinkkejä:

  • Rajoita vaihtoehtojen määrää tai korosta ainakin muutama selkein vaihtoehto. Voit aina lisätä "Lisää"-painikkeen, joka näyttää muita, vähemmän suosittuja vaihtoehtoja.
  • Yksinkertaista personointiprosessia ja helpota mahdollisuuksiesi mukauttamista haluamaansa tuotteeseen.
  • Tarjoa oletusarvoisia, ennalta määritettyjä vaihtoehtoja, jotka perustuvat suosituimpiin valintoihin ja bestselleriin. Tämä vähentää joidenkin asiakkaiden päätöksentekoväsymystä.

Kyse on siitä, että koko prosessista tehdään mahdollisimman käyttäjäystävällinen ja että asiakkaat saavat vaikuttaa siihen, miltä lopputuote näyttää.

Nike antaa asiakkailleen hienosti luovaa valtaa ostaa haluamansa lenkkarimallin. Tuotemerkin tuotteiden räätälöintityökalu on intuitiivinen ja siinä luetellaan selkeästi kaikki tuotteen osat, joita voidaan muokata. Lisäksi asiakkaat voivat napsauttaa lenkkarin osaa, jota he haluaisivat muuttaa, ja nähdä saatavilla olevat värit tai materiaalit.

Nike Air Force 1 (Lähde: Nike)

Monipuolistaa tuotegalleriaasi

Yksi verkko-ostosten suurimmista esteistä on se, että asiakkaat eivät voi koskettaa, tuntea, kokeilla ja kokea tuotteita. Nämä tekijät voivat vahingoittaa myyntiäsi myös ostoksen jälkeen, sillä ne ovat syynä siihen, että 10-15 prosenttia verkosta ostetuista tuotteista palautetaan. Tietyillä aloilla, kuten muotialalla, tämä luku on vielä korkeampi, jopa 50 prosenttia.

Tapaa Ranktracker

All-in-One-alusta tehokkaaseen hakukoneoptimointiin

Jokaisen menestyvän yrityksen takana on vahva SEO-kampanja. Mutta kun tarjolla on lukemattomia optimointityökaluja ja -tekniikoita, voi olla vaikea tietää, mistä aloittaa. No, älä pelkää enää, sillä minulla on juuri oikea apu. Esittelen Ranktracker all-in-one -alustan tehokasta SEO:ta varten.

Olemme vihdoin avanneet Ranktrackerin rekisteröinnin täysin ilmaiseksi!

Luo ilmainen tili

Tai Kirjaudu sisään omilla tunnuksillasi

Vaikka kaikkien aistien käyttäminen on edelleen kivijalkamyymälöiden etuoikeus, voit käyttää seuraavaksi parasta asiaa - monipuolista tuotegalleriaa.

1. Tarjoa niin monta kuvaa kuin on tarpeen

Esittele tuotteesi eri kuvakulmista ja lähikuvista, jotta asiakkaasi voivat hahmottaa sen. Käytä vain korkealaatuisia kuvia, mutta varmista, että ne on optimoitu, jotta ne eivät hidasta verkkosivustosi toimintaa.

Rakeiset tai pikselöityneet kuvat vain haittaavat konversiolukuja, sillä ne eivät näytä tuotteitasi kunnolla, eivätkä näin ollen tuo lisäarvoa. Tällainen virhe vaikuttaa kielteisesti asiakkaiden käsitykseen tuotteistasi ja vahingoittaa mainettasi. Muista, että visuaalinen miellyttävyys ratkaisee luottamuksen ja uskottavuuden, eli sivustosi kävijät eivät halua antaa sinulle luottokorttinsa numeroa, jos tuotesivusi vaikuttavat hämäriltä.

2. Tarjoa 360 asteen tuotenäkymä

360 asteen näkymätoiminnallisuus korvaa fyysisessä myymälässä käynnin, sillä sen avulla asiakkaat voivat siirtää tuotetta ja nähdä sen eri näkökulmista.

Lisäksi tämän UX-elementin avulla voit ladata vähemmän kuvia käyttökokemuksen kärsimättä.

3. Ota käyttöön zoomaustoiminto

Kun asiakkaat selaavat tuotteita fyysisessä myymälässä, he haluavat aina katsoa tarkkaan ja tarkastella yksityiskohtia.

Zoomaustoiminto jäljittelee tätä ja antaa sivustosi kävijöille mahdollisuuden saada paremman visuaalisen käsityksen tuotteesta ja nähdä sen rakenteen. Kun he voivat tutustua tuotteeseen näin yksityiskohtaisesti, potentiaaliset asiakkaat ovat varmempia ostoksen tekemisestä.

4. Näytä tuotteesi käytössä

Muodosta jokaiselle tuotteelle asiayhteys näyttämällä potentiaalisille asiakkaille, miten muut käyttävät sitä.

Näin he saavat käsityksen siitä, miltä tuote näyttää todellisuudessa ja miten sitä tulisi käyttää. Esimerkiksi vaatekappaleen näyttäminen mallin päällä on helpompaa ja kiinnostavampaa kuin sen sijoittaminen tasaiselle pinnalle.

Kontekstikuvat antavat asiakkaille paremman käsityksen vaatteen istuvuudesta.

On hyvä ajatus ottaa mukaan erikokoisia ja etnisiä malleja, jotta saat tunnetason yhteyden kaikkiin yleisösi segmentteihin.

5. Hyödynnä videota

88 prosenttia ihmisistä sanoo, että tuotevideon katsominen sai heidät tekemään ostoksen.

Tämän muodon kyky tiivistää paljon tietoa lyhyessä ajassa on erityisen tehokas. Olemme jo maininneet lyhyen keskittymiskyvyn ongelman, ja sen sijaan, että pakottaisit potentiaaliset asiakkaasi lukemaan tuotteen ominaisuuksista ja eduista, on paljon tehokkaampaa näyttää kaikki tämä lyhyellä videolla.

6. Näytä tuotteen koko todellisessa elämässä

Koolla on väliä, kun teet ostoksia verkossa.

Jos et halua johtaa potentiaalisia asiakkaitasi harhaan, varmista, että he voivat hahmottaa, kuinka suuri tai pieni tietty tuote on. Luettele kaikki tuotteen ja pakkauksen mitat ja lisää kokotaulukko vaatteita ja kenkiä varten.

Jos tuotteen koko voi edes pienellä todennäköisyydellä olla harhaanjohtava, näytä mittakaava sijoittamalla se sellaisten esineiden viereen, joita voidaan käyttää vertailukohtina.

Somnifix on hyvä esimerkki tuotegallerian monipuolistamisesta. Tuotemerkin tuotesivu on täynnä hyödyllisiä kuvia, kuvituksia ja muita visuaalisia elementtejä, joissa esitellään, miten tuotetta käytetään, kuka sitä voi käyttää ja mitkä ovat sen tärkeimmät hyödyt.

Show the Product Size in Real Life (Lähde: Somnifix)

Hyödynnä hintaankkurointia

Markkinointi perustuu vahvasti ihmisen psykologiaan. Hinnoittelu ei poikkea tästä, ja voit käyttää useita strategioita konversiolukujen nostamiseksi.

Asiakkailla ei ole käsitystä siitä, kuinka paljon tietyn tuotteen pitäisi maksaa, ja he muodostavat mielipiteensä siitä, onko hinta hyvä, useiden vertailukohtien perusteella. He esimerkiksi tarkistavat, kuinka paljon samankaltainen tuote maksaa, ja käyttävät sitä mittarina.

Jos tuotteella on suuri kysyntä, ihmiset ovat myös valmiita maksamaan enemmän. Esimerkiksi Hermès on hyödyntänyt tätä vuosikymmeniä luomalla keinotekoista niukkuutta ja yksinoikeuden auraa ikonisen Birkin-laukkunsa ympärille.

Näin ollen tämä arviointimekanismi osoittaa, että asiakkaidenne käsitykset hinnasta ovat seuraavat

  1. Suhteellinen
  2. Altis manipuloinnille

Vuonna 2010 Steve Jobs piti yhden keynote-esityksistään, ja tällä kertaa hän esitteli yrityksen upouuden tuotteen, iPadin. Keskustellessaan tämän näyttävän laitteen hinnoittelusta Jobs vastasi spekulaatioihin, joiden mukaan sen hinta olisi hieman alle 1000 dollaria, joka on alan koodinimi 999 dollarille. Tuossa vaiheessa numero ilmestyi taustalla olevalle suurelle näytölle, mutta murskautui 499 dollarin hintalappuun 60 sekuntia myöhemmin, jonka aikana yleisö sai kuulla lisää laitteen eduista.

Kun hinta sitten "laski", asiakkaat saivat voimakkaan vaikutelman, että he säästäisivät 500 dollaria ja saisivat hämmästyttävän tuotteen vain murto-osalla sen todellisesta arvosta.

Tämä kognitiivinen ennakkoluulo, jota Jobs käytti mestarillisesti hyväkseen, on hintaankkuroinnin ydin. Voit saavuttaa saman vaikutuksen antamalla asiakkaillesi vaikutelman, että tuotteen todellinen hinta on paljon korkeampi. Temppu on siinä, että ilmoitat alkuperäisen hinnan, vedät sen yli ja laitat sen viereen uuden, alhaisemman hinnan. Ja voila! Asiakkaasi luulevat nyt saavansa hyvän kaupan.

Käytä visuaalisesti silmiinpistäviä CTA:ita

Tehokas toimintakutsu voi tehdä ihmeitä konversioasteellesi. Tästä syystä sille on tässä artikkelissa toinen kohta.

Vaikka näiden parin sanan sijoittaminen painikkeen muotoiseen elementtiin ei ehkä tunnu rakettitieteeltä, prosessi vaatii itse asiassa paljon tutkimusta, dataa ja A/B-testausta. Vastustamattoman CTA:n resepti on oikean yhdistelmän keksiminen kopiosta, koosta, väristä ja sijainnista.

Luo toimintasuuntautunutta kopiota

CTA:n tarkoitus on kertoa kävijöille, mitä tehdä seuraavaksi, ja kannustaa heitä ryhtymään toimiin.

Mutta sen sijaan, että sanot "osta", sanamuotosi on oltava vakuuttavampi ja vakuuttavampi. Lauseet, kuten "Lue lisää", "Kyllä, haluan ilmaisen kokeilujakson", "Hanki alennus" tai "Anna minulle yksinoikeudellinen tarjoukseni", herättävät enemmän huomiota ja ovat tehokkaampia.

Going yhdistää tämän periaatteen nokkelaan sanaleikkiin halpojen lentojen tuotesivullaan. Tuotemerkin nimi sopii söpölle sanaleikille, joka herättää huomiota ja motivoi myös toimintaan.

Create Action-Oriented Copy (Lähde: Going)

Valitse oikea koko

Toisaalta haluat, että CTA-kappaleen tekstin on oltava luettavissa, mutta toisaalta et halua jättimäistä painiketta, joka näyttää halvalta ja vastenmieliseltä.

Oikea tasapaino olisi tarpeeksi suuri painike, jotta se erottuu, mutta ei kuitenkaan niin paljon, että se peittää alleen sivun muun sisällön.

Cotton Bureaun tuotesivuilla on näkyvät CTA-kohteet, jotka ovat helppolukuisia, mutta ne eivät kuitenkaan varjosta sivun muita elementtejä tai vaikuta liian myyntihakuisilta.

Pick the Right Size (Lähde: Cotton Bureau)

Käytä vastakkaisia mutta toisiaan täydentäviä värejä

Eri tutkimuksissa on yritetty määrittää tehokkain CTA-väri, mutta värillä on merkitystä lähinnä siksi, että sen pitäisi saada CTA-painike erottumaan taustasta.

Käyttämällä täydentäviä värejä (väriympyrän vastakkaisilla puolilla olevia värejä) luot parhaan kontrastin ja lisäät toimintakutsun näkyvyyttä.

Toinen tapa tehdä CTA-kohdistimesi huomattavaksi ja näkyväksi on hyödyntää negatiivista tilaa.

Kettle & Fire hyödyntää kaikkia näitä parhaita käytäntöjä; heidän CTA-kuvansa on kirkkaan punainen ja hyvin näkyvä valkoista taustaa vasten. Toinen syy, miksi tämä esimerkki toimii, on tilauksen helppo muokattavuus ja läpinäkyvyys.

Asiakkaat voivat valita ostettavien pakkausten määrän ja nähdä tarkalleen, kuinka paljon heiltä veloitetaan. On myös mahdollista valita kertatilauksen tai tilauksen välillä.

Use Contrasting but Complementary Colors (Lähde: Kettle & Fire)

Hyväksy selittäviä videoita

Katsojat sanovat säilyttävänsä lähes 95 prosenttia videon viestistä.

Vaikka tämä luku olisikin mielestäsi hieman liioiteltu, ei voida kiistää, etteikö tämä muoto olisi huomattavasti tehokkaampi markkinointiviestin välittämisessä ja tietyn tuotteen hyötyjen ja käyttötapausten osoittamisessa.

Ei ihme, että 96 prosenttia ihmisistä sanoo katsoneensa selittävän videon saadakseen lisätietoja tuotteesta tai palvelusta, josta on kiinnostunut. Tämä muoto on erityisen hyödyllinen monimutkaisille palvelutuotteille SaaS-maailmassa. Jos tuotteesi on tuntematon tyypilliselle ostajapersoonallesi, panosta yhden tai kahden videon tuottamiseen tuotesivuillesi.

Selostusvideot sopivat erinomaisesti tuotteen käytön havainnollistamiseen, koska ne toimivat paremmin ohjeiden antamiseen. Sen sijaan, että asiakkaasi joutuisivat kohtaamaan seinän tekstiä, jossa kuvataan tiettyä tuotetta, voit tarjota heille lyhyen, mukaansatempaavan videon, joka näyttää, miten tuote toimii, ja välittää viestisi nopeammin.

Lisäksi ihmiset jakavat videoita kaksi kertaa todennäköisemmin verkostossaan kuin mitään muuta muotoa, mikä tarkoittaa, että voit myös laajentaa tavoittavuuttasi ja luoda enemmän liikennettä.

Bay Alarm Medical käyttää selittävää videota näyttääkseen, miten heidän lääketieteellinen hälytysjärjestelmänsä asennetaan, jotta potentiaalisten asiakkaiden ei tarvitse etsiä kirjallisia ohjeita.

Embrace Explainer Videos (Lähde: Bay Alarm Medical)

Yleisten konversioesteiden poistaminen

Verkkokauppa on kätevää, sillä asiakkaat voivat ostaa tuotteen kotonaan. On kuitenkin olemassa joitakin esteitä, jotka voivat haitata konversioita, ja yleisimmät niistä ovat:

Tapahtumien turvallisuus

Asiakkaasi ovat huolissaan siitä, kuinka turvallisia heidän maksunsa ovat. 18 prosenttia ihmisistä hylkää ostoskärrynsä turvallisuushuolien vuoksi. Sen lisäksi, että otat käyttöön järjestelmän, joka pitää asiakkaidesi arkaluontoiset ja luottokorttitiedot turvassa, käytä luottamusmerkkejä, jotka osoittavat, että noudatat asianmukaista huolellisuutta.

Turvallinen kassakäynti ja hyväksytyn maksun merkit sekä kolmannen osapuolen vahvistukset herättävät luottamusta asiakkaissasi ja kannustavat heitä ostostensa toteuttamiseen.

Toimituskulut ja palautusehdot

Toimituskuluilla ja palautuskäytännöillä voi olla merkittävä vaikutus konversioihin. Jos asiakkaasi eivät näe kokonaiskustannuksia etukäteen, on todennäköistä, että he hylkäävät ostoskorin tekemättä ostosta.

Koska he eivät voi kokeilla tilaamaansa tuotetta, avokätinen palautusoikeus voi myös saada heidät luopumaan tilauksesta.

Myynnin jälkeisen tuen saatavuus

Konversio ei ole ostajan matkan loppu. Kun joku on ostanut sinulta, on ratkaisevan tärkeää tarjota poikkeuksellinen asiakaskokemus ja vastata hänen tarpeisiinsa. Jos ihmiset eivät ole varmoja siitä, mitä tapahtuu, jos he tarvitsevat tukea oston jälkeen, he ovat haluttomia asioimaan kanssasi.

Kerro siis, että he voivat ottaa yhteyttä, jos he kohtaavat ongelmia tai haluavat vain oppia, miten he voivat hyödyntää ostamaansa tuotetta tai palvelua parhaalla mahdollisella tavalla.

Mannequin Mall poistaa kaikki konversioesteet käsittelemällä nämä huolenaiheet tuotesivullaan selkeästi ja heti alkuunsa. Potentiaaliset asiakkaat saavat kaikki tarvitsemansa vastaukset ilman, että heidän tarvitsee tutkia sivustoa ja klikkailla edestakaisin etsiessään toimitus- tai palautusehtoja.

Availability of After-Sales Support (Lähde: Mannequin Mall)

Pidä mobiiliostajat mielessä

Verkkokaupan mobiilikulujen odotetaan nousevan 728,28 miljardiin dollariin vuoteen 2025 mennessä.

Kuluttajista 59 prosentille mahdollisuus tehdä ostoksia matkapuhelimella on tärkeä tekijä, jonka he ottavat huomioon tehdessään ostopäätöstä.

Tapaa Ranktracker

All-in-One-alusta tehokkaaseen hakukoneoptimointiin

Jokaisen menestyvän yrityksen takana on vahva SEO-kampanja. Mutta kun tarjolla on lukemattomia optimointityökaluja ja -tekniikoita, voi olla vaikea tietää, mistä aloittaa. No, älä pelkää enää, sillä minulla on juuri oikea apu. Esittelen Ranktracker all-in-one -alustan tehokasta SEO:ta varten.

Olemme vihdoin avanneet Ranktrackerin rekisteröinnin täysin ilmaiseksi!

Luo ilmainen tili

Tai Kirjaudu sisään omilla tunnuksillasi

Lisäksi 57 prosenttia internetin käyttäjistä sanoo, etteivät he suosittele ystävilleen ja perheenjäsenilleen tuotemerkkiä, jonka mobiilisivusto on huonosti suunniteltu.

Kaikki nämä tilastot osoittavat, että mobiililaitteille sopivan verkkokaupan luominen on perusteltua. Siksi sinun tulisi aina soveltaa parhaita käytäntöjä, kun suunnittelet tuotesivusi mobiiliversiota.

Seuraavassa on muutamia vinkkejä mobiiliystävälliseen verkkosivustoon, joka ei ärsytä kävijöitäsi:

  • Pidä ulkoasu yksinkertaisena ja helpoksi navigoinnin kannalta.
  • Käytä suuria painikkeita, jotta vältät rasvasormivirheen.
  • Vältä ponnahdusikkunoita, sillä niitä voi olla vaikea sulkea mobiililaitteella.
  • Optimoi kuvat mobiililaitteille latausnopeuden lisäämiseksi.
  • Käytä AMP-kehystä (Accelerated Mobile Pages) palvelimen suorituskyvyn parantamiseksi ja latausnopeuden lisäämiseksi.
  • Ota automaattinen korjaus pois käytöstä verkkolomakkeissa nopeuttaaksesi täyttöprosessia.
  • Käytä tavallisia, helposti luettavia fontteja.

Many Mornings toteutti mobiilisovellusystävällisen suunnittelun tuotesivuillaan. Yksinkertaisuus, helppo navigointi, suuret CTA-painikkeet ja selkeä prosessin yleiskuvaus helpottavat asiakkaita selailemaan tuoteosiota, lisäämään tuotteen ostoskoriin ja pääsemään nopeasti jo valittuihin tuotteisiin.

Keep Mobile Shoppers in Mind (Lähde: Many Mornings)

Lopulliset ajatukset

Hyvin harkitut ja optimoidut tuotesivut johtavat huomattavasti suurempaan konversioon. Kun asiakas pääsee tuotesivulle, se tarkoittaa yleensä, että hän on valmis ostamaan, ja sinun tehtäväsi on helpottaa kassaprosessia ja tehdä siitä mahdollisimman sujuva ja häiriötön. Nämä strategiat näyttävät sinulle oikean suunnan ja opastavat sinua kriittisten tuotesivuelementtien optimoinnissa.

Felix Rose-Collins

Felix Rose-Collins

Co-founder

is the Co-founder of Ranktracker, With over 10 years SEO Experience. He's in charge of all content on the SEO Guide & Blog, you will also find him managing the support chat on the Ranktracker App.

Aloita Ranktrackerin käyttö... ilmaiseksi!

Selvitä, mikä estää verkkosivustoasi sijoittumasta.

Luo ilmainen tili

Tai Kirjaudu sisään omilla tunnuksillasi

Different views of Ranktracker app