15+ Smukke websideoverskrifter, og hvorfor de fungerer så godt

: https://vanseodesign.com

Billedkilde:

• Det F-formede mønster

Dette mønster beskriver den mest almindeligt anvendte stil til at læse blokke af indhold i online-mediet. Brugerne scanner hurtigt en webside, og deres øjne følger et F-mønster.

Eksempel:

Suden at gå yderligere i detaljer om disse mønstre vil vi gerne styrke, at for alle disse modeller er det den øverste vandrette linje, hvor de besøgende begynder at scanne en side.

Hvad skal man integrere i en websideoverskrift?

Disse mønstre viser, hvorfor en webdesigner nøje skal beslutte, hvad brugerne skal se først. Overskriften skal fungere som en krog, der fanger deres opmærksomhed og inviterer dem til at udforske resten af siden.

Der er ingen chance for at gøre et andet indtryk. Så du bør tænke dig godt om, hvad du skal have med i overskriften:

• Stærkt heltebillede

Et heltebillede er et meget stort bannerbillede, der vises over folden på en webside. Det indgår i header-sektionen og er det første, som brugerne ser, når de kommer ind på et websted. Heltebilleder har også til formål at tiltrække de besøgendes opmærksomhed på virksomhedens unikke salgsargument (USP). En bedste praksis er, at brugen af ansigter af rigtige mennesker i heltebillederne kan hjælpe de besøgende til at relatere bedre til brandet. Kommunikationen bliver mere menneskelig og personlig.

Kilde: Drift.com

• Unique selling point (USP)

USP’en er en sætning, der forklarer grunden til, at en virksomhed eksisterer. Den skal afsløre, hvad virksomheden gør, hvorfor og for hvem. Den bør også fremhæve unikke funktioner og fordele, der får brandet til at skille sig ud blandt konkurrenterne. Et stærkt USP er afgørende for at formidle det rigtige budskab til de besøgende på webstedet og i sidste ende for at omdanne dem til kunder.

Kilde: miro.com

• Mærkenavn

Mærkenavnet vænner folk til webstedets identitet eller forstærker det billede, folk har af din virksomheds identitet.

Billedet bør afspejle din mærkepersonlighed og sikre, at din brand voice er konsistent på hele webstedet. Det skal være let genkendeligt, selv hvis det skæres ud af webstedshovedet. Og når det er placeret i webstedshovedet, bør det spille en central rolle i etableringen af en personlig forbindelse med hver enkelt bruger.

Kilde: carolinaherrera.com

• Produktvideo

Da det kun tager 50 millisekunder for brugerne at danne sig en mening om et websted, betyder det, at du bør have de vigtigste budskaber i hovedteksten. Derfor venter mange virksomheder ikke på, at deres brugere skal scrolle ned og komme til funktionerne i deres produkt/service, men bruger videoens kraft til at formidle deres budskab bedre. Lad os heller ikke glemme, at 78 % af folk ser onlinevideoer hver uge, og 55 % ser onlinevideoer hver dag.

Kilde: wistia.com

• Call to action (CTA)

En CTA er en besked (som regel på en knap), der udløser en bestemt reaktion fra de besøgende på webstedet. Call-to-action skal være klart defineret og let at forstå for de besøgende på webstedet. Naturligvis øger en CTA placeret i overskriften, lige der hvor de besøgende starter deres rejse ind på hjemmesiden, chancerne for at få den ønskede handling fra de respektive brugere.

Kilde: creatopy.com

• Produkt med

Hvis du driver en e-handelsbutik, vil du gerne fremhæve kvaliteten og bekvemmeligheden af et bestemt produkt, og den bedste måde at gøre det på er ved at inkludere det pågældende produkt i overskriften. Brugernes opmærksomhed vil blive ledt mod det bedste tilbud, og de vil være tilbøjelige til at gå ind i købsprocessen.

Kilde: amazon.com

I alle ovenstående tilfælde er den generelle tommelfingerregel: Hold det enkelt, hold det tydeligt, gør overskriften engagerende! Undersøgelser viser, at “den gennemsnitlige forskel i, hvordan brugerne behandler info over vs. under folden, er 84 %.” Så det er bedst at fokusere dine bestræbelser på at reducere disse tal så meget som muligt. Og det gør du bedst, hvis du har sat dig nogle mål for, hvad du ønsker at overføre.

Store websteder, som www.youtube.com, begrænser den plads, der er afsat til overskriften, til kun en lille mængde. Dette gøres med vilje, da hensigten er at lade brugernes opmærksomhed blive rettet mod noget af større betydning, f.eks. produkter eller tjenester eller videoer (f.eks. YouTube).

Sommetider har du ikke engang brug for en overskrift, eller hvis du har brug for en overskrift, skal du kun have en lille overskrift.

Det hele afhænger af hjemmesidens særlige karakteristika. Tænk over det, og giv dit website den personlighed, det har brug for, uanset hvad webdesigntrenden “fortæller” dig i ny og næ.

Hvad inspirerer din websteds header?

Udover at overføre visse budskaber kan du også overveje at indgyde visse følelser hos læserne. Afhængigt af det formål, du giver overskriften, kan den inspirere læserne til et af følgende:

• Nysgerrighed

På visse hjemmesider vil det være passende at opsætte en overskrift, der inspirerer læserne til nysgerrighed. De vil have lyst til at finde ud af mere, de vil længes efter mere, de vil skynde sig at udforske resten af historien.

Det er sådan, jeg har det med denne header fra Canva. De giver et stort løfte lige der: “Design alt”. Og du er inviteret til at afprøve det. Kan du modstå?

• Aktion

I nogle tilfælde er det bedre at vække handling direkte fra overskriften. Med et call-to-action kan du opfordre brugerne til at klikke på en knap eller foretage en anden interaktion med webstedet med det samme. I Planables tilfælde er deres USP direkte forbundet med CTA’en nedenfor. desuden er der, hvis du ikke er helt klar til at købe, også mulighed for at planlægge en demo.

• Trust

Det kan være nyttigt at starte med at vække tillid hos dine besøgende. Du vil gerne have dem til at foretage en handling senere hen, og for at gøre det skal de føle sig helt sikre på, at de træffer den rigtige beslutning.

Lad os se, hvordan Salesforce gør det. De oplyser, at de er verdens største CRM. Okay, du vil måske sige, at 99 % af virksomhederne derude ikke er de første inden for deres felt. Og det ville du have ret i. Men, hvis du læser nedenfor, er der helt sikkert noget, du kan bruge. Der er et casestudie, der viser, hvor effektivt produktet er. Du kan selv udnytte et sådant casestudie.

• Smerte

Hvor i alverden vil du inspirere til smerte hos læserne, især fra overskriften? Jo, mange virksomheder har deres markedsføring baseret på FUD-princippet (Fear, Uncertainty, Doubt). På et tidligt tidspunkt i konverteringsprocessen vil frygt/smerte udløse beslutningen om straks at anvende en løsning og få smerten til at forsvinde.

Dette kan være en tilgang for cybersikkerhedstjenester, fysiske sikkerhedstjenester, men også inden for sundhedsvæsenet eller pensionskasser.

En sådan tilgang kan udnyttes i kampagner, der ønsker at gøre folk opmærksomme på, at man skal vaccinere mod COVID, eller at man skal bruge sikkerhedssele.

• Laughter

Måske ønsker man at skabe en følelsesmæssig forbindelse med de besøgende, helt fra starten. Og der er ingen bedre måde at gøre det på end at få dem til at grine. Og grine højt. Der skabes en følelse af medvirken, og du får dine brugere til at stå ved din side, mens de udforsker webstedet.

• Familiaritet

Den kan skabe en vis grad af fortrolighed ved at forbinde brugernes situation med en lignende situation, der præsenteres i overskriften.

Typer af overskrifter til forskellige typer af websteder

Afhængigt af webstedets særlige karakteristika vil en overskrift passe bedre til det overordnede design end en anden. Derfor bør du have en klar idé om, hvilken type header der passer bedst til dit eget websted (uanset om det er e-handel, blog, portfolio, online avis osv.).

• CTA-fokuseret header

I Blue Aprons tilfælde bruger webstedsheaderen en stor video i stedet for et stort heltebillede. Det overfører en følelse af hygge, fortrolighed og appetit.

Dernæst har vi en CTA, der inviterer brugeren til at tage handling for at nyde godt af den samme hyggelige og lækre oplevelse.

Den CrazyEgg hjemmeside kommer med en header, der inviterer brugerne til at tage deres produkt til en live demonstration. Deres produkt er bare perfekt egnet til sådanne realtidsdemonstrationer. Og det beviser med det samme produktets fordele. Deres bruger også et visuelt stikord, der peger på CTA: mandens hånd i ballonen leder øjet mod knappen.

• Brand-fokuseret header

Dette er et smukt eksempel på et websted med en header, der fokuserer på brandidentitet og brandingelementer. Den indeholder logoet, en replikation af brandlogoets farver i den øverste del samt deres slogan.

• Indholdsfokuseret header

Dette er meget velegnet til blogs, og magasiner, som promoverer artikler og historier.

Men jeg har også fundet nogle undtagelser.

Patagonia promoverer ikke deres butik på hjemmesiden, men, de skubber historier, der viser deres engagement i at lave en forandring i verden. Denne aktuelle historie, der vises i hjemmesidens overskrift, handler om slaveri og aktivisme.

I I Ikeas tilfælde opfordrer den venstre side af skærmen de besøgende til at gå til en af onlinebutikkerne, mens den anden halvdel opfordrer brugerne til at læse historien om Ikea.

• Video baggrundsfokuseret header

BUKWILD integrerede 3 forskellige videoer i hjemmesidens header. Hver af videoerne kan afspilles ved at placere musen over den tilsvarende sektion. Det interessante ved dette er den kreative måde, hvorpå de bruger videoer som dele af et større “billede”, et billede, der repræsenterer deres brand.

• Produktfokuseret header

I tilfældet med Cropp, en online modebutik, bliver de nyeste kollektioner præsenteret i headeren.

Threadless.com sætter wall-art i en sammenhæng og har en CMYK-tæppe. Headeren indeholder også en klar CTA, for alle dem, der føler, at de på en måde hører til i det scenarie, som “squadet” præsenterer i headeren.

• Personlig branding-fokuseret header

I tilfældet med rejsebloggen Alex in Wanderland kan brugerne i hjemmesidens header, ud over et foto af Alex, se begyndelsen på en historie i denne header: “Five years and counting on the road…”. Dette er en invitation til læserne om at få lyst til at udforske flere historier.

For at slutte af…

Overskrifter bidrager i høj grad til et websteds succes eller fiasko. Teknisk set er denne øverste del naturligvis den første ting på webstedet, som folk interagerer med.