Förändringar sker hela tiden. Stark konkurrens tillåter inte utvecklingstrender för internetmarknadsföring att stå stilla.
Om till exempel igår knappen "begär ett samtal" var någon form av attraktiv innovation, finns den idag redan överallt och inte en enda konsument kommer att bli förvånad över den. Det är därför ägarna till ledande nätbutiker är inne konstant sökande nya idéer och nya knep. Dessutom visar det sig ofta att du inte behöver gå långt - ibland räcker det med en enkel "kosmetisk" omdesign.
Idag kommer vi att prata om en så till synes enkel sak som att göra en beställning i en onlinebutik. Varje webbplats har ett sådant avsnitt. Men inte alla sajter kan skryta med att driften av denna funktion är perfekt och tar in det maximala antalet kunder. Oftast händer precis tvärtom: butiker "bryar sig inte" om detta. Jo, det finns en beställningsblankett och vad mer som behövs.
Så detta är en mycket stor missuppfattning. Ju svårare och obegripligt det är att lägga en beställning, desto större är chansen att cirka 2/3 av besökarna inte ens bryr sig om att köpa varor i din webbutik.
Grundläggande regler för beställningsformuläret
Låt oss börja med det faktum att det alltid är nödvändigt att ange i hur många steg processen sker att lägga en beställning och hur lång tid kommer allt att ta. Till exempel frasen "tre enkla steg and a few minutes of your time” ökar chansen att köparen slutför beställningen och slutför den.
När en person redan har klickat på " och är i färd med att göra ett köp, måste han förstå vilket stadium han är på och hur många steg han fortfarande måste övervinna. Det är bäst att inte använda specialtecken, ikoner eller några bilder för att indikera ytterligare steg. Kunden kan tolka dem felaktigt. Det är säkrare och mer korrekt att skriva allt med orden: "välj en leveransmetod" eller "bekräfta beställningen." Bredvid knapparna som indikerar åtgärden bör du inte placera något onödigt. Låt henne vara ensam fritt utrymme, men synlig, tillgänglig och begriplig.
Ur synvinkel av mänsklig psykologi och vana bör positiva åtgärdsknappar ("lägg en beställning", "bekräfta", etc.) vara placerade till höger och vara attraktiva och märkbara för kundens ögon. Knapparna i serien "retur", "avbryt" etc. ska vara till vänster och ska inte vara markerade på generell bakgrund så att det inte finns något incitament att pressa dem.
Om du, när du fyller i formuläret, ber kunden om vissa personuppgifter, förklara alltid varför det behövs: för- och efternamn - för att behandla dokument för varorna, telefonnummer - för att kontakta leveransfrågor, e-postadress– för att bekräfta beställningen.
Registreringsprocessen måste vara konsekvent. Det bör inte tillåtas att köparen under något skede skulle behöva avbryta sina handlingar och gå till exempel för att registrera sig. Det är osannolikt att han efter detta kommer att fortsätta sin beställning, stanna i din webbutik eller komma dit igen. Det borde inte finnas någon anledning till varför en köpare skulle behöva avbryta sin beställningsprocess.
Här är ett exempel på felaktig registrering, där plötslig registrering krävs under köpprocessen. Men det här är Ozon.ru - den största stormarknaden i Ryssland och här dikterar den sina egna regler.
Ett annat vanligt misstag som ofta finns på hemsidor och som du säkert har stött på. Så du fyllde i många olika fält som indikerar mycket data om dig, det tog lite tid, klicka på knappen "nästa" och sedan ger systemet dig ett felmeddelande om att du till exempel i något fält skrev något ofullständigt eller felaktigt. Och då ser du att för att rätta till dessa fel måste du först fylla i alla formulär! Åtminstone är det irriterande. Maximalt – kunden lämnar din webbplats. Tillåt inte ett sådant sorgligt missförstånd.
Glöm inte, i alla stadier av att göra en beställning den mest synliga viktig information: kostnad och sammansättning av beställningen, leveransvillkor och betalningsmetoder.
Och till sist, det mesta perfekt alternativ– det är när du specifikt anger alla leveranstider och dess specifika kostnad. Med andra ord låter frasen "leverans inom 5-15 dagar" vagt och väcker inga positiva känslor. Inskriptionen "produkten kommer att levereras den 1 september" kommer att glädja köparen mycket mer. Till exempel gillar jag verkligen denna teknik i nätbutiker när leveransfältet automatiskt bestämmer min stad efter IP-adress och omedelbart beräknar kostnaden för leverans av varorna och tid.
Att arbeta på en webbbutikswebbplats är ett långt och mödosamt arbete. Det är nödvändigt att tänka igenom varje detalj och varje liten detalj i denna detalj, introducera nya "tricks", analysera, ändra och förfina.
Har du någonsin sett en inspelning i Webvisor av en kund som lägger till en vara i kundvagnen, börjar fylla i beställningsinformation och... lämnar sajten? Den här scenen kan när det gäller dramatik jämföras med de sista bilderna av Titanic. Idag ska vi prata om vad som får en användare att lämna en webbplats utan att göra ett köp och hur man fixar det.
Enligt Baymard Institutes studie "Cart Abandonment Rate Statistics" hamnar mer än 68 % procent av beställningarna som hamnar i vagnen inte med att köpas och betalas.
Varför vägrar användaren det avsedda köpet?
Checklista: hur man gör det bekvämt att köpa i en onlinebutik
1. Lägg i varukorg
1.1. Efter att ha klickat på knappen "Köp" eller "Lägg i varukorg", visa användaren att produkten har lagts till
Efter att ha klickat på knappen "Lägg i varukorg" tills respons med ett meddelande om att lägga till en produkt bör knappen vara inaktiv för att undvika lägga till igen Lägg till i kundvagn. I ett popup-fönster bjuder du in dig att göra ett köp eller fortsätta handla.
1.2. När du håller muspekaren och klickar på knappen "Lägg till i varukorgen" ska den vara markerad eller ändra färg
Om knappen inte ändrar utseende kan användaren av misstag lägga till flera identiska produkter i varukorgen.
När du håller muspekaren över "Köp"-knappen i "Osette" blir knappen ljusare:
Förändra utseende knappar i "Hej" efter att ha tryckt på:
1.3. Ange förfarandet för att returnera och byta varor
Detta gäller särskilt för kläd- och skoaffärer, där sannolikheten för att göra fel med storleken är stor. Användaren vill vara säker på att han kommer att kunna ta emot rätt storlek i sista hand.
Leveransinformation på Hej-sidorna:
På Photomags hemsida detaljerad informationöppnas genom att klicka på länken "Mer information":
2. Inuti korgen
2.1. I korgen låt oss detaljerad information om beställda varor
För att användaren ska kunna kontrollera riktigheten av sin beställning och vägra varorna som han lagt i kundvagnen bara för jämförelsens skull, tillhandahåller vi omfattande information om beställningen:
- produktbild (när du håller muspekaren över bilden bör den förstoras),
- när du klickar på bilden ska detaljerad information om produkten visas,
- ange antalet tillgängliga enheter,
- om produkten är tillgänglig i offlinebutiker, visa var du kan hämta den själv.
2.2. Knappen för att gå till nästa designsteg ska vara visuellt markerad
Knappen "Fortsätt att göra en beställning" på Leboutiques webbplats är duplicerad och markerad i färg bland andra element:
Knappen "Placera en beställning" på webbplatsen "Billigare" är också svår att missa:
2.3. Vagnen ska "komma ihåg" beställningen
Kanske, av tekniska eller andra skäl, kan användaren inte göra ett köp under en session. När han kommer till sidan igen blir det obekvämt att söka och lägga till produkter igen. Stor chans, Vad potentiell köpare kommer att ge upp upprepade manipulationer, så webbplatsen måste komma ihåg innehållet i kundvagnen.
2.4. Lägg till en knapp för att ta bort varor från kundvagnen
Till exempel, möjligheten att ta bort en vara från kundvagnen på Mobillac-butikens webbplats presenteras i form av en liten länk:
2.5. Kampanjkoder och rabatter
Placera inmatningsfält rabattkuponger och kampanjkoder på kundvagnssidan.
De ska inte vara aktiva eller synliga som standard. Detta distraherar användaren, som redan är redo att köpa, från kassaprocessen och motiverar honom att lämna webbplatsen i jakt på information om att få rabatt.
Kampanjkodsfältet i "Hej" är dolt som standard:
Och den öppnas bara när du klickar:
Men på Foxtrots webbplats är kampanjkodfältet synligt som standard. Dessutom föreslår varukorgssidan att du kontrollerar ditt bonuskonto genom att gå till en annan webbplats:
Låt namnet på inmatningsfältet vara intuitivt. Det är bättre att ersätta den suddiga "Kupongen" med "Har du en kampanjkod?"
3. Registrering
3.1. Ge användaren möjlighet att köpa utan registrering
Användare gillar inte att registrera sig när de gör sitt första köp. För det första är de inte säkra på att de kommer att göra det stamkunder. För det andra vill ingen ta emot irriterande spam i sin e-post. Och för det tredje är registrering förknippad med att fylla i dussintals fält, återställa ett lösenord och skicka en captcha.
Funktionen "Köp med ett klick" i "Photomag". Användaren lämnar bara ett telefonnummer, resten av informationen anges av chefen. Knappen för att göra en "snabb beställning" är visuellt markerad bland andra element, och knappen för att lägga en beställning på egen hand är osynlig och verkar till och med inaktiv:
Leboutique erbjuder ett alternativ till registrering - logga in med ett socialt nätverkskonto:
Ta bort bekräftelsen från utcheckningsprocessen Kontaktinformation(följ länken från brevet eller ange koden från SMS). Om bekräftelsen tar för lång tid lämnar användaren helt enkelt utan att slutföra köpet.
Om du tillhandahåller möjligheten att beställa utan registrering, gör denna funktion synlig på sidan.
Vid beställning utan registrering bör funktionaliteten inte försämras. Om en betalningsmetod inte är möjlig utan registrering, vänligen meddela oss i förväg. Beskriv fördelarna med registrering och skillnaderna i funktionalitet för användare med olika status.
3.2. Bakgrundsregistrering
Ofta räcker den information som krävs för att göra en beställning för registrering. Rapportera automatisk registrering till användaren per brev. Naturligtvis har denna metod sina nackdelar, till exempel ett automatiskt genererat lösenord, men användaren sparar tid och butiken får en ny abonnent.
Så här implementeras det i Rozetka:
Eller be användaren att registrera sig efter köpet baserat på den information de angett.
3.3. Efter registrering bör automatisk auktorisering och fortsättning av beställningen ske.
3.4. Föreslå att du använder adressen som inloggning E-post eller telefon
Om du föreställer dig hur många resurser du är registrerad på vanlig användare, och hur många par av inloggningar och lösenord han behöver komma ihåg, då blir oviljan att registrera sig igen förståelig. Telefonnummer och e-postadress är data som kunden alltid kommer ihåg.
Ange ett alternativ för lösenordsåterställning på inloggningssidan.
"Rozetka" känner igen användaren via e-post och hjälper till att komma ihåg lösenordet "utan att lämna kassan":
3.5. Spara den ifyllda informationen i inloggningsfältet
När du besöker igen går klienten som regel igenom flera "standard" inloggningar i huvudet eller kommer inte alls ihåg att han redan har registrerat sig på webbplatsen. Fråga klienten genom att lämna data i inloggningsfältet.
3.6. Prenumerera inte automatiskt på nyhetsbrevet.
De flesta kunder i nätbutiker har redan tröttnat på att få berg av onödiga brev med posten. Beskriv de tydliga fördelarna med att prenumerera och fråga om användaren vill få mejl från dig.
3.7. Minimera antalet inmatningsfält
Om användarens stad och distrikt kan bestämmas automatiskt, låt systemet fylla i dem automatiskt. I det här fallet bör användaren kunna kontrollera och redigera alla fält.
På Leboutik-webbplatsen hjälper en rullgardinslista dig att välja en operatörskod mobil kommunikation från listan.
3.8. Kontroll av att de angivna uppgifterna är korrekta bör utföras när du fyller i formuläret och inte efter att du har skickat in det
Efter att ha lämnat in en blankett med felaktiga uppgifter ska den ifyllda informationen hållas komplett.
Kontroll på sidan "Billigare" sker efter att ha skickat in ett formulär där de angivna uppgifterna inte sparas efter uppdatering:
3.9. Felmeddelanden ska vara tydliga och förklara hur problemet kan lösas.
Inmatningsfelmeddelandet på Hello-webbplatsen beskriver i detalj hur man korrigerar förvirringen:
Leboutik frågar användaren hur man anger rätt e-postadress:
4. Leverans
4.1. Visa självhämtningslager på en karta och i en lista
"Rozetka" ger möjlighet att välja upphämtningsställen efter adress i listan eller hitta närmaste filial på kartan:
4.2. Be användaren att välja en adress från en lista eller ange den manuellt
Ange eller välja en adress på Photomags webbplats:
4.3. Ange fraktkostnad när du väljer leveranssätt
Köparen kan bli förvånad över ökningen totala summan beställning vid mottagandet, vilket leder till avslag. Informera om att frakten betalas av köparen och ange en ungefärlig kostnad.
Bekväm visning av kostnaden beroende på leveransmetoden på Cheaper-webbplatsen:
Leveranskostnaden är synlig när du väljer den från listan på Allos webbplats:
På Photomags hemsida ser vi inte det slutgiltiga beloppet, men vi får reda på när vi kan klargöra slutkostnaden:
5. Betalning och detaljer
5.1. Ange betalningsmetoder i fallande popularitetsordning
"Hej" erbjuder att välja en betalningsmetod:
Visa betalningssystemikoner bredvid namnet.
5.2. Dela in betalningsmetoder i grupper efter deras betydelse:
- förskottsbetalning med bankkort,
- betalning kontant vid mottagandet,
- elektroniska betalningar,
- betalning via terminal.
Välja en betalningsmetod i Rozetka:
5.3. Ange provisionen för varje betalningsmetod
När du väljer betalningsmetod totala summan på sidan "Billigare" ändras:
Mobillac uppmuntrar kunder att betala med kort:
5.4. Om din produkt köps regelbundet, spara betalningsinformation så att användaren bara behöver lägga varan i varukorgen och klicka på "Betala"
5.5. Fråga inte typen betalningssystem från användaren, om provisionens storlek inte beror på valet
De första siffrorna i kortnumret identifierar betalningssystemet unikt: Visa, MasterCard, etc. Om priset inte ändras när du betalar med vilket kort som helst, bestäm automatiskt systemet för kortet som användaren anger.
5.6. När du anger ett kortnummer ska inmatningsfältet visuellt upprepa siffrorna i numret på själva kortet
Sexsiffriga nummer är uppdelade i 4 block med 4 siffror. Efter att varje block har fyllts ska övergången till nästa utföras automatiskt
Observera att det finns kort med andra nummer än sexton. Maestro-kort kan ha 13 eller 16 eller 19 siffror. Om din bearbetning accepterar kort med olika mängder siffror i numret, se till att inmatningsfältet anpassar sig till inmatade data. Med de första sex siffrorna kan du bestämma namnet på betalningssystemet, och om detta system har ett annat antal siffror i kortnumren bör fältet ändras.
5.7. Samla betalningsinformation på butikens hemsida
Om användaren, efter att ha klickat på "Betala"-knappen, hamnar på en betalningsresurssida, är detta förvirrande. Även erfarna Internetanvändare känner sig obekväma när de lämnar Betalningsinformation utanför affären.
Om det inte går att fylla i data i formuläret på sidan, se till att stilen på sidan bibehålls på betalningssidan.
Lämna alternativet på betalningssidan att gå tillbaka till butikens hemsida utan att betala. Här kan du även ange information om din beställning (beställningsbelopp och varukorgens innehåll).
5.8. Ange betalningssäkerhetsinformation på betalningssidan
- säker https-anslutning,
- betalningssystems logotyper och säkerhetscertifikat.
- om SMS-betalningsbekräftelse inte krävs, informera användaren om att betalningen gjordes utan 3DSecure-teknologi.
5.9. Om betalningen inte kunde behandlas bör ett felmeddelande visas
Om användaren, efter att betalningen har misslyckats, helt enkelt omdirigeras till betalningssidan eller varukorgen, är det svårt att förstå om betalningen lyckades eller inte.
Meddelande om att betalningen inte kunde göras på sidan "Hej":
Föreslå alternativa alternativ betala för köpet.
5.10. Kommunicera med kunden på ett tydligt språk
Ersätt tekniska och sällan använda termer med mer bekanta.
- "Autentisering" - "Ange koden från SMS",
- "Dynamiskt lösenord" - "Kod från SMS".
5.11. Bekräftelsekoden bör finnas i början av SMS:et så att den kan läsas utan att meddelandet öppnas
6. Orderbekräftelse
På sidan för orderbekräftelse, visa fullständig information:
- Produktnamn,
- Kvantitet,
- Pris,
- Kostnad för leverans,
- Leverans metod,
- Provision för betalningssystem,
- Mottagarens kontaktuppgifter.
Tillåt användaren att redigera information på bekräftelsesidan.
Orderbekräftelse vid beställning på Mobillacs hemsida:
7. "Tack för ditt köp"
Inkludera beställningsinformation på sidan "Tack för ditt köp".
Budskapet på den sista köpsidan i Cheaper-butiken är mycket kortfattat:
"Photomag" anger också ordernumret:
"Hej" ger detaljerad information:
Duplicera fullständig beställningsinformation på e-postlåda klient.
Inkludera ett utskriftsalternativ på din orderbekräftelsesida.
Om produkten är elektronisk, berätta för oss hur du kan ladda ner den.
Låt oss upprepa vad vi har tagit upp
Korg:
- att lägga till i kundvagnen bör inte innehålla onödiga steg,
- visa information om att produkten har lagts till i kundvagnen,
- inuti varukorgen visa detaljerad information om produkterna,
- knappen för att fortsätta handla ska vara synlig och namngiven i enlighet med användarnas förväntningar,
- Kampanjkodens inmatningsfält ska vara dolt som standard,
- lägg till en knapp för att ta bort varor från kundvagnen,
- vagnen måste komma ihåg beställningen.
Tillstånd:
- lägg till möjligheten att köpa utan registrering,
- lägg till bakgrundsregistrering,
- gör din e-postadress eller ditt telefonnummer till din inloggning.
Betalning:
- använda intuitivt tydliga namn betalningsmetoder med ikoner,
- visa betalningsmetoder i fallande popularitetsordning,
- varna för provisioner av betalningssystem,
- fält för att ange bankkortsdata ska visuellt upprepa platsen för informationen på det fysiska kortet,
- tillåta användaren att återvända till butikssidan utan att betala,
- ange detaljer om betalning avvisas.
Leverans:
- bestämma adressen automatiskt med möjligheten att redigera,
- visa självhämtningslager på en karta och i en lista,
- Ange beräknad leveranskostnad.
Sidan "Tack för ditt köp":
- visa ordernumret,
- dubbletter av orderinformation via e-post,
- Berätta för kunden hur händelserna kommer att utvecklas härnäst.
Post Scriptum
Det finns många alternativ för att implementera samma funktion, och valet beror på din nisch, målgrupp och webbplatsplattformar.
Huvudbudskapet i studien och vår artikel är att du nästan alltid kan göra ditt köp på webbplatsen mer bekvämt.
Aveb-specialister skrev förresten en bok om användbarheten av nätbutiker. Bara bruksanvisningar - endast specifika rekommendationer och exempel. Har du redan läst den? Om inte, se till att ladda ner och läsa.
Vilka kundvagnsförbättringar har ökat antalet konverteringar på din webbplats avsevärt? Vad rekommenderar du att uppmärksamma?
Lönsamheten för vilken nätbutik som helst beror i första hand på hur bekväma förutsättningarna skapas på sajten. Varje köpare vill hitta det de letar efter så snabbt som möjligt och samtidigt spendera ett minimum av ansträngning. Statistiskt sett gillar de flesta kunder inte kassaprocessen. Det är därför, om du vill öka antalet försäljningar, måste du förenkla beställningssystemet på din webbplats.
I nätbutiker måste kunden fylla i för att köpa en produkt order från, som installeras på webbplatsen med hjälp av speciella manus, moduler eller plugins. När du skapar ett beställningsformulär, följ följande regler.
1. Enkelhet är nyckeln till effektivitet.
Som praxis visar, om en köpare stöter på något problem när han lägger en beställning, lämnar han oftast resursen av rädsla för att stöta på detta problem igen. Om din beställningsblankett innehåller flera enkla steg och att fylla i kräver inte mycket arbete, du är garanterad stabil försäljning. Det är värt att notera att det viktigaste är att inte överdriva det med enkelhet, ta alltid hänsyn till detaljerna i ditt projekt. Beställningsformuläret på webbplatsen bör samla ett minimum nödvändig information för att slutföra beställningen.
2. Använd tydliga exempel.
En person behöver alltid tydligt exempel, speciellt när du fyller i beställningsformuläret. Försök att skapa ett webbformulär som även en nybörjare kan fylla i.
3. Visa totalt beställningens framsteg för din kund.
Kunden ska alltid se hur många etapper han har genomfört och hur många som fortfarande återstår att genomföra. är av särskild betydelse ur psykologisk synvinkel. Klassiskt schema beställning sker i 3-4 steg. Det första steget är när användaren skapar en beställningslista. Det andra steget - köparen anger sin kontaktinformation. Det tredje steget är informationsverifiering. Det fjärde steget är transaktionen.
4. Ta bort alla tvivel från kunder.
I vårt land har en lag om skydd av personuppgifter nyligen trätt i kraft, men många användare känner inte till det. I html-formulär Var noga med att inkludera ett meddelande om sekretess när du beställer personlig information. Detta kommer att avsevärt öka förtroendet hos dina kunder.
5. Nej! registreringar.
Nästan alla köpare har en negativ inställning till eventuell registrering, på grund av att denna process kan ta lång tid (enligt deras åsikt). Därför, även om du registrerar dig på din webbplats utan att bekräfta din profil, radera den eller gör beställningsprocessen tillgänglig för oregistrerade användare. Det är värt att notera att i vissa fall är registrering tvärtom nödvändig. Till exempel när du tänker skapa en kvalitetskundbas. Registrera dig i så fall på sajten via sociala media. Det är väldigt enkelt.
Alla ovanstående regler och tips ökar utan tvekan effektiviteten hos beställningsformuläret på webbplatsen, men du bör alltid komma ihåg att mycket beror på ämnets detaljer. Endast genom försök och misstag kan du verkligen öka webbplatskonverteringen.
Goda exempel valdes ut enligt användbarhetsprinciper. Det är också värt att notera att vissa exempel är unika och inte kommer att vara lämpliga för varje webbplats. Testa och förbättra alltid element på kassasidan.
Om det finns tvivel om tillvägagångssätten - .
Vad gör det roligt att beställa?
Lätt att använda. Även om användare inte har ett konto måste de ange sin adress och betalningsinformation för att göra en beställning. Bra form bör förenkla denna process: ange så lite information som möjligt från tangentbordet.
Användbara funktioner:
- Adresssökning eller automatisk textinmatning.
- Kopiera leveransadressen till betalningsinformationsadressen.
- Begäran om att skapa ett konto visas i slutet när användaren är redo att göra inköp.
- Lägga en beställning utan registrering.
- Rensa felmeddelanden så att användaren snabbt kan åtgärda dem.
Källor till problem:
- Tvingad registrering innan beställning.
- För många steg.
- Onödiga formulärfält.
- Otydliga felmeddelanden.
- Problem med formulärbekräftelse. Till exempel strikta regler för tidsformat.
Bästa exemplen på kassaformulär
Domino's
Dominos hemsida har lagt vikt vid mobilitet. Den känner igen enhetstyper och anpassar sig efter dem.
Beställningsformuläret är trevligt och lätt att använda: ingen registrering, enkla fält fyllande, sparad betalningsinformation för återkommande kunder.
Även om användaren glömmer lösenordet, men använder samma e-postadress, kommer han fortfarande att kunna göra en beställning. I sådana situationer returnerar många webbplatser helt enkelt registreringsformuläret och ber dig återställa ditt lösenord. Och detta är inte alltid bekvämt.
De har även en app där du kan beställa med ett klick. Öppna bara appen, vänta 10 sekunder och din pizza skickas till dig.
Lowes
Registrering kan bli ett hinder för att göra inköp. Detta extra steg innan du gör en beställning kan vara överväldigande för många användare.
Å andra sidan gör registreringen att du kan förenkla köpprocessen i framtiden. Det är också bekvämt för användarna
Erbjud dig att registrera dig i slutet av kassan. Du kan registrera dig på Lowes webbplats innan du klickar på knappen "gör en beställning". Det borde inte vara några svårigheter här.
Trådlös
Utmärkt beställningsformulär. Användaren tas omedelbart till en sida med en kundvagn och betalningsinformation. Du kan lägga en beställning utan att registrera dig förresten.
Hela beställningsformuläret finns på en sida. Och det är väldigt bekvämt.
Amazon
Det är enkelt att göra köp på Amazons hemsida. upprepade köp. Naturligtvis måste du först fylla i information om dig själv, men sedan kommer Amazon ihåg dem en gång för alla.
Detta minimerar antalet klick och steg. Processen från att lägga till en vara i din kundvagn till att du bekräftar din beställning tar tre steg. Alla orkar inte med så mycket. Dessutom kommer spontana köpare att försvinna.
På deras hemsida på beställningsformuläret bra design. En förbättring de bör göra är att få kassaformuläret att sticka ut från resten av innehållet på sidan.
Det finns en framstegsindikator, totalt antal produkter, pris och leveransvillkor. Du kan också ange adressen med autofyll, vilket är väldigt bekvämt.
Schuh
Deras team förstår vikten av användbarhet och förbättrar den hela tiden.
Titta på skärmdumpen nedan för att se skönheten med denna sida:
- Säkerhet.Överst finns en bekräftelse på att sidan är säker och företagets kontaktuppgifter.
- Meddelande om leverans och retur av varor. Tre punkter ovanför kassaformuläret påminner användarna om bra förutsättningar leverans, rabatter och enkel process retur av varor.
- Framstegsindikator. Hjälper användarna att förstå hur många steg de kan förvänta sig. Och det faktum att det finns tre av dem redan tyder på att detta är en snabb process.
- Enkel registrering. Schuh är inte intresserad av att registrera sig för i detta skede, kommer han att erbjuda det senare.
- Länkar till viktig information. Du behöver inte göra dessa länkar i botten alltför märkbara, men de bör finnas där om användaren behöver dem.
- Betalningsmetoder. En visuell påminnelse om hur användare kan betala för sin beställning.
- Centrerad form. Det finns några distraherande element på sidan, men fokus ligger på att göra ett köp.
Crate & Barrel
Formen har en vacker och enkel design. Allt är logiskt ordnat, varje fält är markerat. Det finns en förloppsindikator och det finns inga distraherande element på sidan.
Nordström
Ett bra exempel på en beställningsblankett på en sida. Det har en fördel - det verkar för användaren att det går mycket snabbare att lägga en beställning. Och det spelar ingen roll om det är sant.
Nordstroms hemsida har information om produkten och dess pris, plus att tomma fält är markerade i rött så att användaren inte missar något viktigt.
Superbalist.com
Denna sajt Jag gjorde registreringsformuläret i form av en roman - så snart användaren lägger till en vara i kundvagnen uppmanas han (i form av ett popup-fönster) att skapa ett konto med e-post eller ett Facebook-konto, eller logga in på en befintlig.
Användaren uppmanas sedan att skapa ett lösenord innan han fortsätter. 
Efter detta skickas han till vacker form lägga en beställning (även om detta inte är helt bekvämt för användare som vill lägga till mer än en vara i varukorgen).
Det som är anmärkningsvärt är att Superbalist-webbplatsen lägger till mycket liten text som förklarar leveransvillkoren och vad som ska anges i fälten.
AO.com
AO.com Gjort Bra jobbat. På den här sidan kan du välja tid och datum för leverans, och det är väldigt enkelt:
Betalningssidan är jättebra. Orderbelopp, leveransdatum, kvantitet varor etc. visas. AO lämnade sin kontaktinformation så att alla användare kan ringa direkt om han har några frågor.
Josef Josef
En annan sida med vacker design beställningsformulär - Josef Josef . Sidan som valts som exempel är registreringsformuläret/kassan utan registrering.
Vad de gör rätt: ge kunden valmöjlighet. Vissa kommer att vilja registrera sig, medan andra inte vill, och de kommer att ha möjlighet att göra en beställning utan ytterligare procedurer.
Bra exempel, men det finns utrymme för förbättringar...
Zappos hemsida - bra exempel, fokuserar de på kundservice och lojalitet.
Utcheckningsprocessen är dock inte perfekt. Konto skapande - erforderligt skick, vilket inte passar alla användare.
Kanske i fallet med Zappos tar varumärkets rykte bort denna barriär. Jag undrar om de provat något annat.
Efter registrering omdirigeras användare till kundvagnssidan, vilket inte är särskilt bekvämt.
Dessutom är beställningsformuläret inte markerat. Hon går vilse i bakgrunden Navigeringsmeny, sökfält, alfabetiskt index, etc. Det finns för många distraherande element som kommer att göra användare ovilliga att göra en beställning.
Att markera ditt kassaformulär betyder inte att du lockar in användare, det betyder att det blir lättare för dem att köpa.
Stövlar
Det här kassaformuläret är det sämsta som finns.
Vad som är dåligt här: användaren måste skriva sin adress två gånger - när han fyller i betalningsinformation och leveransinformation. Använder samma standardadress − bra sätt minska formulärfyllningstiden som många webbplatser använder.
Slutsats
Formulären kanske inte liknar varandra, men var och en av dem har användbara funktioner som du kan använda när du skapar din webbplats.
Vad har var och en av dessa former gemensamt? De syftar till att göra saker enklare för användarna. Till exempel, när du vill att en användare ska registrera sig, är det bättre att lägga till ett eller två steg i slutet av kassan snarare än i början.
Har du några exempel på kassaformulär som är bättre än de som presenteras? Om ja, dela dem med oss i kommentarerna under inlägget...
I den här artikeln kommer jag att berätta om en så viktig sak för användbarheten av en onlinebutik som det ömsesidiga beroendet mellan fälten på kassasidan i kundvagnen.
Jag ska använda ett exempel för att förklara vad det är. Låt oss anta att din onlinebutik är geografiskt belägen i St. Petersburg, där du har ett upphämtningsställe eller en offlinebutik. I St Petersburg levererar du med bud och ger möjlighet till självhämtning. Men förutom detta så levererar du i hela Ryssland. Hur man genomför i detta fall rätt design beställning på webbplatsen, så att det är bekvämt för alla, inklusive de av dina kunder som är i samma stad som dig (kan använda självhämtning eller budleverans) och andra som kan ta emot sin beställning endast genom posttjänster.
Det visar sig att alla kunder kan delas in i två grupper - lokal(från S:t Petersburg) och utomstadsbor(från någon annan stad i Ryssland).
När vi vet detta, låt oss avgöra vilken minimiuppsättning fält på kassaformuläret kommer att behövas i din butik för var och en av dessa grupper.
Som du kan se är beställningsfälten olika för köpare av lokala nätbutiker och för köpare utanför landet.
Detta är exakt samma beroende av fälten i korgen som jag talade om i början. Efter att köparen har angett sin stad, med hänsyn till denna stad, ger vi honom att fylla i endast de fält som finns i I detta fall behövs och ger ett val av endast de betalnings- och leveranssätt som vi kan acceptera och utföra.
Enkelt uttryckt ska butiken inte visa köparfälten som köparen inte behöver fylla i eller välja. Till exempel, om en butik endast levererar till Moskva via posttjänster, men inte kan leverera med bud, behöver du inte visa leveransmetoden "Kurir" för staden Moskva. Vidare, om när du väljer leveransmetoden "Gruzovozoff" du tekniskt sett inte kan acceptera betalning med "Kontant vid leverans", behöver du inte visa denna betalningsmetod för leveransmetoden genom "Gruzovozoff". Jag tror att logiken här är klar.
Det är samma sak med "lokalbefolkningen". Det är omänskligt att en lokal köpare som vill hämta en beställning själv (om han har valt "Pickup") att tvingas fylla i fälten "Adress" och "Postnummer". Därefter, när Pickup väljs, bör vi inte visa att kundens betalningsmetoder som inte är tillgängliga för Pickup. Det blir konstigt om köparen vid hämtning väljer att betala kontant genom Euroset.
Även om detta förhållande mellan fält vid första anblicken kan verka förvirrande, är allt i verkligheten väldigt enkelt. Speciellt om den här funktionen stöds i CMS. Så, i min favorit CMS 1C-Bitrix, liknande design beställning i onlinebutiken, konfigurerad med musen på 10-15 minuter. Utan några problem kan du ange för vilken stad vilka fält som ska visas, vilka leveranstjänster och betalningsmetoder som ska anslutas, etc. Dessutom behöver inte beroendet vara av staden som köparen kommer ifrån. Beror på fraktsätt. Jag valde "Pickup" - du kommer inte att se några extra fält i betalningsmetoderna. Samtidigt, från kundens sida, ser allt logiskt ut, det finns inga frågor "varför fyller jag i adressen" om jag hämtar beställningen själv, etc.
"Länkade fält" kan ha tillämpningar utöver att bara förbättra användbarheten i kassan. Kan visas för olika städer olika sätt leverans. Det finns till exempel en bekväm leveranstjänst som endast levererar till 15 städer med en befolkning på över en miljon. Du kan konfigurera den här tjänsten så att den endast är tillgänglig för köpare från dessa städer.
Det verkar som att ovanstående är uppenbart. Men i många nätbutiker tillämpas inte dessa uppenbara saker och som ett resultat av att ta emot och lägga en beställning har så många fält, genom att fylla i vilka du inte bara kan beställa skönhetsprodukter, utan också få ett utländskt pass :-).
Alla har säkert läst de populära fallen där i stora amerikanska butiker (Amazon, Zappos, eBay), genom att byta två blanketter, tiodubblades konverteringsgraden. Vanligtvis ges sådana exempel till förmån för behovet av att göra så få fält som möjligt vid beställning.
Fallen är vackra och väcker intresse. Men de har vanligtvis ingen bakgrund. Låt oss ta ett exempel där två formulär byttes ut på kassasidan.
Tror du att de inte ändrades slumpmässigt, utan baserade på något slags antagande?
Låt oss försöka ge ett exempel på ett sådant antagande. Tror du (med tanke på vad som sades ovan om fältens ömsesidiga beroende) att det är en skillnad mellan vad som ska visas på beställningssidan först av allt: fältet "Postnummer" eller fältet "Stad"? Vid första anblicken är det ingen skillnad.
Låt oss nu lägga till de initiala uppgifterna från exemplet som beskrivs ovan, när butiken ligger i St. Petersburg. Det finns självhämtning, den levererar med bud endast i St. Petersburg och skickar beställningar till andra städer via post- och transportföretag ( budleverans Nej). Spelar det någon roll vilket fält som kommer först, postnummer eller stad?
Ja, nu finns det. Dessutom, ny information påverkar i hög grad hela beställningsprocessen. Nu måste vi göra ett antal fält beroende. Fältet "Stad" bör nämligen vara det första. Även om fältet "Stad" inte är ifyllt, visar vi inte fälten "Postnummer", "Adress", "Leveransmetoder" och "Betalningsmetoder". De visas först efter att någon annan stad än "St Petersburg" har valts. För i St Petersburg levererar butiken, som vi sa ovan, endast med hämtning och bud. Och i så fall behöver han inte sitt postnummer och adress från klienten (fyll i två färre fält samtidigt).
Låt oss titta vidare på vad mer som har förbättrats. Vi visar inte heller alla leveranssätt och betalningsmetoder, utan visar bara de som vi faktiskt kan acceptera. För Peter, som nämnts ovan i exemplet, är detta vid mottagande betalning kontant eller per bankkort. För utländska medborgare vars beställningar kommer att skickas via transportföretag, naturligtvis kommer det inte att ske någon "förskottsbetalning". På så sätt räddade vi kunden från onödig förvirring med att välja bland alternativ som uppenbarligen inte är tillgängliga för honom, och vi räddade butikschefen från onödiga, relaterade frågor och kundmissnöje.
Genom att helt enkelt lägga till ett förhållande av fält till kassasidan är det möjligt för ett antal användare att minska antalet fält som krävs att fylla i, minska negativiteten i samband med missförstånd av vissa punkter angående betalning och leverans, och som en resultat öka vagnkonverteringen. Ingen tvivlar på att antalet försäljningar är relaterat till varukorgens användbarhet?
Kolla inlägget om att lägga en beställning utan att registrera dig i Bitrix. Den kompletterar den här artikeln perfekt.
