Att välja rätt typsnitt kan vara en utmaning. Det beror exempelvis på vilken känsla du vill att ditt varumärke ska förmedla. Då kan det vara bra att skapa en typsnitt lista som hjälper dig för kommande jobb!
Några av mina favorittypsnitt som både är gratis, snygga och funkar för webb och tryck är:
- Avenir Text
- Freight Text
- IBM Plex Sans
- Metropolis
- Proxima Nova
- Roboto
- Source Sans Pro
- Work Sans
Mer om dessa typsnitt (och vad du ska tänka på när du väljer ett typsnitt) längre ner i artikeln.
Innehåll
Varför ska du välja ett bra typsnitt?
Det finns många anledningar till att välja ett bra typsnitt:
- Ett snyggt typsnitt hjälper till att förmedla rätt känsla för innehållet du skriver. Om du exempelvis använder ett typsnitt som Comic Sans istället för Helvetica så kan du räkna med att ditt budskap upplevs som mindre seriöst, och att färre personer håller med dig om ditt budskap. Vilket i sin tur exempelvis påverkar hur bra din hemsida konverterar.
- Vissa typsnitt är lättare att läsa än andra i exempelvis brödtext och liknande. Om du gör din text mer lättläst (exempelvis genom att öka radavstånd och att ha en bra kerning) så gör du det lättare för andra människor att förstå ditt innehåll, till exempel på din blogg eller hemsida. Just detta tipset kommer från kursen Design Rules: Principles + Practices for Great UI Design av Joe Natoli, som har en fantastisk kurs om både typsnitt och mycket mer när det gäller design.
- Att använda för liten storlek på text, eller att ha dålig kontrast på brödtext är ett annat klassiskt usability-problem som påverkar användarupplevelsen.
Gratis typsnitt
IBM Plex Sans
om namnet antyder är IBM Plex Sans just IBMs egna typsnitt. Det här är ett typsnitt som enligt mig passar om du vill ha ett typsnitt med lite mer teknisk känsla. Samtidigt tycker jag att IBM Plex Sans-typsnittet har lite “edge” och karaktär. Det blir inte för stelt och tråkigt helt enkelt.
Du hittar IBM Plex Sans på Google Fonts.
Metropolis
Metropolis är lite av en gratis variant av Proxima Nova. Det är ett schysst typsnitt för dig som inte vill lägga massor med pengar på ett bra typsnitt, men ändå ha ett snyggt typsnitt som är väldigt läsbart.
Du hittar Metropolis på FontSquirrel.
Roboto
Roboto är ett typsnitt som jag använder mig mycket av i jobbsammanhang. I och med att jag designar en hel del grafiska gränssnitt för större applikationer som bygger på Material Design så blir Roboto en naturlig startpunkt. Roboto är också typsnittet som används för Android-telefoner. För mig är även Roboto ett kanonbra utgångsläge när jag gör prototyper och designer för hemsidor.
Du hittar Roboto via Google Fonts.
Source Sans Pro
Source Sans Pro är ett typsnitt som påminner lite om Lato och Open Sans. Däremot är Source Sans Pro inte lika välanvänt, vilket brukar vara positivt om du vill sticka ut lite mer! Detta är ännu ett bra typsnitt om du vill ha ett läsbart typsnitt, eller ett typsnitt som funkar bra för webb. Source Sans Pro kommer även i många olika vikter och variationer.
Du hittar Source Sans Pro på Adobe Fonts.
Work Sans
Work Sans är ett underskattat typsnitt som jag ganska sällan hör att folk använder! Jag tror den första gången jag hörde talas om det var genom Erik D. Kennedys fantastiska artikel-serie om hur du gör snygga UIs. Det är ett typsnitt som även är väldigt läsbart på mindre skärmar (exempelvis på mobil).
Du hittar Work Sans på Google Fonts.
Betalda typsnitt – lista
Avenir Next
Avenir Next är ett riktigt trevligt typsnitt som jag tycker funkar bra till exempelvis iOS. Det är även ett typsnitt som passar bra för statistik och siffror i allmänhet. Väldigt bra val av typsnitt om du är villig att betala lite för ett bra typsnitt.
Du hittar Avenir Next på My Fonts.
Freight Text
Wow! Freight Text är kort sagt ett förbannat snyggt typsnitt. Detta är också ett typsnitt som kostar pengar, men det är värt det – alla gånger om! Det här är ett typsnitt som passar bra för brödtext. Du kan också kombinera Freight Text med exempelvis Freight Sans och Freight Big om du vill ha ett matchande typsnitt för rubriker till exempel.
Du hittar Freight Text på Adobe Fonts.
Proxima Nova
Proxima Nova är lyx-varianten för dig som gillar typsnitt i stil med Metropolis. Detta är ett otroligt läckert typsnitt som funkar klockrent för webb. Proxima Nova har funnits sedan 2005, och är ett typsnitt som ger bra läsbarhet. Proxima Nova kommer även i många varianter.
Du hittar Proxima Nova på Adobe Fonts.
Var hittar jag fler gratis typsnitt, eller snygga typsnitt i allmänhet?
- Google Fonts är en fantastisk källa till typsnitt som funkar bra för webb. Du ser hur typsnitten ser ut direkt i webbläsaren, vilket är väldigt smidigt.
- Font Squirrel har många bra typsnitt som du kan använda dig av gratis.
- DaFont är ett annat bra alternativ för gratis typsnitt.
- 1001FreeFonts är ytterligare en sida som har en hel del bra typsnitt gratis.
- Adobe Fonts är ett bra alternativ om du redan använder dig av andra Adobe-produkter som Adobe Photoshop, Illustrator med flera. Här finns det tusentals typsnitt, och allt ingår i din prenumeration på Adobe Creative Cloud.
Ett ytterligare tips är att söka på google efter “<namnet på ditt typsnitt> free download”, så brukar du hitta fler sidor som har ditt typsnitt. Se dock till att läsa igenom licenserna för typsnittet ordentligt så att ditt typsnitt verkligen är gratis att använda för kommersiellt bruk, eller om du behöver en licens.
Tips till hur du väljer rätt typsnitt
- Utgå först från vilken känsla du vill förmedla med din design – ska det vara seriöst och trovärdigt, eller coolt och “edgy”? Eller avslappnad? Eller kännas mer gjort “för hand”?
- Leta efter inspiration på hur andra använder typsnitt. Exempel på sidor där du hittar mycket inspiration om design är Pinterest, eller Dribbble. I vissa fall står det även vilka typsnitt (samt färger etc) som används. Men framför allt får du en bättre förståelse för vilken typ av designer du gillar och inte gillar. Men letar du typsnitt på exempelvis Pinterest så kan du söka på “best font for X”, eller “best fonts <årtal>”, eller “best font combinations <årtal>”.
- Ett annat sätt att se vilket typsnitt en hemsida använder är att installera WhatFont för Chrome, som är ett kanonbra plugin för att direkt se typsnitt som en hemsida använder.
- Creative Market har också många grymma typsnitt, penslar med mera för dig som vill ha något lite mer unikt. Creative Market är en riktigt bra hemsida som är rolig att bara “fönstershoppa” lite i.
- Fundera på om du ska använda en serif eller sans-serif. Sans-serif typsnitt ger ofta lite mer klassiska typ av känsla, medan Serifer känns mer moderna.
- Välj typsnitt med bra “kerning”. Det gör typsnitten mycket mer läsbara.
- Välj en bra ratio mellan olika typsnitt (en så kallad “typografisk skala”). Design for Hackers har en riktigt bra och enkel guide om hur du får till en bra skala mellan olika storlekar för typsnitt. För webb finns det även bra generatorer i stil med Type Scale.
- Säkerställ att du har en licens för typsnittet du ska använda! Vissa typsnitt är bara gratis om du endast använder de för icke-kommersiella ändamål. Då måste du ha en licens och rätt att använda typsnittet, annars bryter du mot upphovsrättslagen.
Typsnitt lista – som finns på din dator (för användning i exempelvis word)
- Wavian har en bra typsnitt lista som finns tillgängliga på din dator. Numera när du använder word får du dessutom en preview på hur varje typsnitt ser ut, vilket är väldigt smidigt.
- Microsofts lista över typsnitt som är tillgängliga på Windows 10 samt för Windows 11 kan också vara användbar.
Lista över typsnitt som finns till både Mac och PC
Om du vill säkerställa att ditt dokument ser likadant ut på både Mac och PC så finns det vissa typsnitt som finns till båda plattformarna, bland annat:
- Arial Black
- Comic Sans (undvik helst detta eftersom det ser rätt oseriöst ut!)
- Courier New
- Georgia
- Impact
- Lucida
- Palatino
- Tahoma
- Times New Roman
- Verdana
Att använda något av dessa typsnitt kan vara bra om du ska skicka över ett dokument till någon annan. Till exempel om du och din kompis ska redigera samma textdokument.
Om du däremot bara behöver skicka en kopia till någon annan för att läsa så kan du exportera dokumentet som PDF – då följer nämligen typsnittet med, så att det ser likadant ut på bådas datorer!
Så här installerar du ett typsnitt på din dator
- För Mac så laddar du först ner typsnittet. Typsnittet kommer ofta i en zip-fil. Leta upp mappen som ofta heter “Downloads” (eller ”Hämtade filer”) och dubbelklicka den nedladdade zip-filen. Därefter kan du dubbelklicka på typsnittet och välja “Installera typsnitt” i rutan som kom upp.
- För PC så är processen liknande. Ladda ner zip-filen som typsnitten kommer i. Högerklicka zip-filen och välj “Packa upp här”. Dubbelklicka på filerna för typsnitten (som ofta är i TTF-format eller OTF-format) och välj “Installera”.
Lämna ett svar