Orderbekräftelse

Övrigt

Userium.comBaymard.com

blog.kissmetrics.com/mega-ecommerce-guide/Nielsen Norman Group, Articles

E-commerce Usability Best Practices by governor technologySmashing magazine - Fundamental Guidelines Of E-Commerce Checkout Design

Kr

<<img src="http://www.abc /def/flaggan.gif" alt="svenska flaggan">>

CSS

<SVERIGE>

Sajten är responsiv

Den fungerar i olika skärmstorlekar och i mobil och surfplatta. Besökaren behöver inte scrolla fram och tillbaka sidledes.

Personaliseringsfunktioner

Valuta, språk, landsspecifika erbjudanden, skatter och leveransalternativ ändras utifrån besökarens geografiska position. IP-baserad geografisk posi-tionering används inte utan kundens tillåtelse.

Alt-taggar

På alla element som inte är text, exempelvis bilder, kartor och videos, används Alt-taggar.

Allt innehåll går att läsa utan stilmall (style sheet)

Länkar, knappar och checkboxar är enkelt klickbara

exempelvis kan en användare klicka i en checkbox genom att klicka på texten bredvid, inte bara på själva checkboxen.

Relaterad information är tydligt grupperad tillsammans

Konsekvent layout

Sidors layout ser likadan ut på alla sidor på sajten.

Sidor är inte plottriga

Det finns tillräckligt mycket vitt utrymme för att besökaren ska kunna ”scanna” igenom innehållet.

Övrigt

TACK Tacka kunden för att de valt att köpa produkten hos er

E-post med orderbekräftelse

Upplys kunden om att denne kommer få ett E-postmeddelande från dig med orderbekräftelse.

Fråga efter mer

Låt inte kunder försvinna efter köpet. Be kunden anmäla sig till ert nyhetsbrev eller gilla er sajt på sociala medier så som Facebook.

Orderbekräftelse

Kr 99

Navigation Varukorgen

Startsida

100

100

?

!

?

NAMN

890102 01010

19890102 01010

ADRESS

100TOTALSUMMA

400

BANK

BANK

1012

Visa antalet steg i checkout-processen

och på vilket steg användaren just nu befinner sig.

Minimera distraktion

Ta bort onödiga element som distraherar besökare, exempelvis headern samt alla länkar till andra produktsektioner på sajten. Behåll logo-typen och låt denna leda till startsidan.

Bra exempel är Bokus.se.

Framhäv ”nästa steg”-knappen

genom både färg, form och text. Uppmuntra till klick.

Be aldrig om information

som inte är direkt nödvändig för själva köpet.

Förklara varför du ber om informationen

särskilt viktigt är det om denna information är oväntad för kunden.

Använd positiv validering

Ge kunden uppmuntrande meddelanden, ändra formulärfärgen eller lägg till en grön bock bredvid formulärfältet när kund har skrivit in rätt data.

Använd trevliga felmeddelanden

som tydligt beskriver vad som gick fel. Ta om mö-jligt på er skulden, skyll aldrig på kunden.

Använd vanliga ord som beskriver formulärfälten

som exempelvis namn och adress. Undvik sådant som folkbokföringsadress eller förnamn/efternamn.

Acceptera alla format av data

Om kunden skriver personnumret med eller utan 19 i början eller om bindestreck används eller inte används ska inte spela någon roll.

Leverans- och orderhanteringstid

Tala om för kunden hur lång tid det kommer att ta innan den beställda varan skickas och om möjligt anländer.

Visa den totala kostnaden

inkludera alltid skatter och fraktkostnader.

Betalning sker på sajten

Skicka aldrig besökaren till en betallösning hos tredje part. Se till så att betalningen sker på din sajt.

Checkout

100

50 %

+-

Kr 99

=Gå till checkout

Stora tydliga thumbnail-bilder

visar vad som ligger i varukorgen.

Produktlänkar, priser, lagersaldo och kvantitet

syns tydligt.

Rabattkodsfält framhävs inte men är ändå synlig

Helst är det gömt bakom en länk som fäller ut en dropdown.

Det går att ändra antal och ta bort produkter

Det senare framhävs dock inte men är fortfarande synlig för besökaren.

Visa upp ett telefonnummer till kundtjänst

och en länk till eventuell kundtjänstchatt.

Placera triggern ovanför sidbryt (så kallad fold)

Tyddliggör betalalternativ

så som Visa, Klarna, Paypal etc.

Beskriv alternativa möjligheter för checkout

som exempelvis med registering, snabbkassa etc.

Live chatt

funktion �nns på sidan (rekommenderas men inte nödvändigt)

Spara i önskelista

(rekommenderas men inte nödvändigt)

Skicka som gåva

(rekommenderas men inte nödvändigt)

Spara varukorgen till senare

(rekommenderas men inte nödvändigt)

Varukorgen

1

A 14-16 pxA

100

100

100

+

TOTALSUMMA

Produktbilder/videos är relevanta och meningsfulla

Det finns högkvalitativa bilder och videor som visar produkten.

Tydliga produktbilder

Produktbilder är tagna ur olika vinklar och det går att förstora bilderna.

Sammanfattning av produktegenskaperna

En sammanfattning samt fördjupad information om produkten finns och dessa två är tydligt avgrän-sade från varandra.

Låt inte priset bli en överaskning

Priset kommuniceras tydligt. Det finns inte dolda kostnader som tillkommer eller över-askningar i villkoren.

Leveranstiden förmedlas tydligt

Om varan är slut i lager kommuniceras detta

Positiva och negativa kundomdömen

Både positiva och negativa kundomdömen synlig-görs genom en rekommendationsfunktion.

14-16 pixlar stor fontstorlek

Fontstorleken på text är minst 14-16 pixlar vilket förbättrar läsbarheten.

Produktsidor

Produktsök

Tydligt sökfält

Det finns ett fält för produksök tydligt synlig på alla sidor på sajten (förutom på sidor i betalflödet).

Produktsökfältets bredd

Produktsökfältet är brett nog för att besökare ska kunna se vad de har skrivit.

Produktsök är placerat i ett formulär

Besökaren kan skriva in sökord direkt i ett formulär och behöver inte gå via en länk.

Sökresultaten är relevanta

Sökfunktionen är “smart”

Sökfunktionen hittar produkter oavsett om söknin-gen sker i singularis, pluraris, felstavningar, syno-nymer etc.

Sökförslagsfunktion

Produktsökmotorn ger sökordsförslag för att hjälpa användare söka efter relevanta nyckelord.

Sökhistorik

Användaren kan se deras senaste sökningar i produktsökfunktionen.

Startsida

”Klicka här”.

Star

tsid

a

Nav

igat

ion

Var

ukor

gen

Navigation VarukorgenStartsida < <

Navigation

Viktiga länkar publiceras inte i rörliga element

Du undviker att placera vikta länkar i exempelvis snurrande bildkaruseller.

Kategorier är sorterade utifrån popularitet

Brödsmulor

Brödsmulor finns på alla sidor på sajten så att besökaren förstår var de är.

Navigationen ser likadan ut på alla sidor

Beskrivande länkar

Varje länk eller knapp kommunicerar vad som händer om användaren klickar. Det finns inga länkar eller knappar med text av typen ”Klicka här”.

Länkar är lätta att identifiera

Det är uppenbart att länkar är länkar. Element som inte är klickbara ser inte inte heller klickbara ut, exempelvis undviks understruken text på vanlig text.

URL till sajten är kort och lätt att komma ihåg

Tydlig länk till varukorgen i det övre högre hörnet

En tydlig länk till varukorgen �nns i det övre högra hörnet på alla sidor på sajten (förutom på sidor i betal�ödet).

1 1 1

Första intryck

Startsidan gör ett bra första intryck och uppmanar till köp.

Trygghetssymboler

Bygg trovärdighet och förtroende genom att visa upp välbekanta trygghetshöjande symboler i headern på sajten.

Gör det uppenbart vad du säljer

Startsidan gör det uppenbart vilken typ av pro-dukter du säljer.

Unik värde

Det kommuniceras tydligt varför besökare ska handla på din sajt snarare än av några av era konkurrenter.

Visa upp era bästsäljande produkter

Dina bäst säljande produkter marknadsförs så tidigt som möjligt på startsidan.

Tydliga triggers

Besökarna förstår vad de ska göra och det är tydligt varför de bör klicka på triggers som till exempel knappar eller länkar.

Visa nöjda kunder

Sajten visar upp exempel på nöjda kunder och bygger därigenom fötroende och värde. Både namn, bild och deras omdöme är publicerade.

Undvik stock photos

Du undviker att använda generiska bilder, så kallade ”stock photos”.

Kontaktuppgifter till kundtjänst

Kontaktuppgifter är lätta att hitta direkt via startsi-dan.

Sekretesspolicy Om din sajt samlar in information om användare finns det en sekretesspolicy.

Startsida

ChecklistaOptimera din E-handel Checka

10

2

3

4

5

6

7

8

9