människor har förutspått ”hemsidans död” i flera år.
men hemsidan kommer aldrig att försvinna.
varje webbplats behöver en ytterdörr för att välkomna sina nya användare för första gången och ge dem lay of the land.
hemsidan utvecklas dock.
även för några år sedan innehöll hemsidor massor av olika uppgifter om varje aspekt av företaget.
de var fastnat full av länkar och platser att gå., Företaget ville lyfta fram alla de olika aspekterna av vad det gjorde.
problemet är att det misslyckades.
det fanns helt enkelt för många alternativ. Det var överväldigande och störande för användarna.
ett av de bästa sätten att snabbt förbättra webbplatsdesign omvandlingar är genom att ditching de funktioner som förringa användarupplevelsen.
karusellreglage är ett perfekt exempel. De används ofta för att visa upp flera olika saker på en gång.
men denna mångsidighet kommer ofta till en kostnad. Tester har visat att de skadar konverteringar, SEO och sidladdningstider.,
ser du den låga klickprocenten i bilden ovan? Det är inget bra tecken.
det är faktiskt hela anledningen till att jag skapade Crazy Egg. Om du kan se att användarna inte klickar på vad de ska, kan du ändra designen innan det är för sent.
de bästa hemsidorna tar hänsyn till användarupplevelsen.
Här är några av mina favorit hemsida mönster. Du kan börja kopiera dem för att få liknande resultat.
Bills.com
den första stora trenden att markera är startsidan som målsida.,’
det är mycket meningsfullt när du tänker på det.
ditt slutmål är att driva upp leads och försäljning. Webbplatsen ”online broschyr” har varit död och borta i flera år.
den knepiga delen är att veta det bästa sättet att generera leads på Hemsidan så att du inte skrämmer bort alla och tvingar dem att studsa.
det är till exempel mycket att fråga helt nya besökare som aldrig ens har hört talas om dig att köpa någon stor produkt.
så istället behöver du ett enklare, mindre invasivt tillvägagångssätt för att i slutändan få vad du vill ha.
och det är därför jag älskar vad Bills.com Det går.,
till exempel, gå över till deras webbplats, och du kommer att se följande reglage:
Nu kan du interaktivt glida fram och tillbaka för att välja det skuldbelopp du kan vara skyldig. Det är så enkelt att ett barn kan göra det.
det är också det enda alternativet de ger dig hittills! På så sätt känner du dig inte överväldigad eller blir distraherad.
Efter att ha klickat på ”Fortsätt” frågar de dig om du är bakom på betalningar eller inte (och i så fall hur länge).
de kvalificerar dig här., Om du inte är bakom på betalningar, kanske de inte kan hjälpa dig mycket (läs: tjäna pengar från dig).
de kan använda denna fråga för att anpassa svaret de så småningom kommer att ge dig. Det kan även hjälpa internt dela upp vilken person eller avdelning som är bäst att hantera ditt fall om du blir kund.
nästa steg är att välja vilket tillstånd du bor i:
detta kvalificerar dig ytterligare och väcker också eventuella problem med statliga begränsningar (som de kan behöva hantera senare).,
det allra sista steget är det de ville ha hela tiden: din personliga information!
KlientBoost kallar detta ”Breadcrumb Technique”, för istället för att skrämma bort människor med den ursprungliga formen får du dem att göra små mikroåtaganden.
varje mikroåtagande tar dem lite längre fram tills de redan är så investerade att de måste slutföra processen.
till exempel, om de skulle ha bett om ditt namn och telefonnummer på framsidan kan det ha skrämt dig.,
men genom att få dig att åta sig att de andra stegen först, de ger sig ett bättre skott på så småningom konvertera dig till en ny kund.
KlientBoost har framgångsrikt använt denna teknik för att öka omräkningskurserna från 1% till nästan 20%.
tricket med dessa målsidor i flera steg är att börja med den minst hotande frågan som är möjlig.
det måste relateras till hur du i slutändan kommer att hjälpa dem. Det bör dock vara otroligt enkelt för någon att tillhandahålla.,
självklart bör det finnas noll omnämnande av pris eller deras personuppgifter vid denna tidpunkt.
det kan till och med vara så enkelt som att be om ett Postnummer.
nästa steg blir lite mer specifikt, vilket tyder på servicenivån de kommer att behöva.
Efter att ha fått dem att engagera sig i de två första stegen kan du ta upp några fler personliga frågor att följa upp med dem efteråt.
Du kommer att märka att Bills.com använder också interaktivt innehåll för att hålla dig engagerad på deras webbplats.
Qzzr är ett verktyg som du kan använda för att få detta att hända på din egen webbplats., De har redan färdigbyggda ”widgets” som kan ställas in på några minuter (i motsats till att betala en utvecklare till anpassade göra det åt dig).
Victoria ’ s Secret använder en som frågar ”Vad är din fitness persona?”Food Network frågar,” Kan vi gissa din ålder baserat på dina matpreferenser?”
i varje fall använder dessa märken en rolig fråga som får dig engagerad. Det finns inget hot i att svara på dessa frågor från början.
ett annat alternativt verktyg är SnapApp., De skapar också interaktiva räknare och även infographics som människor kan peka, klicka och justera för att se nya resultat.
här är ett roligt exempel på hur förgäves din marknadsföring är som får dig att svara på frågor på ett flödesschema sätt.
en slutlig verktygsrekommendation är Brackify. Det namnet låter som ”parentes”, eller hur?
Tja, det är precis poängen! Du kan skapa interaktiva konsoler eller tävlingar för nästan vad som helst, och låta kunder eller besökare komma in på åtgärden.,
Så här ser det ut om någon frågade vad din favorit Disney-film är:
Kiva
Kiva är en mikrolänkande plattform.
de förbinder entreprenörer i länder i tredje världen med givare och sponsorer från andra delar av världen.
till exempel, låt oss säga att en entreprenör i Indien behöver $1,000 för en ny kommersiell symaskin så att de kan producera och sälja dubbelt så många produkter.,
så att människor från hela världen kan donera i små mängder och sedan få betalt tillbaka under ett år eller två av det nya kassaflödet som entreprenören kan generera.
kivas hemsida är relativt grundläggande, för att vara ärlig.
men som vi har sett är det OK!
enkel och direkt kan hålla människor fokuserade på vad som är viktigt (ger dig deras information i utbyte mot något av värde).,
problemet är att medan människor kan besöka din hemsida och vara intresserade av vad du gör, det finns inte alltid en tvingande anledning att kickstart denna process.
Ibland måste du vara lite mer aggressiv eller självsäker för att låta dem veta om det fantastiska värdet de kan få.
i detta fall, Kiva beslutat att använda en popup overlay för att helt enkelt få nyhetsbrev opt-ins.
de ville börja små (och inte använda något hotande som vi lärde oss i det sista steget).,
så Kiva gick med ett enkelt e-postalternativ för att åtminstone få något från någon innan de studsade och lämnade webbplatsen.
Så här såg det nya erbjudandeöverlägget ut:
överlagringar som detta är svåra att dra av.
vissa målgrupper hatar dem, uppenbarligen. Men det kan betala stora utdelningar om du placerar ditt innehåll och erbjuder bra.
Du kan också styra hur eller när det visar. Till exempel kan du bestämma dig för att bara utlösa den till nya besökare (mot återkommande) och bara när markören börjar flytta ut ur fönstret.,
dessa skapar ofta en ”lightbox” -effekt som betonar allt annat i bakgrunden så att människor ser rakt på ditt nya erbjudande.
Här är ett annat exempel på det jag använder för kommande webbseminarier:
det kommer alltid att finnas en procentandel av din publik som hatar dessa saker.
så du måste vara försiktig med hur du använder dem. (Du måste också se upp för design misstag som kommer att förstöra din SEO samt.)
resultaten kan dock ofta vara värda risken.,
Kiva bestämde sig för att dela upp testet för att se hur deras egen publik svarade.
de kopplade upp Unbounce med MailChimp (för eventuella e opt-ins) och bestämde sig för att visa den nya överlagringen till endast 50% av trafiken från början. Det kom ut till cirka 5000 besökare.
Just det enda överlagret fångade en extra 3-4% av besökarna direkt från fladdermusen.
uppmuntras, Kiva höll iteration med bättre mönster och olika alternativ för att fördubbla det antalet till 6-7%.
inte illa för en ”irriterande” dyker upp, eller hur?
H. Bloom
vad exakt är H. Bloom?,
de är en lyx blomsterleveransservice. Du kan fortsätta, slå i dina önskemål, och de tar hand om resten.
så de är perfekta för den överarbetade entreprenören att aldrig glömma sina nära och kära.
låt oss ta en snabb titt på deras hemsida, och då ska jag berätta varför jag gillar det så mycket:
först och främst har de sin form ovanför luckan.
det gör målet för den här sidan klart direkt från fladdermusen. Dina kunder slog den här sidan, och de behöver inte gissa om vad de ska göra nästa.,
formuläret som är front-and-center håller saker trevliga och tydliga.
de flesta webbplatsbesökare tenderar att koncentrera större delen av sin uppmärksamhet över vikten fortfarande (även om de blir mer vana vid att rulla ner).
det enklaste sättet att förbättra din lead generation formoptimering är att hålla din CTA i det normala ögonmönstret som människor redan använder.
till exempel gjordes en studie för flera år sedan som spårade hur och var människors ögon spårade när de slog på din sida. De fann att människor tenderar att skanna din webbplats i en” F ” form.,
så den första delen av H. Blooms hemsida berättar omedelbart läsaren vad de ska göra på sidan.
och sedan nästa avsnitt i mitten förklarar exakt hur deras process fungerar.
den logiska, steg-för-steg-progressionen hjälper människor att förstå vad som förväntas av dem och hur svårt eller tidskrävande något sådant är på väg att bli.,
det är kritiskt eftersom det omedelbart ställer in förväntningar och övervinner den potentiella invändningen att det kan vara för tidskrävande att komma igång.
det fungerar på samma sätt som en förloppsindikator.
till exempel har förloppsindikatorer befogenhet att öka konverteringarna med 28%, eftersom de snabbt försäkrar tittaren att det inte finns mycket kvar för dem att göra för att få sin belöning.’
min sista favoritdel på denna sida är den subtila pilen som används som en visuell signal för att hjälpa övergång tittare från ett avsnitt till nästa.,
det är en liten detalj, men det hjälper till att ge användarna meddelandet att fortsätta läsa ner sidan, speciellt om de ännu inte är redo att fylla i formuläret och komma igång ASAP.
Basecamp
innan Basecamp var ”Basecamp” var de 37signaler med flera olika mjukvaruprodukter.
och genom åren har de ständigt itererat för att se vad som fungerar bäst för att köra nya gratis provregistreringar.,
här är en av deras nuvarande hemsida variationer som använder en klassisk copywriting teknik som har funnits i årtionden:
Läs första raden på den sidan riktigt snabbt.
”ditt företag växer och du är översvämmad. Sättet du jobbar på fungerar inte längre.”
de fortsätter att lista några av de olika problem och problem som du (överarbetad företagsägare) förmodligen förväntar sig.
detta är ett läroboksexempel på pas copywriting-tekniken., Så här fungerar det:
- Problem: du skär snabbt till hjärtat av frågan genom att tydligt bekräfta huvudproblemet din utsikter är upp mot (t. ex. ” du är översvämmad.”).
- agitera: då övergår du till att namnge alla de olika smärtpunkterna och symtomen som de för närvarande upplever som ett resultat av det problemet (t.ex. ”röriga e-postmeddelanden och texter”, ”saker som glider genom sprickorna” etc.).
- lösning: nu presenterar du din lösning som Frälsaren som tar bort alla dessa problem för dem (t.ex. ”Det är dags för Basecamp.”).,
Här är en annan snabb titt på den hemsidan nu när du kan identifiera formeln de följer.
För många företag vill starta direkt i funktionerna och fördelarna med sin produkt på hemsidan.
problemet med det är dock att dina webbplatsbesökare inte är riktigt där än.
dessa personer kanske inte känner igen samma problem i sitt liv, så ”lösningen” du säljer dem resonerar inte med dem. De lämnar din webbplats utan att konvertera som ett resultat!,
Du kommer också att märka att denna hemsida är text-tung, vilket är ovanligt jämfört med vissa andra mjukvaruwebbplatser.
det är ett annat trick de har lärt sig efter att ha testat olika versioner under de senaste åren.
för flera år sedan testade de en klassisk långformig målsida och såg ursprungligen ett stort steg i Konverteringar (37,5%).
men de var fortfarande inte nöjda och trodde att de kunde göra bättre.
så de försökte ett annat test, men den här gången med hjälp av en kundreferens mot den ursprungliga designen.,
kunden kom ut på toppen med en 102% konvertering ökning.
de följde sedan upp detta med ytterligare ett test för att se om kopieringslängden hade något att göra med resultaten. (Svar: det gjorde det inte.)
så att du kan se att de fortfarande håller sig till ett text tungt format totalt. Det är dock inte nödvändigtvis längden på den kopian som gör skillnad.
Istället handlar det om de specifika ord som används och den smarta formeln för att se till att deras kunder vet exakt vilka problem Basecamp löser.,
MailChimp
hemsidan för e-postmarknadsföringsföretaget MailChimp presenterar en av de bästa lektionerna i hur man utformar en hemsida som konverterar.
men vid första rodna ser det inte ut så mycket:
En av de första sakerna du märker är att det finns en enda knapp ovanför luckan.
det finns bokstavligen inget annat att klicka här!
minskande alternativ och val har visat sig bidra till att förbättra omräkningskurserna., Tanken är att ju fler beslut du tvingar besökare att göra, ju längre det tar dem att bestämma vad de ska göra (om något).
Mailchimps hemsida erbjuder också en lektion i vitt utrymme (eller negativt utrymme).
till exempel har vi alla försökt läsa ett blogginlägg på en webbplats, bara för att känna att det är för ”trångt” eller rörigt. Det är en massiv röd flagga som din blogg design stinker!
istället bör en väldesignad sida vara öppen och luftig som MailChimp ’ s.
det negativa utrymmet runt din primära CTA bidrar till att öka dess betydelse på sidan., Så människor är nästan tvungna att ägna mer uppmärksamhet åt det.
låt oss rulla ner sidan lite och se hur de spelar med horisontellt avstånd för att också monopolisera din uppmärksamhet.
de använder ett fotograferingstrick som kallas ”tredjedelsregeln” som säger att du ska placera de viktigaste sidelementen mitt i hårkorset.
innehållet i den delen av Hemsidan är off-centrerad av en anledning! Det slutar att forma eller styra hur de vill att du ska visa sidinnehåll i storleksordning.,
På så sätt kan de hjälpa dig att subtilt prioritera en sidhierarki som säger ” Det här är alternativ # 1, det här är alternativ # 2 etc.”
slutsats
de bästa hemsidorna på webben idag kan ha olika mål.
det finns dock alltid en stor som de kommer tillbaka till. Generering.
alla webbplatser idag måste sälja.
det betyder inte att de måste få folk att köpa direkt. Men det måste komma till den punkten så småningom.
de bästa hemsidorna använder olika faktorer, från interaktiva funktioner till design, för att subtilt instruera användaren vad du ska göra härnäst.,
tro det eller ej, detta bör vara i besökarens bästa intresse också.
det hjälper till att förenkla deras liv genom att fatta färre beslut, samtidigt som de får dem till den avsedda destinationen snabbare (så att de kan lösa problemet eller smärtpunkten de upplever).
vad är din favorit hemsida exempel och vad Älskar du om det?
Öka din trafik