Typografi, hierarki og læsbarhed i digital media
Sådan bruger du skrift til at lede øjet og få budskabet frem — på skærm såvel som på tryk
En stor del af digital medias håndværk handler om noget, mange ikke lægger mærke til, hvis det er gjort godt: typografien. Skriften bærer budskabet, og en dårlig typografisk beslutning kan gøre selv det bedste indhold svært at læse. Derfor er typografi en disciplin, du skal beherske lige så sikkert som farvevalg og billedbehandling.
§Skriftfamilier og deres personlighed
Skrifttyper deles overordnet i familier, der hver har deres eget udtryk. Serif-skrifter har små fødder for enden af bogstavernes streger og opleves som klassiske og seriøse — de bruges ofte til lange tekster i print. Sans-serif-skrifter mangler fødderne, virker enklere og mere moderne, og er derfor den mest udbredte skrifttype til skærme. Monospace-skrifter har samme bredde på hvert tegn og bruges typisk til kode. Display-skrifter er designet til at være dekorative og fungerer bedst i store overskrifter, aldrig i brødtekst.
§Grundbegreber: kerning, tracking og linjeafstand
- 01Kerning — mellemrummet mellem to bestemte bogstaver, justeret så par som 'AV' eller 'To' ikke ser for tætte eller glisne ud.
- 02Tracking (bogstavafstand) — den generelle afstand mellem alle bogstaver i et ord eller en tekst, ofte øget en smule i versaler for at lette læsningen.
- 03Linjeafstand (leading) — afstanden mellem tekstlinjer. For lille linjeafstand gør en tekst svær at følge; for stor linjeafstand splitter afsnittet visuelt op.
- 04X-højde — højden på skriftens små bogstaver uden overlængde eller underlængde, fx et lille 'x'. En stor x-højde gør en skrift mere læsbar på små skærme.
§Hierarki — led øjet gennem siden
Et visuelt hierarki fortæller læseren, hvad der skal læses først, næst og sidst. Det bygges typisk med størrelse, vægt (tynd, normal, fed) og farve: en stor, fed overskrift trækker øjet først, en mellemstor underrubrik følger, og brødteksten kommer sidst. Uden et tydeligt hierarki bliver alt lige vigtigt på siden — og når alt råber lige højt, hører man reelt ingenting.
§Skrifttyper og deres typiske brug
| Kategori | Kendetegn | Typisk brug |
|---|---|---|
| Serif | Små fødder på bogstaverne, klassisk udtryk | Lange tekster i print, seriøst udtryk |
| Sans-serif | Enkle streger uden fødder | Skærme, web, moderne udtryk |
| Monospace | Alle tegn har samme bredde | Kode, tekniske dokumenter |
| Display | Dekorativ, ofte unik form | Store overskrifter og logoer, aldrig brødtekst |
§Kontrast og tilgængelighed
Typografi er ikke kun æstetik — den er også et tilgængelighedskrav. Ifølge WCAG (Web Content Accessibility Guidelines) skal almindelig tekst have et kontrastforhold på mindst 4,5:1 mod baggrunden, mens stor tekst kan nøjes med mindst 3:1. Lav kontrast, fx lysegrå tekst på hvid baggrund, kan se elegant ud i et moodboard, men gør teksten reelt ulæselig for mange brugere — også dem uden synsnedsættelse, hvis de sidder i stærkt sollys på en mobilskærm.
§Typografiske faldgruber
- 01For lille skrift på mobil — test altid design på en reel lille skærm, ikke kun på din store designskærm.
- 02For lang linjelængde — for brede tekstspalter gør det svært for øjet at finde tilbage til næste linje.
- 03Centreret brødtekst i lange afsnit — virker flot i små mængder, men er trættende at læse i længden.
- 04Manglende overholdelse af skriftlicens — en flot skrifttype er ubrugelig, hvis du ikke har lov til at bruge den i det færdige produkt.
“God typografi er usynlig — den forsvinder, og kun budskabet står tilbage. Dårlig typografi er det eneste, læseren husker.”
— Faglig betragtning om typografi i digital media