Skip to the content

Noget af det værste, der kan ske for et website er en høj bounce rate. Bounce rate står for den procentdel af dine besøgende, der bouncer af (dvs. forlader) dit website efter kun at have besøgt én landingsside. Og det kan jo ikke være meningen. Jo lavere bounce rate, jo bedre er det for dig, for din hjemmesides SEO og for din landingssides chance for at konvertere.

For at holde på dine leads og potentielle kunder skal du have et website, der ser flot og indbydende ud. Det første indtryk er meget vigtigt. Og dine kunder lander jo ikke nødvendigvis på din forside først. Så alle dine landingssider er vigtige. Men hvordan sikrer du at selv dine landingssider har det rette design, der får de besøgende til at klistre fast som plaster til huden.

Vi kan godt blive enige om én ting, og det kan siges på både latin og på dansk:

" Suum cuique (Hver sin smag)  "

Nogle mennesker foretrækker et rent, simpelt og minimalistisk websitedesign, mens andre bedst kan lide et mere illustrativt, farverigt og livligt websitedesign. Måske en mellemting er vejen frem for at tilfredsstille de fleste.

Her kan du derfor lære mere om de mest fængende og vigtige elementer og principper, som du kan benytte på dit website. Vi forklarer dig dem i form af 5 tips og tricks. Det eneste du skal bruge er basale principper og lidt viljestyrke for at holde dig til dem.



1. Hold din forside ren og pæn



Selvom forsiden af dit website ikke altid er den først besøgte, så er det vigtigt at denne er repræsentativ for designet på de resterende landingssider. Det er højst sandsynligt denne, som brugeren vil søge imod for at få overblik eller for at navigere videre på dit website. Især forsiden skal være ryddet for en hel masse ord. Den må ikke være teksttung, men skal være overskuelig, brugervenlig og klar i spyttet med korte USP'er og budskaber. Tænk på dit website som et hus eller en lejlighed. Vi kan bedst lide at bruge tid i et rum, der er rent, ryddeligt, behageligt og uden for meget støj.

Vi læser sjældent alle de ord, der er skrevet på et website - heller ej på forsiden. I stedet scanner vi siden for keywords, som taler til os og vores behov. Informationen skal serveres blidt og let til læseren, så denne ikke skal lede eller tænke for meget. Hav dine vigtigste budskaber klar og vær præcis. Selvfølgelig kommer du ikke langt uden en smule tekst og nogle calls-to-action, men sørg for at de er struktureret med titler, undertitler afsnit. Billeder og ikoner kan bruges til dine budskaber og pointer. Vi anbefaler at du ind i mellem tænker i visuel kommunikation, da denne er lettere at fordøje for brugeren af dit website.

Når det kommer til SEO, så kan tekst være svær at komme udenom. Men pointen her er at finde en måde, hvorpå du kan arrangere afsnittene flot og indbydende. Det handler også om at placere tekstafsnittene korrekt på din landingsside. Typisk vil store tekstafsnit blive placeret længere nede på siden, så de letter budskaber kan være det første, som brugerne støder på øverst på siden. Men uanset placering, så gør en indsats for at få teksten til at se overskuelig ud. Brug fængende overskrifter, bokse og punktopstilling.

  • Hver ting har sin plads  

    Lad os vende tilbage til huseksemplet. I et hus har du behov for at hver ting har sin plads. Tøj skal i skabet, bestik i køkkenskuffen, mad i køleskabet. På samme måde skal dit website og din landingsside struktureres. Hvis du ikke selv har overblikket, hvordan skal din bruger så få det?

  • Minimalisme

    Hvis du ønsker et moderne udseende på dit website, så tjek minimalistiske websitedesigns ud. Minimalisme er blandt de mest trendy web designs i år.



Selvom en minimalistisk side er hurtig at udvikle, loader hurtigt og giver et rent og simpelt udtryk, så er det ikke nødvendigvis nemt at skabe en.



Det vigtigste er at gøre siden attraktiv, holde den ren og holde en balance mellem at opfylde alle krav der er til en landingsside samt at gøre den unik.



2. White space



White space lyder bare mega sejt på engelsk. Men et bud på en oversættelse er "hvid plads". Og hvad er det så og hvorfor er det så vigtigt?

Mange gange referer man til white space som den plads eller det tomrum, der er mellem dine elementer på din landingsside. Alle generationer, men især de ældre generationer, vil værdsætte white space. De ældre generationer er ikke nødvendigvis så online belæste, så den tomme plads vil øge overskueligheden for denne målgruppe, så de ikke bliver overvældede.

Et fantastisk og helt igennem legendarisk eksempel på white space, som alle kender, er Google. Deres forside består hovedsageligt af white space. Så kan vi nemlig fokusere på det, som er vigtigt: søgning. Denne kvalitet menes faktisk at være en stor del af Google's succes. Det er nemlig noget som de andre søgemaskiner ikke har forstået i samme grad.

Tænk altid på hvordan du arrangerer din tekst med margin, overskrift, og dine billeder og din footer - og tænk white space ind dit design hele tiden. Sørg for rigeligt med plads mellem dine elementer og sikr et professionelt look, et elegant udseende og forbedr samtidig brugeroplevelsen.

Lad læserens øjne slappe af! Overvej fx. hvad du selv gerne vil se på en landingsside. Således finder du ud af, hvordan du bedst skaber din white space.

White space kan være med til at skabe den oplevelse, der er rar for læserens øje. Og en glad bruger kan meget vel blive til en glad kunde, hvilket vel er dit mål.



3. Skrifttyper



Din egen familie derhjemme er ikke én, som du selv har valgt. Men din fontfamilie vælger du helt selv. Hvis vi skal pege dig i retningen af en familie, som vi vil anbefale, så kræver det en lille forklaring. Seriffer er de små grafiske "fødder", som nogle skrifttyper har. Eksempelvis er Times New Roman fra Serif font familien. Vi anbefaler dog at der anvendes en skrifttype uden disse "fødder" og derfor kan du med fordel vælge en skrifttype der er "sans serif", hvilket meget praktisk betyder "uden serif". Denne type er nemlig bedst til online tekster, der skal være simple i deres udtryk. Lad de mest kringlede skrifttyper ligge - de gør ikke nødvendigvis noget godt for dit websitedesign og læsbarheden af din tekst.

Derudover anbefaler vi at du holder dig til et maksimum af 3 skrifttyper på hele dit website. Det bør være nok. Du risikerer at få et rodet og usammenhængende website, hvis du bruger for mange forskellige skrifttyper. Så hold dig til et par forskellige skrifttyper og opnå harmoni, genkendelighed og sammenhæng.

Størrelsen betyder en hel del!

Størrelsen på din tekst har meget at sige, når det kommer til at fastholde en bruger på din sticky landingsside. Tidligere var skrifttypen typisk meget lille og i dag er det faktisk sjældent at str. 12 bliver anvendt, da den er for lille til at teksten er behagelig af læse online.

Når skærmen er ca. 50 cm fra brugerens øjne, vil de fleste brugere have svært ved at læse små skrifttyper. En god tommelfingerregel er at dine body tekstafsnit bør være mindst str. 16. Det er naturligvis med forbehold for skrifttypernes forskellige egenskaber, så brug din sunde fornuft og test, test, test!

Sidebemærkning: Vi kan ikke understrege det ofte nok. Tag hensyn til brugerens øjne - vær rar ved dem! Nogle gange er de allerflotteste skrifttyper, eksempelvis håndskrift, ikke nødvendigvis et godt valg - selvom de er pæne og unikke i dine øjne.

Har du hørt om dynamic web skrifttyper? De er vildt cool fordi de tillader udviklerne at bygge websites uden at være begrænsede af bestemte fontfamilier. Google Webfonts er desuden alletiders, som leverandør af skrifttyper til web (du kan tilgå dem vha. appen, hvis du ikke har en Google Account). Set-up gennem kun 3 trin er super nemt.

Hvis du stadig er lost, når det kommer til at vælge skrifttyper og har brug for inspiration – så klik her og find gratis skrifttyper, som du kan teste.



4. Transitioner



Steve Jobs har udtalt sig om design:  

" It's not just what it looks like and feels like. Design is how it works. "

Nogle website overgår andre på design, indhold, features og lignende. Detaljer såsom interaktionsdesign og animation gør en kæmpe forskel på moderne websites. Der er stort potentiale i at være kreativ og udføre lidt ekstra lir på dit website.

Et par eksempler på lækker lir i form af populære transitioner:

  • flyvende animation baseret på SVG
  • fokus med dybdeeffekt
  • placeringsspion og animation hjælper med fokuspunkt
  • glidende og rytmisk ændring på form og fokus
  • vertikal maskedisplay af navigation

Se nogle eksempler på gode transitioner: https://www.awwwards.com/websites/transitions/





Udvalg af Awwwards winning animations websites med brug af kvali-animationer. Vi anbefaler Awwwards.com, når du søger inspiration til at nå nye højder med dit websitedesign.





5. Billeder og animationer

Dette visuelle ansvar ligger sikkert hos din fotograf eller grafiker - men her er lidt tips og tricks til dig, der måske planlægger og bestiller det grafiske materiale:

  • Visuel storytelling

Motion graphics har til formål at hjælpe med at fortælle en historie eller at overbringe et budskab. Det kan være alt fra at vise hvordan folk bruger en knap, til at fortælle folk om dit brand. Du har altså mulighed for at kommunikere visuelt både i det store og i det små. Så kom i gang med at visualisere din storytelling. Men beslut dig først for om motion skal bruges til at forbedre brugerfladen eller som del af det æstetiske udtryk.



  • Brug billeder til at illustrere koncepter

Det virker som verdens største kliché, men den er meget præcis i denne sammenhæng. Et billede siger mere end tusinde ord. Det vil ikke forbedre den online brugeroplevelse, hvis du skrev tusindevis af ord. Det ville mulighed være godt for SEO, men så skal der være tale om en landingsside, der går dybt ned i et emne. I forhold til webdesign kan du med fordel bruge billeder til at fortælle fremfor at skrive det i en tekst, som ikke alle læser alligevel. Hvis du har et billede, som kan illustrere et koncept, kan implementeringen være meget værdiful for din forretning. Vi læser nemlig et billede meget hurtigere end vi læser tekst. Billedet kan svare på spørgsmål, som brugere har til konceptet, som eksempelvis hvem, hvor, hvad, hvorfor omkring et produkt eller en service som du forsøger at sælge. Med det perfekte billede er du rigtig langt i kommunikationen til brugeren.

Ligeledes sælger du ikke et produkt i din webshop, hvis ikke du har et billede af det. Så sørg for at have fantastiske produktbilleder. Gå tæt på og lad brugeren se detaljerne. Gå op i lyssætningen. Sørg for at have den rette baggrund (gerne helt hvid). Præsenter dit produkt med stolthed.



  • Brug billeder af rigtige personer

Studier viser at webdesigns med rigtige mennesker er mere persuasive end webdesigns uden. Det betyder derfor at der er større chance for at dine brugere konverterer i form af fx. et køb eller tilmelding til nyhedsbrevet, hvis de ser glade personer på en af de landingssider, som er en del af deres kunderejse.



Vi håber at du er blevet inspireret og har løftet dit kompetenceniveau til at gå ud i verden og forbedre dine websitedesigns. Er du enig? Følg os på Facebook, LinkedIn eller kontakt os.

Om forfatteren

Irena Vilic

Irena Vilić studerer informationsteknologi på University of Mostar og er vores yngste kollega. Hun elsker kunst og nyder at være kreativ på alle mulige måder. Hun kan godt lide at tilegne sig ny viden og er allerede skarp på områderne matematik og sociale medier.

Kontakt os

inetdesign er et digitalt bureau, der leverer brugervenlige, digitale løsninger til både B2B og B2C. Vi er forretningsorienterede og fokuserer på at skabe vækst i din forretning.