Meny

Typsnitt och dess användning

Bokstävernas form kallas för typsnitt eller teckensnitt (det engelska ordet font används för det mesta synonymt). Precis som det är angeläget att finna ett tonläge som passar textens ämne är valet av typsnitt viktigt då det påverkar själva presentationen av texten.

Seriffer (antikva) och linjära (sans-seriffer)

Typsnitt kan inordnas i två kategorier: seriffer och linjära typsnitt. För seriffer gäller att bokstäverna har tvärgående streck i ändarna medan linjära består av raka linjer utan variation i ändarna (se nedan för en lista med typsnitt).

Exempel på typsnitt med Georgia och Arial

Typsnitt med seriffer kategoriseras under antikvatypsnitt. Typsnitt utan seriffer kategoriseras under sans-seriffer (ordet sans kommer från franskan och kan översättas till utan). Ibland stöter man på ordet grotesker, vilket är ett alternativt namn för sans-seriffer.

När det gäller teckenstorlek (eller grad som det traditionellt heter i sammanhanget) anges dessa i punkter (pt). Sedan datorernas intåg anges storleken alternativt i pixlar (px), vanligt i webbsammanhang är också enheter som em och procent. Typsnitten kan därtill utformas med fet (på engelska bold) eller kursiv (på engelska italic) stil.

En ytterligare faktor är teckenavstånd. Arial är "tätare" än Verdana, vilket framgår av bilden nedan med samma text i samma teckengrad (14 px), först med Arial och sedan med Verdana.

Exempel på typsnitt med Arial och Verdana

Notera att ord som till exempel innehåller två ´l´ efter varandra eventuellt kan bli svåra att utläsa med Arial. I takt med att skärmarnas upplösning har förbättrats har dock problemen med Arial minskat och idag är Arial det vanligaste typsnittet på webben.

Handstilsfonter (skripter)

Andra typsnitt liknar handskrift och kallas handstilsfonter eller skripter. De är främst avsedda för snyggare presentationer medan de är olämpliga för längre texter.

Exempel på typsnitt

Det finns mängder av typsnitt varav de flesta är påhittade och sällan dyker upp i ordinära textsammanhang. Några av de mer traditionella och fortfarande vanliga typsnitten kan du se i de följande listorna (längre ned finns också jämförelser).

Seriffer (antikvatypsnitt)

Linjära typsnitt (sans-seriffer)

Typsnitt och upphovsrätt

De typsnitt som nämnts ovan är alla fria att använda utan restriktioner. I andra fall kan du behöva köpa en licens.

Rekommendationer om typsnitt

Text som består av bokstäver med seriffer har högre läsbarhet och är därför att föredra vid längre texter (åtminstone är detta den traditionella uppfattningen). Linjära typsnitt används ofta för rubriker då de ger intryck av stadga. Sedan internets genombrott har nya riktlinjer till viss del börjat gälla, läs mer om detta i artikeln Att skriva för webben.

Webbsäkra typsnitt

Webbsäkra typsnitt är sådana som i regel finns installerade på användarens dator/surfplatta/mobil. Detta krävs normalt (om typsnittet inte hämtas externt via en server) för att det ska visas.

Primära webbsäkra typsnitt:

I många fall webbsäkra typsnitt:

Typsnitt som är klart vanligare i PC än Mac eller vice versa:

Observera att det alltså kan skilja sig mellan PC och Mac. Även i andra kategorin kan det gälla en stor övervikt till antingen PC eller Mac. Därför ska alltid minst ett reservtypsnitt anges vid publicering på webben. På denna sida är till exempel font angivet enligt:

cssfont-family:Georgia,"Times New Roman",Times,serif

Georgia är alltså vad som gäller i första hand, men om typsnittet inte är installerat kommer Times New Roman fungera som första reserv.

Exempel på typsnitt och användbarhet

Arial - är idag det mest använda typsnittet på webben. Enligt cssfontstack.com finns typsnittet i januari 2019 installerat på 99,84 % (Windows) respektive 98,74 % (Mac) av användares datorer.
Verdana - det vanligaste alternativet till Arial bland linjära typsnitt. Enligt cssfontstack.com finns typsnittet i januari 2019 installerat på över 99 % av datorer med Windows eller Mac.
Trebuchet - ett annat populärt alternativ till Arial och Verdana. Något mindre och tätare än Verdana, fast med bredare tecken än Arial. Enligt cssfontstack.com finns typsnittet i januari 2019 installerat på 99,67 % (Windows) respektive 97,12 % (Mac) av användares datorer.
Tahoma - populärt alternativ till Arial och Verdana. Det liknar mest Verdana, fast är något tätare. Enligt cssfontstack.com finns typsnittet i januari 2019 installerat på 99,95 % (Windows) respektive 91,71 % (Mac) av användares datorer.
Georgia - det mest använda typsnittet med seriffer på webben. Enligt cssfontstack.com finns typsnittet i januari 2019 installerat på 99,40 % (Windows) respektive 97,48 % (Mac) av användares datorer.
Times New Roman - avsett för tryckt text och mindre lämpligt för läsning på skärm. Dock användbart som en font att falla tillbaka på efter Georgia.
Helvetica - kan ses som motsvarigheten till Arial på Mac. Används främst som reservtypsnitt till Arial på webben.
Garamond - ett av de mest använda typsnittet i tryck, men sällan använt på webben. Garamond är ingen webbsäker font medan den ofta saknas på en Mac-användares enhet.
Courier New - ett så kallad monospace-typsnitt där varje tecken tar upp lika stor plats. Används för särskilda behov och rekommenderas ej för rubriker eller vanlig text.

Jämförelser av typsnitt

Här följer jämförelser av några av de mest rekommenderade typsnitten i antikvatypsnitt för läsning på skärm. Eftersom typsnitt kan se olika bra ut beroende av storlek visas även jämförelser i två textstorlekar.

Enligt söka inom tiden jäst stora vidsträckt denna ser, jäst faktor bäckasiner stig rot lax. (Arial 14px)

Enligt söka inom tiden jäst stora vidsträckt denna ser, jäst faktor bäckasiner stig rot lax. (Verdana 14px)

Enligt söka inom tiden jäst stora vidsträckt denna ser, jäst faktor bäckasiner stig rot lax. (Trebuchet 14px)

Enligt söka inom tiden jäst stora vidsträckt denna ser, jäst faktor bäckasiner stig rot lax. (Tahoma 14px)

Enligt söka inom tiden jäst stora vidsträckt denna ser, jäst faktor bäckasiner stig rot lax. (Arial 16px)

Enligt söka inom tiden jäst stora vidsträckt denna ser, jäst faktor bäckasiner stig rot lax. (Verdana 16px)

Enligt söka inom tiden jäst stora vidsträckt denna ser, jäst faktor bäckasiner stig rot lax. (Trebuchet 16px)

Enligt söka inom tiden jäst stora vidsträckt denna ser, jäst faktor bäckasiner stig rot lax. (Tahoma 16px)

Att rätt typsnitt visas förutsätter att det finns installerat på datorn. (Exempeltext från vogelius.se har använts.)

Mer läsning

Länkar till andra sidor där du kan läsa vidare.