Hemsida (eller hemsida) design är den visuella och strukturella designen av den första sidan på en webbplats som besökare ser när de besöker webbplatsen första gången. Hemsidan spelar en nyckelroll för att skapa det första intrycket av sajten och hjälper besökare att hitta den information de behöver eller navigera vidare genom resursen.
1. Design av Shopifys hemsida
Som många av de andra målsidorna i det här inlägget, exempel på målsidan Shopify gör det enkelt. Till exempel är den användarfokuserade rubriken bara några få ord, och sidan förlitar sig på enkla punkter snarare än stycken för att förmedla detaljerna och fördelarna med rättegången. Det finns bara ett fåtal fält som behöver fyllas i innan du börjar. Allt detta gör det lättare för dig att sälja online med ditt verktyg.
2. Design av munkorgshemsida
Målsidor hjälper användarna att avgöra om din produkt eller tjänst är värd sin värdefulla tid och energi. Vilket bättre sätt att kommunicera ditt värdeförslag tydligt och direkt än att matcha dina besökare med själva problemet som din app löser?
Instagram-kommentarer blir fler
NospartiEn Mac-app som tystar aviseringar på skärmen täcker detta helt visa utan att berätta mentalitet på deras minimala målsida. Besökare på den här sidan möts av en snabb brand av besvärliga meddelanden i det övre vänstra hörnet av skärmen. Animationen är inte bara rolig, utan förmedlar också på ett övertygande sätt applikationens användbarhet utan långa beskrivningar.
3. TransferWise Hemsida Design
TransferWise låter dig skicka och ta emot pengar i flera valutor, och dess målsida, som visas nedan, delar upp varje enskild åtgärd så att du inte distraheras av alternativ som inte gäller dig.
Om du vill skicka pengar kan du fylla i överföringsformuläret. För att ta emot pengar, gå helt enkelt till fliken i mitten och för att registrera dig för TransferWise med ditt betalkort, gå till fliken längst till höger.
Varje flik på den här målsidan skapar sin egen uppmaning till handling beroende på vad du registrerar dig för - var och en med en ljusgrön ram för att markera ditt nästa steg efter tre möjliga startpunkter.
4. Design av Airbnbs hemsida
För att hjälpa till att omvandla besökare till värdar, Airbnb erbjuder lite frestande anpassning: en grov uppskattning av genomsnittliga intäkter baserat på din plats. Du kan ange ytterligare information om din potentiella placering i fälten för att få en ännu mer personlig bedömning.
Om du redan har besökt en sida du är övertygad om gör en tydlig uppmaning överst på sidan det enkelt att konvertera på plats.
5.Teambit
udda är vanligtvis inte det första ordet som kommer att tänka på när du tänker på HR-programvara, men Teambits visuella landningssida är just det. Ett enkelt formulär med ett fält åtföljs av ett bedårande kontor fullt av djurkaraktärer - alla mycket nöjd med Teambit om du är intresserad. Ett tecknat djur visas bredvid varje informationsavsnitt på målsidan, vilket lockar besökare att scrolla ner för att lära sig mer. Hemsida design
Landningssida Teambit är ett bra bevis på att du inte behöver ha en "rolig" produkt eller tjänst för att skapa en rolig målsida.
6. Wistia Hemsida Design
Först och främst är detta målsidan Wistia för deras gratis Wistia-konto. Omedelbart lägger du märke till formuläret med ett fält för att skapa ett konto - den blå bakgrunden med minimal design kontrasterar fint med det ljusa vita formulärfältet.
Längden på formulärfältet i kombination med framträdande placering eliminerar nästan all friktion när du skapar ett konto... men om du är osäker kan du alltid scrolla nedan för att läsa FAQ. Genom att separera de två med en stark färgkontrast gör Wistia konverteringsprocessen mycket enklare.
7. Webbflöde. Hemsida design
WebFlow, ett designverktyg för webbutvecklare, packar mycket information i en GIF och tre formulärfält. Det skulle vara trevligt att ha hela registreringsformuläret på en rad - det gör inte bara sidan kortare, utan att fylla i varje fält från vänster till höger visar användarna hur nära de är att klicka på den fjärde blå knappen och komma igång gratis.
Den animerade GIF-filen under formuläret visas i samma ram på webbplatsen så att användarna kan se hur produkten fungerar. и registrera dig utan att rulla eller gå till en ny sida.
E-bok hemsida design
8. Nauto Hemsida Design
Nauto, en självkörande bildataplattform, hjälper till att göra autonom körning säkrare för företag som hanterar flottor. Naturligtvis kommer hans kunder att behöva all information för att sälja på denna plattform. Nauto har det superenkelt e-bok, vars målsida ger dig ett kort kontaktformulär och förhandsgranska statistik för att bevisa varför denna resurs är så viktig.
Den gröna knappen "Ladda ner nu" kan till och med ha varit avsiktlig (grön betyder trots allt "gå").
Scrolla nedåt och du kommer att se en annan "Hämta eBook" CTA för att påminna användarna om vad som finns i butiken. Du kommer också att se tre skakande bilolycksstatistik för att uppmuntra användare att lära sig mer. Kolla in det nedan.
9. Industrial Strong Marketing Hemsida Design
Den här målsidan lockar mig omedelbart med sin oemotståndliga, slagkraftiga rubrik: "Gör mig inte zooma." Detta talar direkt till den allmänna upplevelsen de flesta av oss har när vi bläddrar igenom våra telefoner eller surfplattor – och det är lite fräckt också.
Men det är inte det enda som fick mig att intressera mig för den här målsidan. Lägg märke till hur den röda färgen är strategiskt placerad i toppen och botten av formuläret, vilket drar dig ännu närmare konverteringshändelsen.
Dessutom är den här designen meta att starta: den ser ut och fungerar bra på Mobil enheter. Tänk på att många besökare kommer att komma åt dina målsidor på sina smartphones eller surfplattor, och om design av din webbplats inte passar dem kan de ge upp och lämna din sida.
Specialister inom Industrial Strength Marketing gjorde fältet teckensnitt och former tillräckligt stora för att besökarna inte behöver till exempel zooma för att läsa och interagera med innehållet.
10. Velaro Live Chat
Ibland gör de minsta detaljerna den största skillnaden. Det är till exempel de som gör målsidan Velaro livechatt Fantastisk.
Den lilla PDF-symbolen ovanför objektbilden hjälper till att avgöra vilket format nedladdningen kommer att vara i. En pil före underrubriken hjälper till att ytterligare markera den viktiga kopia som besökarna vill läsa. Liksom IMPACT har de också en automatiskt markerad kryssruta för prenumerationer till nyhetsbrevet på deras formulär - vilket, om det omvandlas till en extra kryssruta, är ett utmärkt sätt att öka antalet prenumeranter. Alla dessa små, till synes obetydliga detaljer bidrar till en solid, fantastisk design av målsidan. Hemsida design
11. IMPACT Branding och design / Hemsidadesign
Hemsida INVERKAN har länge varit en inspirationskälla för designers. Jag älskar den enkla sidlayouten, från den stora titelkopian och den detaljerade bilden, till konturen som omger formen, till färgerna och typsnitten som är mycket tilltalande för ögat.
Den kostnadsfria manualen IMPACT erbjuder för nedladdning här markerar inte heller själva nedladdningen i den blå knappen som låter dig skicka in det ifyllda formuläret. Snarare inbjuder IMPACT dig att "generera fler konverteringar" genom att fokusera på vad du kan vinna på att läsa guiden.
Målsidor för att lära dig mer
12. Unbounce
Inte konstigt att Unbounce är överst på den här listan - de skrev verkligen boken om att skapa målsidor med hög konvertering. Även om det finns många fantastiska saker med den här målsidan, två som jag verkligen gillar är: 1) användningen av en chattruta istället för ett klassiskt formulär, och 2) den detaljerade - men välpaketerade - informationen under formuläret/Hem Siddesign
Den första hjälper till att rikta uppmärksamheten mot syftet med sidan – för att du ska fylla i ett formulär – på ett sätt som är diskret och inte känns som ett jobbigt. Den andra ger sidan en SEO-boost (sökmotorer kommer att ha mer innehåll att genomsöka) och tar bort ångest från människor som behöver veta mer om ett innehåll innan de skickar in sin information, utan att distrahera människor från chattfönstret.
13. Bills.com. Hemsida design
Människor tänker ofta på målsidor som statiska sidor på din webbplats. Men med rätt verktyg kan du göra dem interaktiva och personliga.
Ta exemplet nedan med Bills.com. För att ta reda på om du skulle ha nytta av deras konsultation, svara på tre frågor innan du visas formuläret. Det börjar med detta:
Sedan svarar du på ytterligare två frågor som den nedan:
Och här är det sista målsidesformuläret där du fyller i din information:
Jag är inte säker på hur algoritmen fungerar (eller om det finns en alls), men när jag fyllde i den hade jag en viss oro över ingen kvalifikationer. När jag fick reda på vad jag gjorde var jag glad att fylla i formuläret, vilket jag är säker på att de flesta som har skulder och använder det här verktyget gör. Genom att göra detta erbjudande mer exklusivt innan formuläret visas på målsidan, slår jag vad om att Bills.com kommer att göra det betydligt ökad konvertering.
14. Trulia Hemsida Design
Trulia gjorde något som liknar Bills.com med sin målsida. Det börjar med ett enkelt formulär som frågar efter "adress" (vilket låter mindre läskigt än "din adress", även om det är vad de menar). Under detta enkla formulärfält finns en ljusorange knapp som kontrasterar bra med karaktärsbilden bakom formuläret och understryker att uppskattningen kommer att anpassas till ditt hem.
Självklart räcker inte adressen i sig för att uppskatta husets värde. Det betecknar helt enkelt husets omgivningar. Det är därför som nästa sida innehåller ytterligare frågor om själva fastigheten, som antalet bäddar och bad. Nedan kan du se en kopia av "Tell Us Where to Send the Report" - med ansvarsfriskrivningen att du genom att ange denna information samtycker till att kontakta fastighetsmäklaren. Detta är ett bra exempel på hur ett företag värdesätter sina besökare från första början, samtidigt som det ställer besökarnas förväntningar på vad som kommer att hända som ett resultat.
15. Landbot Hemsida Design
landbot, en tjänst som skapar chatbotbaserade målsidor, placerar sin egen produkt i centrum på sin chattbaserade målsida. Besökare möts av en vänlig bot – komplett med emojis och GIFs – som uppmuntrar dem att tillhandahålla information i ett konversationsformat snarare än den traditionella formen.
16. Webprofits
För en liten kontrast... vad sägs om långa målsidor? Med bara några få knep kan du få även den längsta målsidan att se kort ut. Webprofits målsida nedan visar hur du gör detta. Hemsida design
Det finns en framträdande CTA-knapp uppe till höger för att lära dig mer - med bra kontrast på bakgrunden för att få den att sticka ut, och en nedåtpil för att uppmuntra rullning. Genom att inte placera formulärfältet framme hjälper de till att minska friktionen och ger besökarna möjlighet att lära sig mer innan de får ett konverteringsalternativ.
De låter dig också förstå vad som verkligen är gör Webprofits . Resten av sidan innehåller information om vad du kommer att få när du skickar in din information. Dessutom innehåller den strategiska CTA:er som hjälper dig att navigera tillbaka till toppen för att fylla i formuläret, till exempel "Let's Talk".
17. H.BLOOM
Ibland behöver du bara stanna upp och beundra en målsida för hur vacker den är. När du använder ett högupplöst foto och mycket vitt utrymme på målsidan H.BLOOM trevlig att titta på.
Utöver sin skönhet har sidan några fantastiska konverteringselement: ett overheadformulär, en tydlig och kortfattad beskrivning av vad som kommer att hända när du fyller i formuläret och till och med en ljusorange "Skicka"-knapp. Det enda vi kommer att ändra på? Kopiera på knappen Skicka – Detta kan vara mer specifikt för det förslag som erbjuds. Hemsida design
18. Conversionlab
Även om jag inte skulle inkludera ett exempelformulärinlägg i ett inlägg om målsidor, är den här webbplatsen speciell. Hemsida är hela webbplatsen - navigeringslänkarna tar dig helt enkelt till informationen nedan. Hemsida design
När du klickar på "Få hjälp på målsidor" flyttas hela webbplatsen för att göra plats åt formuläret. Så här ser det ut innan du klickar:
Och när du klickar på den CTA, kolla in hur formuläret ser ut:
Jag gillar att du inte behöver lämna sidan för att fylla i formuläret, men formuläret kommer inte att vara påträngande för tillfälliga webbplatsbesökare.
Idéer/hemsidadesign
En väl optimerad hemsida kan förvandla kunder till potentiella kunder genom att fånga information som hjälper dig att bättre förstå, marknadsföra och glädja dina besökare. Eftersom målsidor är avgörande för omvandlingar är det viktigt att se till att de är välplanerade, designade och utförda. Här är några saker att tänka på när du skapar målinriktad sidor: Attraktiv estetik: Endast färgen på din målsida och ett rent användargränssnitt kan hjälpa. Besökare kommer att vilja lära sig mer om dina produkter och se bevis på värdet du erbjuder. Ta en titt på #10 på vår lista, Inbound Emotion, för ett bra exempel på en fantastisk webbsida.
Less is more: Låt meningen eller bilderna göra det mesta, men se till att inkludera alla beskrivande rubriker och stödjande text för att göra din målsida tydlig och övertygande. Detta gäller nästan alla komponenter på sidan: vitt utrymme, enkel kopia och kortare formulär.
Hemsida design
Håll besökare på sidan: Genom att ta bort huvudnavigeringen eller eventuella distraherande bakåtlänkar är det mindre sannolikt att det är någon form av leadsgenererande friktion som kan få besökare att överge din sida.
Dela på sociala nätverk. Ett enkelt sätt att locka besökare till din målsida är att använda delningsknapparnasociala nätverk, så att de kan distribuera ditt innehåll till sina följare på sociala medier. När allt kommer omkring är kunderna i centrum för ditt marknadsföringssvänghjul.
A/B-testning: Målsidor är viktiga för att utföra korrekt, och eftersom konsumentpsykologi ibland kan vara överraskande är det alltid bäst att experimentera med olika versioner av dina sidor för att se vilken som har högst konverteringsfrekvens (CVR). Kontrollera placeringen av erbjudandet, typerna av CTA, eller till och med färgschemat.
Call-To-Action: CTA, där köttet finns på landningssidan, eller vändpunkten, där utsikterna att bli kontakter finns. CTA:er kan be besökare att prenumerera, ladda ner, fylla i ett formulär, dela vidare sociala nätverk etc., men i allmänhet är CTA:er nödvändiga för att engagera din publik mer aktivt med ditt erbjudande. För att generera leads måste CTA:er vara djärva och engagerande, men viktigast av allt måste de förmedla värde effektivt.
Оставить комментарий