Logga in
 |
Den här guiden visar hur du kommer igång med Google Fonts och laddar fonterna direkt i ditt dokument eller CSS-fil.
Teckensnitt, typsnitt och font är egentligen olika benämningar på samma sak; en uppsättning bokstäver, siffror och tecken med ett karakteristiskt utseende och med ett och samma namn. Läs mer om de olika benämningarna på https://sv.wikipedia.org/wiki/Typsnitt
Har du svårt att välja font hittar du några tips här (Andreas Johansson UX)
Här är några live-exempel på inbäddade webbfonter som hämtas direkt från Google's servrar. Snabbt och enkelt att hämta och använda!
Exempel på teckensnitt som använts länge på webbsidor är Times New Roman, Arial, Georgia och Verdana. De kallas för systemfonter och är sk "webbsäkra" teckensnitt eftersom de redan finns installerade i de flesta enheter och följer med de programvaror som finns installerade.
En metod att säkerställa att innehållet i din webbsida inte avviker helt från originalet om inte det valda teckensnittet finns är att lägga till ett eller flera ersättningsteckensnitt. Om det valda teckensnittet inte finns visas istället den valda erättningsfonten.
Exemplet nedan har Verdana som valt teckensnitt. Om inte Verdana finns i den enhet som visar webbsidan så ersätts den med Arial. Om inte Arial finns så ersätts den av Helvetica osv:
Webbfonter är de teckensnitt du köper eller hämtar gratis från olika tjänster som tillhandahåller dessa. Teckensnitten levereras i en fil som du placerar på din webbserver och anger sökväg till.
Du använder @font-face i din CSS-kod för att hämta teckensnittet:
Exempel på tjänster som erbjuder webbfonter är: Typekit, Fonts.com och WebType
Inbäddade webbfonter (embedded web fonts) är teckensnitt som inte behöver hämtas som en fil och placeras på din webbserver. De hämtas istället direkt från en tjänst (Web font embedding services) som tillhandahåller fontfilen på sin egen webbserver.
Den här guiden visar hur du kommer igång med Google Fonts och laddar fonterna direkt i ditt dokument eller CSS-fil.
Klicka på ikonen nedan för att läsa hela guiden med kod och beskrivningar!
|
OBS! Om du vill du läsa hela guiden måste du vara WDS medlem!
Du kan beställa tjänsten WDS medlem här »
Är du redan WDS medlem?
Klicka på ikonen "WDS medlem" högst upp för att läsa hela guiden!
skriv ut »