Startsidan är inget galleri eller en broschyr. Den är en vägvisare. Dess enda uppgift är att få rätt besökare till rätt produkt så snabbt som möjligt. Varje designbeslut på startsidan ska tjäna det målet.
Den här artikeln går igenom hur du utformar en startsida för webbutiken som fungerar. Vad du ska ha med, vad du ska lämna utanför, vilka misstag som förstör konverteringen och hur du tänker kring layouten på mobil, där de flesta av dina köpare tittar runt.
Om du vill ha hela bilden av vilka sidor din butik behöver, börja med vilka sidor varje webbutik behöver.
Vad är startsidan egentligen till för?
Startsidan vänder sig till besökare som inte har bestämt sig än. De vet något om ditt varumärke, eller så hittade de dig via sök eller sociala medier, men de har inte bestämt sig för att köpa. Startsidan är ögonblicket då de avgör om de ska gå vidare.
Den behöver besvara tre frågor direkt. Vad säljer den här butiken? Är den till för någon som jag? Vad ska jag göra härnäst? Om något av de svaren är oklart lämnar besökarna. Inte för att dina produkter är dåliga, utan för att startsidan inte gav dem en anledning att stanna.
Så utformar du hero-sektionen
Hero-sektionen är det första en besökare ser. Den ligger högst upp, innan besökaren scrollar, och bär det mesta av det första intrycket.
En stark hero-sektion har fyra delar. En rubrik som anger vad du säljer på enkelt språk. En kort stödjande rad som ger sammanhang, ofta en viktig fördel eller något som skiljer dig från andra. En bild som visar produkten eller resultatet den ger. En enda knapp för uppmaning till handling som talar om exakt vart besökaren ska gå.
Rubriken är den viktigaste delen. Håll den specifik. "Handgjorda läderväskor för vardagsbruk" fungerar. "Där hantverk möter funktion" gör det inte. Köpare skummar snabbt. Om din rubrik kräver tolkning har du redan tappat dem.
Knappen ska ange en destination, inte en känsla. "Köp väskor" eller "Se nyheter" fungerar. "Upptäck mer" eller "Utforska nu" gör det inte. Ge besökaren en riktning, inte ett förslag.
Din hero-bild ska visa produkten tydligt. Miljöbilder fungerar bra när produkten behöver sammanhang för att ge mening, som kläder eller hemartiklar. Bilder på enbart produkten fungerar bättre när tydlighet väger tyngre än känsla, som för verktyg eller elektronik. Använd bilder av hög kvalitet. En suddig eller dåligt belyst hero-bild undergräver allt annat.
Vad du ska lyfta fram under hero-sektionen
När en besökare scrollat förbi hero-sektionen letar hen efter mer specifika skäl att stanna. Den här delen av startsidan ska lyfta fram produkter eller kategorier som matchar det dina köpare mest sannolikt vill ha.
Försök inte visa allt. Välj dina bästsäljare, dina produkter med högst marginal eller den kategori som de flesta av dina köpare hamnar i. Tre till sex utvalda produkter är ett rimligt intervall. Fler än så börjar se rörigt ut och skapar beslutsförlamning.
Kategoriblock fungerar bra för butiker med brett sortiment. I stället för enskilda produkter, visa de tre eller fyra viktigaste kategorierna med en tydlig bild och etikett för varje. Låt köpare välja rätt avdelning i butiken själva.
Det utvalda avsnittet bör också vara levande. Byt ut mot säsongsprodukter, reavaror eller nyheter. En startsida som aldrig ändras ger återkommande besökare ingen anledning att scrolla.
Så använder du social bekräftelse på startsidan
Köpare litar mer på andra köpare än på butiker. Social bekräftelse på startsidan bygger trovärdighet innan en besökare når en produktsida.
De mest effektiva formerna av social bekräftelse på startsidan är korta kundrecensioner eller stjärnbetyg, antal kunder eller antal skickade beställningar, omnämnanden i pressen eller mediernas logotyper och förtroendemärken från tredje part som ikoner för säker betalning eller kända certifieringsmärken.
Håll det kortfattat. Ett eller två starka omdömen är effektivare än en vägg med femstjärniga recensioner. En enda presslogotyp från ett välkänt medium gör mer än en lista med tio okända namn. Välj den bekräftelse som betyder mest för den köpare som är mest skeptisk till att handla av dig för första gången.
Bör du ha med ett avsnitt om varumärkets historia?
Ett kort avsnitt om varumärkets historia på startsidan är valfritt, men det hjälper i vissa sammanhang. Det fungerar bäst när grundarens historia är en del av skälet till att en köpare väljer det här varumärket framför ett större. Handgjorda varor, etiskt inköp, gemenskapsdrivna varumärken och produkter som drivs av grundaren tjänar alla på ett kort mänskligt ögonblick på startsidan.
Om du tar med ett, håll det kort. Två eller tre meningar och en länk till hela Om oss-sidan räcker. Placera det inte högst upp eller ovanför de utvalda produkterna. Historien ger värme, men produkterna driver besluten.
För butiker där produkten talar för sig själv, hoppa över historien. En sida som säljer standardvaror behöver ingen ursprungshistoria. Använd utrymmet till mer exponering av produkter i stället.
Vad startsidan inte behöver
Röra på startsidan är lika skadlig som ett saknat avsnitt. Varje del som inte gör något jobb tar uppmärksamhet från något som gör det.
Vanliga misstag på startsidan är för många uppmaningar till handling som konkurrerar på samma nivå, videor eller animeringar som spelas automatiskt och gör sidan långsam, stora textblock som ingen läser, en navigeringsmeny med fler än sex eller sju poster och popups som dyker upp innan besökaren hunnit se något.
Varje extra val du tvingar på en besökare är en liten friktionskostnad. Startsidan ska kännas tydlig, inte stökig. Om du inte kan välja mellan två delar, ta bort den som inte är direkt kopplad till att få en besökare till en produkt.
Utformning av startsidan på mobil
Mer än hälften av all e-handelstrafik kommer från mobil. Din startsida bör byggas för mobil i första hand, inte anpassas från datorn i efterhand.
På mobil ska hero-rubriken vara så kort att den går att läsa på två rader. Knappen ska vara tillräckligt stor för att lätt kunna tryckas. Produktbilder ska staplas rent i en enda kolumn. Navigeringen ska fällas ihop till en meny som inte dominerar skärmen.
Testa varje ändring av startsidan på en telefon innan du publicerar den. Det som ser rent ut på en datorskärm kan bli en förvirrande scrollning på en liten skärm. Köparupplevelsen på mobil är din främsta designbegränsning, inte en efterhandstanke.
Tydlighet kring frakt spelar också roll på mobil. Köpare på telefoner är ofta nära ett köpbeslut. En synlig banner som visar gränser för fri frakt eller beräknad leverans på startsidan kan förvandla ett besök där man tittar runt till ett köp. Mer om hur du sätter upp frakt för din butik finns i hur du sätter upp frakt för din webbutik.
Så stöder WEMASY utformningen av startsidan
WEMASY:s e-handelssystem har layoutverktyg för startsidor byggda för webbutiker. Hero-sektioner, rutnät med utvalda produkter, kategoriblock och avsnitt för social bekräftelse finns alla utan egen kod. Samma system hanterar mobillayouten automatiskt.
Se vilka verktyg för startsida och butik som finns i varje nivå på sidan WEMASY:s priser.
Vanliga frågor
Hur många uppmaningar till handling bör en startsida ha?
En primär uppmaning högst upp, sedan sekundära längre ner på sidan kopplade till specifika avsnitt. Den primära uppmaningen ska vara den viktigaste handlingen du vill att en förstagångsbesökare tar, oftast "Köp nu" eller en länk till en specifik kategori. Konkurrerande primära uppmaningar med samma visuella vikt späder ut uppmärksamheten och minskar klicken på alla. Med WEMASY:s webbplatsbyggare kan du ställa in detta direkt i din butik.
Ska jag visa priser på startsidan?
Inte nödvändigtvis på själva startsidan, men det är bra att visa priser på de utvalda produktkorten. Köpare skummar prisintervall för att avgöra om en butik ryms inom deras budget. Att dölja priser tills produktsidan skapar friktion och kan kännas undvikande. Om dina produkter är exklusiva sätter ett pris från positiva förväntningar i stället för att skapa en överraskning.
Hur ofta bör jag uppdatera startsidan?
Uppdatera utvalda produkter och säsongsavsnitt när du har nyheter, en pågående kampanj eller när säsongen ändrar vad köpare letar efter. Hero-sektionen kan vara stabil längre, men uppdatera den när ditt huvudsakliga erbjudande eller din positionering ändras. En startsida som ser likadan ut ett helt år signalerar en butik som inte är aktiv.
Påverkar startsidans laddningshastighet försäljningen?
Ja. En startsida som tar mer än tre sekunder att ladda på mobil förlorar en betydande del av besökarna innan de sett något. Stora okomprimerade bilder är den vanligaste orsaken. Komprimera bilder innan du laddar upp dem, undvik video som spelas automatiskt i hero-sektionen och begränsa skript från tredje part. Hastighet är ett designbeslut för startsidan, inte bara ett tekniskt.
Ska startsidan länka till varje produktkategori?
Inte nödvändigtvis. Länka till de kategorier som de flesta av dina köpare vill ha. En navigeringsmeny kan rymma hela listan över kategorier. Startsidans innehåll ska lyfta fram de kategorier som ger flest konverteringar eller som du vill prioritera. Att länka till allt skapar visuellt brus och späder ut de sidor som betyder mest.
Var ska förtroendemärken placeras på startsidan?
Nära hero-sektionen, intill knappen, eller i ett eget förtroendefält mellan hero-sektionen och de utvalda produkterna. Köpare letar mest efter förtroendesignaler i det ögonblick de överväger att klicka på en knapp. Märken som bara placeras i sidfoten når bara köpare som redan scrollat till botten, vilket är för sent för de flesta förstagångsbesökare.