Sådan vælger du den bedste skrifttype til din hjemmeside

At vælge den rigtige skrifttype til din hjemmeside er en mindre enkel opgave, end det umiddelbart ser ud til.

Vælge et par skrifttyper, du synes er flotte, og smide dem på din side? Ikke så hurtigt.

Langt fra enhver skrifttype egner sig til hjemmesider. Og det handler ikke kun om det visuelle aspekt: tilfældig anvendelse af skrifttyper kan også føre til tekniske problemer (mere om dette senere).

Efter at have udviklet 30+ hjemmesider har jeg en ret god idé om, hvad der kræves for at vælge skrifttyper til en hjemmeside. I denne korte artikel vil du læse alt, hvad du skal vide.

7 tips til at vælge en skrifttype til din hjemmeside

Dette er mine vigtigste tips til at vælge skrifttype til din side.

1. Læsbarhed frem for alt

Dette kan måske virke som en selvfølge. Men alligevel støder du overraskende ofte på hjemmesider med en skrifttype, der ikke er særlig let at læse.

Kreativt udseende, svungne skrifttyper kan give din side en unik karakter. Men så snart læsbarheden er i fare, er det klogt at vælge noget mindre eventyrlystent.

Sørg desuden for, at din skrifttype er mindst 16 pixels stor (18 pixels eller endda mere fungerer ofte bedre).

Og at skrifttypen er læselig på alle skærmstørrelser (tjek også din side på din telefon) er også meget vigtigt.

2. Vælg ikke mere end to skrifttyper

Vælge mere end to skrifttyper bringer et par problemer med sig:

• Din side vil se rodet ud
• Du vil bemærke en negativ effekt på indlæsningstiderne for din hjemmeside

Vælg en skrifttype til dine titler, og vælg en til brødteksten (som bruges i dine afsnit osv.).

På mange af mine hjemmesider holder jeg mig endda til blot en enkelt skrifttype. For det meste vælger jeg dette på grund af indlæsningstider. En virkelig mærkbar indvirkning vil en anden skrifttype ikke have på hastigheden af din side, men for en hastighedsaficionado som mig tæller hvert millisekund.

3. Vælg en skrifttype, der passer til dit brand

Er dit brand:

• Moderne og minimalistisk? Vælg da en sans-serif skrifttype (for eksempel Lato, Open Sans).
• Elegant og professionelt? Så passer serif bedre (for eksempel Merriweather, Playfair Display).
• Kreativt og let? Display- eller skriftskrifttyper kunne fungere (men som sagt ovenfor, hold øje med læsbarheden!).

Du forventer en anden skrifttype på en yoga-hjemmeside end på en advokatfirmaside.  

4. Skab kontrast ved at kombinere skrifttyper

Her er et eksempel på en hjemmeside, som jeg administrerer, hvor jeg har valgt to stærkt kontrasterende skrifttyper:

PT Serif til brødteksten og Montserrat til titlerne.

Stilkollisionen af disse skrifttyper fungerer meget godt. Når du vælger to skrifttyper, vil du ikke have, at de ligner hinanden for meget.

Længere nede i denne artikel finder du flere eksempler på skrifttyper, der matcher godt med hinanden.

EKSTRA TIP: Enhver professionelt designet hjemmeside følger en fast ratio, når det kommer til de forskellige overskrifter (H1, H2, H3 osv.) og standardteksten. Vælg størrelse på dine forskellige teksttyper ikke ud fra, hvad der “føles godt”. Et værktøj som Typescale kan sørge for, at størrelsen på dine forskellige teksttyper er godt afstemt størrelsesmæssigt.

5. Se din skrifttype på forskellige browsere og enheder

Nogle gange kan en skrifttype ikke gengives godt på en bestemt browser eller enhed. Derfor er det vigtigt at teste det godt.

6. Pas på ydeevnen

Brug såkaldte web safe skrifttyper eller skrifttyper, der er optimeret til hurtige indlæsningstider.

Både Google Fonts og Adobe Fonts tilbyder gratis, website-optimerede skrifttyper (mere om Google Fonts nedenfor).

7. Tænk på tilgængelighed

I tråd med det første punkt: Internettet bruges selvfølgelig også af svagtseende og ældre.

Især for disse grupper er tilgængeligheden af din hjemmeside meget vigtig.

Sørg for, at farven på din skrifttype står i stærk kontrast til baggrunden på din side. Og sørg for, at din tekst ikke bliver for tynd eller svunget.

Mit råd: brug Google Fonts

Som hjemmesideejer ville jeg, hvis det er muligt, altid bruge Google Fonts. Dette er hvorfor:

• Udbuddet er enormt. Da der er mere end 1.000 skrifttyper, skal du til hvert projekt kunne finde en passende skrifttype.
• Fungerer godt på alle browsere og enheder. Google fonts er web-safe hvilket betyder, at du ikke behøver bekymre dig om, at det ser dårligt ud på en bestemt browser eller gadget.
• Hurtige indlæsningstider. Google Fonts hostes på Googles lynhurtige servere.
• Nemme at integrere. Google tilbyder let at følge instruktioner, som gør det let for dig hurtigt at få deres skrifttyper til at fungere på din side.
• Det er gratis. Du har ingen licensomkostninger som med nogle andre skrifttyper.

Bruger du WordPress? Så er du heldig. Mange populære WordPress temaer som Kadence og GeneratePress har en Google Fonts integration.

Selv bruger jeg Google Fonts på alle mine hjemmesider.

Find ud af, hvilken skrifttype en hjemmeside bruger

Er du kommet på en hjemmeside, hvor du kan lide skrifttypen? Sådan kan du (i Chrome) se, hvilken skrifttype der bruges.

Vælg tekststykket, højreklik og vælg Inspektér. Scrol ned i det skærmbillede, der nu vises ved afdelingen Styles, og på et tidspunkt kommer du til den skrifttype, der bruges.

Eksempler på skrifttyper, der passer godt sammen

Hvis du ønsker at bruge flere skrifttyper, kan du prøve et af de nedenstående par.

Via Google Fonts kan du sammensætte endnu flere skrifttypepar.