Skriften på webben

Tiden med skriftmessig monotoni på web er endelig over. Hvilke fonter skal nye Vox Publica få?

Et av de vik­tig­ste ele­mentene i design generelt er skrift. Typografiens his­to­rie har frem­brakt et utall mer eller min­dre forskjel­lige skrift­typer — fra rist­ede romerske ver­saler i stein til ikoniske Hel­veti­ca på elek­tro­n­iske reklame­boards. Skrift­type­ne har van­dret fra medi­um til medi­um og bær­er med seg både følelse og his­torikk. Men frem til helt nylig har webben vært preget av en skriftmes­sig monot­o­ni begrenset til et knippe fonter. Kan­skje både en hode­pine og ‑pute for designere, men nå er heldigvis denne tiden defin­i­tivt over.


I arbei­det med å fornye Vox Pub­li­ca er font­valg et sen­tralt tema. I vårt orig­i­nale design bruk­er vi kom­bi­nasjo­nen Geor­gia (hov­e­dover­skrifter), Ver­dana (sekundærover­skrifter) og Ari­al (brødtekst), i til­legg er logoen og plakat­tek­sten Futu­ra. Dette er en van­lig kom­bi­nasjon­sløs­ning og såkalt “best prac­tice” for typografi; den klas­siske mag­a­sin-typografien bruk­er mot­set­nin­gen mel­lom serif og sans-serif som design­skille mel­lom over­skrift og brødtekst. Serif (Geor­gia) har små føt­ter på bok­stavene som man kjen­ner fra gam­le skrive­mask­in­er, mens sans-serif (Ari­al, Ver­dana, Futu­ra) betyr “uten”. Videre er lese­lighet en sen­tral nøkkel for fontvalg.

Når man pro­gram­mer­er for web vel­ger man imi­dler­tid også flere sub­sti­tutt-fonter for hvert ele­ment for å være sikker på at bruk­eren kan lese tek­sten — dette for­di fontene hentes fra bruk­erens egen maskin og får sitt utseende idet siden hentes inn i net­tle­seren. Dette har både ført til mange uheldige kom­bi­nasjon­er og har begrenset val­gmu­lighetene i design siden det forut­set­ter at fonten må ligge i bruk­erens arkiv.


Googles web-fonter endr­er dette. Fontene hentes her inn fra Googles arkiv på nett idet siden leses, litt som å inklud­ere (embed­de) en video fra YouTube på en blogg. Google er på ingen måte alene om dette — det fins plen­ty gratis- og betal­ingsløs­ninger. En annen løs­ning for web-fonter involver­er at man leg­ger hele fonten på sin egen web-serv­er slik at fonten lastes der­fra og at man der­for har alt på ett sted.

Vårt arbeid med fontene startet med Googles web-fonter og et ønske om å videre­føre spe­sielt det mod­ernistiske preget i Futu­ra fra logoen og plakat­tek­stene. Val­get falt der­for først på Josefin/Josefin sans. Det ble imi­dler­tid raskt klart at denne fonten får stor grad av forvrengn­ing i små typer. Spe­sielt går dette ut over lese­ligheten på mobil.


Neste alter­na­tiv er Googles Droid som finns i både serif og sans-serif. Denne fonten er spe­sielt utviklet for mobil/le­se­brett-oper­a­tivsys­temet Android, og fonten har fått veldig gode kri­tikker for å ha god lese­lighet og dis­tinkt karak­ter. Det ble imi­dler­tid raskt klart at Droid oppleves som litt utfly­tende i små stør­relser på nye mobilskjermer.

Etter en ny runde research fant vi at prob­lemet allerede langt på vei er løst av Google selv. Fonten Roboto er spe­sielt utviklet for skarp gjen­givelse på høy­op­pløselige mobil­skjer­mer, og vår test­ing støt­ter dette. Rik­tig­nok har mot­tagelsen av Roboto vært svært bland­et. De ver­ste kri­tik­erne har kalt den en fire­hodet-franken-font.


Nå er ikke redak­sjo­nen i Vox Pub­li­ca for font­nerder å reg­ne, og vi har først å fremst vært ute etter god lese­lighet, kon­sis­tens og skarp gjen­givelse. Men Droid har unek­telig mer karak­ter enn Roboto. Kon­klusjo­nen blir der­for å bruke Droid for ulike over­skrifter og nav­i­gasjon som skal være i stor type, de nye logoene er også basert på Droid, mens Roboto for­be­holdes brødtekst og små typer. Slik får vi også testet to teknolo­gi­er ved å bruke én inklud­ert web-font (droid) og én server­basert (roboto).

Bruk av web-fonter på begge måtene vi har val­gt vil selvføl­gelig med­føre noe økt last­ingstid for leserne, og dette er kan­skje den største hak­en med å for­late våre tidligere web-safe fonter. Foreløpige tester tyder imi­dler­tid på at dette er et min­i­malt prob­lem, og vi føler oss sikre på at vi har tatt gode valg både estetisk og funksjonelt. Vi hold­er imi­dler­tid fort­satt døren på gløtt hvis våre lesere skulle komme med vek­tige argu­menter eller bedre alternativer.

Om du har erfaringer med bruk av nye web-fonter hør­er vi gjerne fra deg.

TEMA

V

ox Publ
ica

34 ARTIKLER FRA VOX PUBLICA

FLERE KILDER - FAKTA - KONTEKST

2 KOMMENTARER

  1. Gorm Eriksen says:

    Vi har eksper­i­mentert litt med web fonter i en ny blogg mal for departe­mentene og kom nesten i mål før vi måtte gå over til å bruke bilder i stede. 

    Grun­nen tror vi er dårlig font hint­ing på fonten vi bruk­te og dette gjorde at den så forskjel­lig ut når den var under ca. 22px. Du kan lese mer om dette her: http://en.wikipedia.org/wiki/Font_hinting

    Dessuten er moralen at det er ekstremt lite rom for feil i fonter når man snakker logo.

  2. Hei Gorm. Takk for lenke — det er nok “hint­ing” vi opplevde som prob­lemet både i forhold til forvrengnin­gen av Josefin og i utfly­tin­gen av droid. Typografi på web er svært vanske­lig og fall­gru­vene mange, og jeg tror ikke det er siste gan­gen vi kom­mer til å oppleve prob­le­mer med dette.

til toppen