Stäng Huvudmeny

En perfekt produktsidas tre ”måsten” – Bild, Pris & Knapp.

E-handel Konvertering

Bild-Pris-Knapp

De här tre kärnkomponenterna på en produktsida verkar dyka upp i varje optimeringsprojekt inom E-handel som jag stöter på. Lär dig hur en effektiv utformning av Bild-Pris-Knapp kommer att öka din konverteringsgrad.

Låt oss börja med Bilden. Det är ett välkänt faktum att kvaliteten på produktbilder har en stark inverkan på konvertering. Eftersom bilder är så kraftfulla för oss människor kommer Bilden alltid att vara det första som besökaren ser på sidan. Kom sedan ihåg att tendensen att titta och läsa från vänster till höger fortfarande är ett dominerande beteende, även online. Slutsats: Saker du verkligen vill att användaren ska se, som Priset och Knappen ska placeras till höger och eventuellt under bilden.

Men inte bara Riktningen är viktig. Avstånd spelar också en stor roll. En av de viktigaste principerna för mänsklig perception är att ”Saker som visas tillsammans hör ihop”. Så dina besökare kommer att leta efter Priset och Knappen i närheten av Bilden. Sätt dem för långt bort och det finns en risk att besökaren inte ser dem, eller åtminstone kommer att behöva söka efter dem aktivt, istället för att bara hitta dem utan ansträngning.

”Saker som visas tillsammans hör ihop”

Så vad med Priset? Eftersom Priset är en bit text har det historiskt blivit behandlat som all text på sidan – Arial storlek 4, eller vad din brödtext nu råkar vara. Istället ska du se till att ditt pris står ut på sidan. Stor teckenstorlek, fetstil och en annan färg. Mer behövs inte.

Slutligen ska Knappen synas tydligt också. Röd eller inte röd, det är inte frågan. Se bara till att den har en annan färg och formatering än andra objekt på sidan så att du markerar den att här Knappen har en väldigt speciell roll.

Micro-besök – Anledningen till varför allt detta spelar roll

Nu kanske du tycker att jag överreagerar. Jag menar – Hur svårt kan det vara att hitta en bild, ett pris och en knapp på en sida? Faktiskt – mycket svårt. För att förstå varför måste du se besökarens interaktion med din sida i hela sitt sammanhang. De ser inte sidan som du ser den.

Eftersom besökare jämför priser och features är det vanligt att de lämnar och återvänder till din sida flera gånger under ett besök. Jag kallar detta ”Micro-besök”. De öppnar olika produktsidor, inklusive dina konkurrenters, och flippar fram och tillbaka för att hitta det som de tycker passar deras behov bäst. Om de öppnar nya fönster eller flikar är det troligt att du inte ens ser dessa Micro-besök i din webbanalys-data. Det som ser ut som ett 20 sekunders genomsnittligt besök på produktsidan kan faktiskt vara flera Micro-besök, vart och ett så kort som bråkdelen av en sekund. Och om du kommunicerar med någon på bråkdelar av en sekund, är det bäst att du är fokuserad på vad du vill förmedla. Som till exempel Bild och Pris.

Slutligen, under ett av dessa Micro-besök lyckas du höja intresset till en ”nära-köp-nivå” och nu är din Knapp behändigt placerad precis i närheten av de föremål som har uppmärksamheten. Och sedan: Du har ett klick – Grattis!

Några exempel från verkligheten

Här är tre exempel på sidor som jag har arbetat med nyligen. Jag tycker det är ganska lätt att se vilken sida som gör ett bra jobb och vilka som inte gör det. Vad tycker du?
(Klicka på var och en av bilderna för en större bild)

Produktsida Cykel Produktsida TenaProduktsida Cerat


I det tredje fallet (TENA slip ..), har de lyckats sätta köp-knappar på relaterade artiklar närmare produktbilden än köp-knappen för själva artikeln. Den här sidan är mycket förvirrande och man hoppar fram och tillbaka och försöker ta reda på vad man ska göra.

 

Det här kan du göra direkt:

Om du tror att det finns en viss sanning i det jag just skrivit – Sätt dig själv i dina besökares skor:

  1. Öppna upp produktsidor för samma eller liknande produkter på alla dina konkurrenters webbplatser.
  2. Börja bläddra fram och tillbaka.
  3. Se var det är lätt att hitta Bild-Pris-Knapp utan ansträngning.
  4. Om din sida är den bästa – Grattis!
  5. Om inte – titta noga på vad som skiljer den du anser vara den bästa sidan och din egen.

I vilket fall – Plocka upp alla små tweakningar, och idéer från de olika sidorna och börja testa din egen sidmall. Det är det enda sättet att ta reda på vad som fungerar just för dig.


  • Lisa Lane

    Hej, en synpunkt/fråga and knapp. Produktsidan med trehjulingen är bra – men – varför har men an röd köp-knapp. Röd signalerar något av ”varning” eller stopp? Grönt är skönt och vore pricken över i:et? Eller fanns det en tanke med den röda knappen?

    • Chief Conversionista

      Jag använde den färg som fanns på existerande knappar. Om ”rött är farligt” är en fråga jag får höra hela tiden och som svar på det har jag tagit dessa två bilder vid Mörby centrum: 1. Jättefarliga varumärken 2. Farligaste varumärket. Om nu rött är så farligt hur kommer det sig att det ser ut på detta sätt? Det viktigaste är inte att knappen är röd eller inte, utan att den har en tydlig och avvikande färg som gör att man hittar den.

Få vårt Nyhetsbrev

Anmäl dig till vårt nyhetsbrev

Nyhetsbrev

Följ oss där det händer:

Best Of Conversion

Vi summerar de senaste Konverteringsnyheterna åt dig.

BOC - Tips på Engelska.