Venngage

Lad os være ærlige, det er svært at redesigne dine landingssider. Men at skabe landingssider fra bunden er endnu sværere.

Hvilken slags landingssider er bedst egnet til din branche? Hvilken slags landingsside skal du oprette til en bestemt brugssag? Hvordan opnår du den delikate balance mellem godt landingsidedesign og tekst?

Tro mig, jeg har været der, og jeg har haft de samme spørgsmål. Det, der har hjulpet mig mest i situationer som disse, er at søge inspiration udefra.

I denne guide vil vi dele nogle af de bedste eksempler på landingssider, som vi har fundet online, og som spænder over flere forskellige brancher og brugssituationer.

Her er, hvad denne guide vil dække (klik for at springe videre):

1. Software Landing Page Examples
2. Product Landing Page Examples
3. Ecommerce Landing Page Examples
4. App Landing Page Examples
5. Coming Soon Landing Page Examples
7. Consulting and Agency Landing Page Examples
8. Ebook Landing Page Examples

Vi har også drysset nogle af vores landingssideskabeloner ind, så du kan gå i gang med at oprette dine egne landingssider med det samme!

Søger du inspiration til at pifte dit redesign af landingssider op? Du er kommet til det rette sted.

Hvordan bruger du vores landingssideskabeloner?

Der er masser af måder, du kan bruge vores landingssideskabeloner på. Her er tre af dem:

1. Mockup til din egen landingsside: Det kan være svært at kommunikere med designere eller ingeniører, hvordan dine landingssider skal se ud, medmindre du opretter en mockup af landingssiden for at visualisere og kommunikere dine idéer.
2. Indsaml finansiering til din startup: Din startup har måske ikke en hjemmeside endnu, men det betyder ikke, at du ikke kan rejse penge. En selvfremstillet landingsside mockup, der indgår i dit investor deck, kan bringe din idé til live og overbevise investorerne om at støtte dig.
3. Vind nye kunder til dit bureau: Vil du gerne lukke flere aftaler og lave mere salg? Fokuser på at vise, ikke fortælle. Tilpas en skabelon til en landingsside for at vise kunderne, hvordan deres nye landingsside kan se ud, hvis de samarbejder med dig. Vedhæft den sammen med dit tilbud eller dit forretningsoplæg.

For eksempel er denne e-handelslandingsside optimeret til at drive salg og kan bruges som en mockup til din endelige landingsside:

Skab denne skabelon

Dette er dog kun ét anvendelsestilfælde. Du kan også oprette landingssider for at:

• Overføre besøgende på websites til at tilmelde sig prøveversioner af din software.
• Overtale besøgende til at downloade din mobilapp.
• Sælge dine digitale og fysiske produkter online.
• Validere en ny forretningsidé, før du beslutter dig for at gå all in.
• Generer nye kundeemner til dit bureau eller din konsulentvirksomhed.

Lad os dykke direkte ned i det.

Eksempler på softwarelandingssider

Stripe softwarelandingsside

Når det kommer til softwarelandingssider, er jeg blevet forbløffet over Stripes nylige redesign af landingssiderne.

Stripe er en af de største startups inden for finansielle tjenesteydelser på denne planet, som er stolt af at kunne tre ting meget godt: finans, teknologi og design.

Og deres forkærlighed for godt design og brugeroplevelse afspejles på denne softwarelandingsside:

Kilde

For at være helt objektiv, har deres landingssides design masser af smarte klokker og fløjter.

Jeg taler om gradientanimationen, som kan påvirke sidens hastighed og batteri, dårlig læsbarhed af teksten, uklar og lille call-to-action (CTA) osv.

Dine softwarelandingssider bør holde sig væk fra alt muligt bells and whistles. Mit råd? Hold det simpelt.

Monday sign up landing page

Med hensyn til at holde det simpelt har minimalistisk landingssidedesign indtil videre været en af de mest populære tendenser inden for grafisk design i 2020.

Hvem er bedre at vise frem som et eksempel end Monday? Deres landingsside til tilmelding er ren, minimalistisk og nem at se på:

Kilde

Bonuspoint for de røde CTA’er, der er svære at overse, og de automatisk rullende anvendelsestilfælde i helteafsnittet, der viser alle de måder, som teams og afdelinger kan bruge Monday på.

Venngage software landingssideskabelon

Hvis du ligesom mig var vild med, hvordan Monday greb deres landingssidedesign an, så har jeg en lignende software landingssideskabelon til dig.

Software landingssiden nedenfor er organiseret, minimalistisk og let at læse. Perfekt, hvis du er en nystartet virksomhed, der tilbyder en enkel og brugervenlig software.

Gå i gang og rediger denne software landingssideskabelon lige nu:

Skab denne skabelon

Eksempler på produktlandingssider

TransferWise interaktive landingsside

En anden virksomhed inden for finansielle tjenesteydelser på denne liste? Hvad kan jeg sige, Transferwise’ tilgang til den traditionelle produktlandingsside var for god til at ignorere.

Transferwise er hurtigt blevet en af de nemmeste måder at sende og modtage penge i udlandet på, og deres eksempel på en interaktiv produktlandingsside er det, der også gjorde mig til kunde:

Kilde

Du kan ikke gå helt galt i byen med en live valutaberegner, der fungerer begge veje og viser både omregningsfordelingen og gebyrerne på en no-nonsense måde.

Det smarte? Deres produktlandingsside har flere CTA’er, der enten har til formål at uddanne dig, etablere tillid og troværdighed og vigtigst af alt: at lokke dig til at tilmelde dig.

Hvis du allerede er overbevist, er det eneste, du skal gøre, at klikke på “kom i gang”. Vil du lære mere? Klik på knappen “se, hvad vi handler om”, og en forklaringsvideo dukker op.

I sidste ende er deres mål at konvertere ukendte besøgende til registre. Så den store, fede og grønne CTA står altid i centrum.

Som jeg sagde tidligere, anbefaler jeg, at du holder dine produktlandingssider enkle.

Dine ressourcer kan bruges bedre andre steder (f.eks. på at finde ud af din online markedsføringsstrategi). Især hvis du er en lille til mellemstor virksomhed eller lige er begyndt.

Astra produktlandingsside

Jeg er stødt på mange eksempler på produktlandingssider i min tid som marketingmedarbejder, men for nylig faldt jeg tilfældigvis over Astra’s landingsside. Jeg vidste med det samme, at dette var den bedste produktlandingsside, jeg længe har set.

Men hvorfor? For det første er deres overskrift spændende og samtidig rettet mod et smertepunkt, som alle webstedsejere står over for. Deres efterfølgende underoverskrift maler et “hvad nu hvis”-scenarie, der yderligere ophidser denne smerte.

Astra afslutter med en CTA, der positionerer dem som en løsning, der har til formål at hjælpe enhver webstedsejer med at sikre deres websted på tre minutter, som er både hyperspecifikke og tidsafgrænsede.

Nu har de også gjort et godt stykke arbejde med at liste de største virksomheder, der bruger Astra, for at forsikre potentielle kunder om, at de er i godt selskab:

Kilde

Venngage produktlandingssideskabelon

Her er en faktisk produktlandingssideskabelon, som vores designere har fundet frem til, som du kan pille ved og tilpasse efter din smag.

Denne landingssideskabelon kommer med alle standardelementer som helteafsnittet, hvordan det virker, flere CTA’er og sociale beviser i form af kundeudtalelser.

Hvis du sælger nogen form for software eller fysiske produkter, er denne alsidige produktlandingssideskabelon dit bedste bud:

Skab denne skabelon

Pro Tip: Bekymret for, at dine landingssidedesigns ikke vil se ud som et brand? Med vores My Brand Kit-funktion kan du anvende din virksomheds branding på alle dine designs (herunder vores landingssider) med det samme. Importer dine brandfarver, logoer og skrifttyper, og anvend dem på ethvert design med et enkelt klik. Så enkelt er det. Få mere at vide om Brand Kit her.

Eksempler på landingssider til e-handel

Casper ecommerce landing page

Et andet eksempel på landingssidedesign, der er gjort rigtigt, kommer fra madrassetroldmændene Casper.

Overskriften indeholder en dristig påstand, der fanger den besøgende med det samme, det unikke salgsargument er tillokkende, og brugen af populære mediehuse som socialt bevis giver troværdighed til deres tilbud.

Alt i alt gør en enkel struktur, et elegant design og overbevisende budskaber Caspers landingssidedesign til et af de bedste inden for e-handel:

Kilde

Pro Tip: Hvis du ønsker at øge konverteringerne på landingssider, skal du bruge social proof til din fordel. Udvalgt i TIME Magazine? Har du modtaget begejstrede udtalelser fra indflydelsesrige personer? Har du fået en 5/5-bedømmelse fra kunder? Vis dem frem på din landingsside.

Dollar Shave Club viral landingsside

En virksomhed, der er kendt for sin geniale markedsføring bakket op af en no-nonsense-holdning, er det svært at diskutere den monumentale succes, som Dollar Shave Club’s produktlancering har haft.

Selv om denne landingsside er temmelig nøgtern i forhold til de fleste eksempler på landingssider til e-handel, hjalp den sammen med deres virale video Dollar Shave Club med at få ca. 12.000 nye kunder på bare 48 timer.

Tal om at gå viralt.

Mens den virale videos humor og autenticitet gjorde det tunge benarbejde, gør denne e-handelslandingsside alt rigtigt – lige fra fastnagling af salgsargumentet til den geniale brug af social proof:

Kilde

Næsten et årti og et opkøb senere har moderselskabet Unilever valgt at gå den traditionelle vej med en e-handelslandingsside med Dollar Shave Club:

Kilde

Venngage ecommerce landingssideskabelon

Inspireret af eksemplerne på ecommerce landingssiderne ovenfor har vi også lavet en landingssideskabelon, som du kan lege med lige nu.

Denne skabelon til ecommerce-landingsside, som jeg delte tidligere, har et stilfuldt helteafsnit med en kontrastfyldt CTA, et enkelt salgsforslag i tre punkter og sociale beviser i form af omtaler i medierne og kundeanmeldelser:

Skab denne skabelon

Eksempler på app-landingssider

Hopper-app-landingsside

Hopper er en populær rejseapp med en brugeroplevelse i appen, der er den bedste, jeg nogensinde har haft.

Men lad os holde os til emnet landingssider her. Hoppers app-landingsside er enkel, letlæselig og fyldt med legende ikoner, drømmende illustrationer og minimal brug af tekst.

Det mest unikke ved denne mobilapp-landingsside er, at uanset om du bruger din desktop- eller smartphone-browser, vil de altid omdirigere dig med et link til at downloade deres mobilapp.

Og da jeg oplevede deres mobilapp for første gang, forstod jeg deres ræsonnement:

Kilde

AnyList mobile app landing page

Hvis du har været opmærksom, vil du bemærke, at mange mobile app landing pages har en tendens til at være minimalistiske i naturen både med hensyn til indhold såvel som tekst.

Den største grund til dette er enkel: Dine besøgende søger sandsynligvis efter din mobilapp på deres mobile enheder. Med en begrænset skærmreal estate er du nødt til at få hvert eneste ord til at tælle.

Lejrliste-appen AnyList overkomplicerer ikke tingene og følger i stedet det traditionelle design af app-landingssider meget godt.

Minimal tekst (ofte højst et par linjer), et højopløst billede af appen i aktion efterfulgt af downloadlinks til deres apps – det kan virkelig ikke blive mere ligetil end dette.

AnyList er et bevis på, at når det kommer til app-landingssider, kan kedeligt nogle gange være bedre:

Kilde

Venngage app-landingssideskabelon

For at hjælpe dig med at føre din app-idé ud i livet har vi internt skabt vores egne mobilapp-landingssideskabeloner baseret på de app-landingssidedesigns, vi har set på tværs af interwebs.

Til at begynde med er denne mobil app landingssideskabelon udstyret med smarte, men visuelt fængslende illustrationer samt flere, men strategisk spredte CTA’er:

Skab denne skabelon

Har du lyst til noget meget mere grundlæggende? Vores designere har endda skabt en above the fold-version af en app-landingsside, der indeholder en overskrift, en beskrivelse, et app-billede samt downloadlinks:

Skab dette TEMPLET

Eksempler på kommende landingssider

Playdate kommende landingsside

Coming soon-landingssider er perfekte til at annoncere et nyt produkt eller en ny tjeneste, som du arbejder på. De er også praktiske til at validere nye forretningsidéer.

Panic Inc. brugte en kommende snart-landingsside til deres nye produkt. Deres mål? At skabe opmærksomhed omkring lanceringen af deres nye håndholdte spilkonsol: Playdate.

Nu er dette ikke den traditionelle landingssidestruktur, som du har set gentaget indtil nu i dette indlæg. Fokus for denne coming soon landing page er indholdet.

Det minder mig om et langt salgsbrev. Den afgørende forskel i Playdates tilfælde er, at det føles mere som en samtale og mindre som et salgsbrev.

Og med et elegant landingssidedesign, smukke produktbilleder og en simpel CTA for at få besked, når de lancerer, er det svært at diskutere, hvad al hypen handler om:

Kilde

Brainfood pre-launch app landing page

Her er mere inspiration til design af coming soon landing pages til dig. Det kommer fra de kloge hoveder bag Brainfood.

Overfor folden fokuserer Brainfood kun på tre elementer:

• Overskrift: Sprødt og letforståeligt salgsforslag. Minus buzzwords.
• Heltebillede: Viser appen i aktion med en forklaringsvideo.
• CTA: Gemmer sig øverst til højre og inviterer brugerne til at tilmelde sig.

Hvis du ligesom jeg er tilhænger af at holde tingene enkle, er jeg sikker på, at du vil sætte pris på dette design af en kommende snart landingsside:

Kilde

Venngage-skabelon til kommende snart landingsside

Som jeg sagde ovenfor, hvis dit mål er at validere en ny forretningsidé eller skabe buzz for dit nye produkt eller din nye tjeneste, er kommende snart landingssider dit bedste bud.

Den bedste del? Da de typisk er lige over folden, er det forholdsvis nemt og ligetil at oprette dem.

Hvis du forsøger at få din startup til at komme i gang, vil det være klogt at validere din startup-idé først. Ellers ender du måske med at skabe noget, som ingen vil have.

Her er en skabelon til en kommende startup-landingsside, som du kan bruge til at validere, om din idé om en ny startup-levering er et ja eller et nej:

Skab denne skabelon

Bekendtgør du et nyt produkt eller en ny tjeneste? Brug en “coming soon”-landingsside til at skabe rigeligt med opmærksomhed, før du lancerer den. Selv hvis det er en rejseblog, du har været spændt på at lancere:

Skab dette TEMPLATE

Eksempler på landingssider for konsulenter og bureauer

Rob Sobers blog-landingsside

Men blandt det store antal personlige blog-landingssider derude kommer den, som jeg højst sandsynligt vil stjæle til mig selv, fra marketingkonsulent Rob Sobers. Undskyld, Rob.

Når du besøger hans hjemmeside, bliver du mødt med en simpel hjemmeside. Alle prangende klokker eller fløjter er fraværende, og denne “mindre er mere”-tilgang skinner i både hans hjemmesideindhold og design.

Kopier, der er anderledes, men alligevel slående, en simpel CTA for at tilmelde sig hans e-mail-nyhedsbrev og en lavmælt navigationslinje er det, jeg bedst kan lide ved dette landingssideeksempel:

Kilde

Pro Tip: Hvis du er en konsulent som Rob, hjælper det helt sikkert at blogge og skrive e-mail-nyhedsbreve. Jeg vil også anbefale at eksperimentere med et par kundeudtalelser og casestudier, der viser eventuelle tidligere kundevinster. Du kan også tilbyde casestudier som en gratis download til besøgende på webstedet i bytte for deres e-mail. Mere om leadgenerering senere.

Shortlist-bureauets landingsside

Selv om jeg har en naturlig bias til markedsføringsorienterede landingssider, tror jeg, at du vil være enig med mig, når jeg siger, at Shortlists landingside-redesign ser bedre ud end de fleste eksempler på salgslandingssider derude.

Fra et designperspektiv er det dæmpede farvepaletter, kreativ brug af farvegradienter og farverige illustrationer, der popper, hvad jeg kan lide ved denne bureaulandingsside:

Kilde

Fra en marketingvinkel er jeg også fan af deres kreative salgstekst, den fede røde CTA og sociale beviser i form af mærker, de har arbejdet sammen med.

Bottom line? Optimer hvert enkelt element i designet af din landingsside, og du vil få en salgslandingsside, der vil overbevise de fleste besøgende om at trykke på den store røde “lad os tale!”-knap.

Venngage bureaulandingssideskabelon

Hvis du ønsker at generere leads til dit bureau eller din konsulentvirksomhed, har du brug for en bureaulandingsside, der ikke kun konverterer, men også opnår en balance mellem design og tekst.

Du er heldig, for her er en skabelon til en salgslandingsside til at lære mere, der tjekker alle kasser:

Skab denne skabelon til salgslandingssiden

Denne skabelon til salgslandingssiden er anderledes, fordi den beder potentielle kunder om deres kontaktoplysninger på forhånd, giver en overbevisende grund til at gøre det og også indeholder et telefonnummer, så potentielle kunder kan komme direkte i kontakt med dig, hvis de har spørgsmål.

Ebook landing page examples

Unbounce ebook landing page

Hvis der er én virksomhed på denne planet, der forstår godt design af landingssider, så er det vores venner hos Unbounce.

I blandt de mange landingssider, jeg har set fra Unbounce, er dette ebook-landingssidedesign skarpt og rent og kommunikerer alt, hvad du behøver at vide om deres ebook, og hvorfor du bør downloade den:

Kilde

Med denne e-mail capture landingsside har Unbounce et simpelt mål: at generere højt kvalificerede leads ved at tilbyde førstegangsbesøgende en gratis e-bog i modsætning til at forsøge at konvertere dem til en kunde første gang (hvilket sjældent virker).

Marketing for udviklere ebook landing page

I dette landingssideeksempel er jeg vild med, hvordan Justin tilbyder to versioner af sit digitale produkt: en ebook og et onlinekursus for at appellere til både læsere og seere i sin målgruppe.

Det enkle design, den lange salgstekst og de ægte kundeanmeldelser gør denne landingsside letlæselig, overbevisende og autentisk.

Og ikke nok med det, i sin forklaringsvideo forklarer Justin kort alt om programmet kortfattet ved først at fremvise smertepunktet og derefter positionere sit program som en løsning.

Og selv om dette ikke strengt taget er et eksempel på en ebook-landingpage, følger det det standarddesign for ebook-landingpages, som jeg kender alt for godt:

Kilde

Den virkelige kicker: Justin er så sikker på sit program, at han tilbyder et gratis kapitel fra sin e-bog, så førstegangsbesøgende kan opleve en del af hans program, før de træffer en købsbeslutning.

Dette hjælper også Justin med at konvertere skeptiske købere til potentielle kundeemner, som han kan tilbyde ægte værdi til først, før han beder om et salg. Tal om en win-win.

Venngage e-mail capture landingssideskabelon

Som tidligere påpeget kan du generere leads på flere måder end én. Og processen er ret ens, uanset om du er et bureau, en konsulent eller en softwarevirksomhed.

Hvis du føler dig overvældet eller forvirret, vil jeg anbefale, at du starter småt. Opret en e-bog og tilbyd den som en lead magnet på din e-mail capture landingsside for at begynde at generere leads.

Her er en simpel skabelon til en ebook landingsside, så du kan komme i gang:

Skab denne skabelon

Når du har fået en fornemmelse af, hvordan ebooks hjælper med leadgenerering, kan du begynde at pille rundt med andre former for leadmagneter som white papers, infografikker og tjeklister.

Identificer den type tilbud, der giver størst genklang hos din målgruppe, før du begynder at optimere din landingsside. En Fortune 500-chef er f.eks. måske mere interesseret i et white paper end i en tjekliste.

Pro Tip: e-bøger, white papers og tjeklister er gode lead magnets, fordi de er nemme at oprette. Hvis du kan bruge lidt tid og ressourcer, vil jeg også anbefale, at du eksperimenterer med at oprette et e-mail-nyhedsbrev eller en dybdegående brancherapport for at generere leads af højere kvalitet. Føler du dig eventyrlysten? Prøv at være vært for et webinar.

Din tur til at skabe dine bedste landingssider endnu

Godt tillykke, du er nået frem til slutningen af denne guide. Nu har du en solid forståelse af de bedste eksempler på landingssider, der har tendens til at fungere for forskellige brancher og specifikke brugssager.

Som jeg har sagt, er nøglen til at skabe landingssider, der konverterer, primært at få indholdet og designet rigtigt. Først da vil konverteringerne følge med.

Sådan gør du dit website REALER

– Almindelig > Prætentiøs
– Ansigter > Illustrationer
– Social proof ved enhver lejlighed pic.twitter.com/gO4tY3LQQWz

– Marketing Examples (@GoodMarketingHQ) July 16, 2020

Husk følgende tips, før du opretter din landingsside:

• Keep it simple, stupid (KISS): De bedste landingssider, der konverterer, er lette for øjnene og lette at læse.
• Brug sociale beviser: Nye besøgende har brug for at have tillid til dig, før de køber. Eliminer deres skepsis ved at fremvise medieomtaler, citater fra indflydelsesrige personer og vidnesbyrd fra kunder ligesom dem selv.
• Tal som et menneske: Mindre “The AI Visitor Conversion Platform” og mere “How Small Brands Sell More Online” Din kopi skal tale som et menneske ville gøre det.
• Lad være med at gentage dig selv (DRY): Landing pages have limited real estate, use it wisely. Skærp dit budskab, og lad være med at gentage dig selv for at sikre, at du kommunikerer værdien af dit tilbud effektivt.
• A/B-test alt: A/B-test dine landingssider ofte for at finde ud af, hvad der virker bedst. Test individuelle elementer som design, tekst, salgsforslag, CTA’er, social proof, og bliv granulær derfra.

Sidst, glem ikke at bruge værktøjer til test på tværs af browsere for at sikre, at dine landingssider er kompatible på tværs af nogle af de mest populære webbrowsere og styresystemer.

Nu ved du, hvordan du kan lave din egen landingsside eller give dine eksisterende landingssider et visuelt løft, er det tid til at tage fat.

GØR EN LANDINGSPAGE!

Vil du vide mere? Her er mere indhold om markedsføring og design, håndplukket til dig:

7 Tips til at bruge visuelle elementer til at skabe landingssider, der konverterer

20+ fantastiske e-bogsskabeloner + designtips for begyndere

Website Marketing for Small Businesses: Den ultimative guide