tirsdag, mars 19, 2024

Piff opp designet og teksten med Google fonts API

Når man benytter seg av fonter i CSS-kode anbefales det å bruke fonter som følger med operativsystemer som windows eller OSX. Dette er font-typer som Arial, Times New Roma, Georgia og et fåtall andre fonter.

Bruker man andre fonter må man først legge disse opp på FTP-serveren og så bruke en del tid på å legge de til i CSS-koden. Uten å gjøre det risikerer man at brukeren som ser på nettsiden ikke har fonten installert på sin enhet, noe som igjen gjør at man får opp en annen font enn det som er brukt på nettsiden. Dette gjør at hjemmesiden får et litt annerledes utseende enn du kanskje hadde ventet.

Nå har Google gjort det enkelere å bruke andre fonter via sitt eget Google fonts API – www.google.com/webfonts.

Hvordan gjør man det?

På linken nedenfor finner du en guide laget av google på hvordan du legger til en font fra Google sin font-database. Følg disse instruksene så skal kan du snart kunne bruke de nye fontene.

https://developers.google.com/webfonts/docs/getting_started

Her er en kort guide, men bruk heller Google sin i lenken ovenfor:

  1. Finn en font via Google Font sine nettsider.
  2. Klikk på «Quick-use» på den fonten du ønsker å bruke
  3. Under demo-bildet av fonten klikker du på måten du ønsker å inkludere fonten på, f.eks. @import
  4. Bruker du @import kan du lime denne linjen inn øverst i din CSS-kode eller fil.
  5. Kopier så CSS-koden oppgitt. Denne limer du inn der du ønsker å bruke den nye fonten.

Du kan også laste ned fontene fra Google sin tjeneste ved å trykke «Add to collection» på et utvalg av fonter og deretter velge «Downlolad collection». du trenger da bare å slippe disse font-filene i font-mappen inne i windows-katalogen på din PC og bruke de i f.eks. Photoshop.

Latest news
Related news