Tekstlinks er rygraden i et hvert velstruktureret website og fungerer som vejledninger, for de brugere, der interagerer med websitet, men tekstlinks spiller også en væsentlig rolle for hvor godt dit website, får lov til at ranke i de organiske søgeresultater. Ved at forstå hvordan de to elementer, går hånd i hånd, kan du udforme et mere effektivt, brugervenligt og søgemaskineoptimeret website. I denne artikel, vil jeg dykke ned i de grundlæggende regler for UX og tekstlinks.
Farve og understregning af tekstlinks
For at optimere brugernes opfattelse af klikbarhed, er det afgørende at farvelægge og understrege tekstlinks, ikke overraskende. Dette er ikke blot en æstetisk beslutning, men en markant driver, for en højere click-through rate (CTR) og dermed bedre brugerinteraktion. Ifølge en undersøgelse fra Nielsen Norman Group, øges CTR med op til 20% når linktekst er farvelagt og understreget på samme tid.
Den mest almindelige linkfarve: blå
Når vi taler om den traditionelle farve for hyperlinks, kommer blå ind som den uomtvistelige vinder. Blå er standardfarven for tekstlinks i de fleste webbrowsere og stylesheets, og den har været det siden internettets tidlige dage. Denne præcedens er så indgroet, at brugere næsten forventer at se blå links, men dog har vænnet sig til andre farver igennem tiden. Forskning har vist, at den blå farve i denne sammenhæng kan bidrage til en højere klikrate end andre farver, sandsynligvis fordi blå, stadig er de facto standard for hyperlinks. Derfor bør du heller aldrig bruge blå farve på tekst, der ikke er hyperlinks.
Ekstra note om den blå farve: Vidste du at de fleste farveblinde personer lider af rød-grøn farveblindhed? Næsten ingen er blå-farveblinde, hvilket betyder, at næsten alle kan skelne blå fra andre farver, og det er derfor, hyperlinks’ standardfarve er blå.
Farvevalg og kontrast
Selvom blå er den mest almindelige linkfarve, er det naturligvis ikke den eneste mulighed – hvilket man da også ser, over alt på Internettet. Vigtigere end selve farven er kontrasten mellem linkteksten og baggrunden samt forskellen mellem linkteksten og den almindelige tekstfarve.
Det handler altså om at gøre linket nemt at identificere og at det skiller sig ud fra resten af indholdet. Web Content Accessibility Guidelines (WCAG) anbefaler en kontrast på mindst 4.5:1 mellem tekst og baggrund for optimal læsbarhed.
Farver for besøgte og ikke-besøgte links
Ved at bruge forskellige nuancer for besøgte og ikke-besøgte links kan du give brugeren en mere intuitiv oplevelse. Farverne skal være forskellige nok til at kunne adskilles, men lignende nok til at det er indlysende, de er relateret. Google’s Material Design Guidelines er et godt sted at finde inspiration, se nærmere under navigation.
Understregning
Som tidligere beskrevet, giver differentieret linkfarve, sammen med en understregning, den højeste CTR, men i nogle tilfælde, bør man undlade understregning af links.
F.eks. kan de undlades i navigationsmenuer og linklister, forudsat at sidens design tydeligt indikerer områdets funktion, hvilket en menu, naturligvis typisk vil gøre. Det er værd at A/B teste denne praksis for at sikre, at det ikke påvirker brugerinteraktionen negativt.
Reservér understregning til links
Det er vigtigt at undgå at understrege tekst, der ikke er et link. Dette kan skabe forvirring og er derfor ikke optimal brugeroptimering, dette har et eye-tracking udført af UX Matter tidligere belyst.
Det kan være fristende at understrege noget, men ser om du ikke kan gøre opmærksom på din pointe, i en anden facon end lige understregning, du kunne jo eksempelvis markere det i kursiv, som ikke giver samme forventning omkring klikbarhed.
Tilfælde, hvor du IKKE må undvære understregning på dine links
- Hvis du bruger farver som rød eller grøn, der kan være problematiske for farveblinde, er understregning afgørende.
- Hvis tilgængelighed for brugere med lavt syn er en prioritet for dit website, skal du beholde understregning. Akkurat som W3C’s Web Accessibility Guidelines anbefaler det.
Hover-effekter
Hover-effekter kan tilføje et ekstra lag af interaktion, især hvis dine links ikke er understreget i forvejen, men en hover effekt, kunne også være skift af farve på selve linket, så det tydeligt fremgår, at det er muligt at interagere med det, når man holder musen over det. Der findes ingen undersøgelser, der indikerer at en hoover effekt, skulle være mere effektiv end en almindelig understregning, hvilket nok skyldes, at understregningen først bliver tydelig, når brugeren alligevel interagerer med linket.
Tekststørrelse og Placering af Links
Det er af afgørende betydning at være opmærksom på tekststørrelsen og placeringen af dine links, når det kommer til brugeroplevelse og SEO. Undgå at benytte for lille tekst til dine links; det er ikke kun en udfordring for brugere med reducerede motoriske færdigheder, men også for den generelle læsbarhed og tilgængelighed på din side.
Efterlever du ikke dette vil du modtage advarsler i Googles Search Console der peger på “elementer, der ligger for tæt sammen” under Brugeroplevelse/Mobilanvendelighed.
Hvis Google identificerer dette problem på dit website, kan det have en negativ indflydelse på din placering i søgeresultaterne, for de pågældende sider, hvor udfordringen forefindes.
Mindre vigtige links skal placeres længst væk fra brugeren
Hvis der er links på din hjemmeside, som er mindre relevante for brugeren i den primære brugerrejse – for eksempel politikker for privatliv, vilkår og betingelser eller karriereopslag – bør disse placeres mere diskret i footeren af din hjemmeside.
Det kan være effektivt at anvende en mindre skriftstørrelse og en mere nedtonet farve for disse links. På denne måde undgår du at forstyrre brugerens primære interaktion med siden, samtidig med at du opretholder den nødvendige navigation, men samtidig henviser til disse, nogle gange, meget vigtige sider.
Ved at placere mindre vigtige links længere nede på siden, sikrer du også, at de ikke tildeles lige så meget linkværdi, som de links, du viser længere oppe på siden. Samtidig nedjusterer du værdien af dem, ved at køre med mindre tydelige links, både i forhold til størrelse, men også i forhold til farve, hvilket er best practice, da dine handelsbetingelser ikke nødvendigvis, har behov for særlig meget af din totale linkværdi – det er ikke sider, der konkurrerer med andre websites og behovet for linkværdi, er derfor markant mindre end for de sider på dit website, der er målrettet konkurrenceprægede søgeord i Googles SERPs.
