Et av de viktigste elementene i design generelt er skrift. Typografiens historie har frembrakt et utall mer eller mindre forskjellige skrifttyper — fra ristede romerske versaler i stein til ikoniske Helvetica på elektroniske reklameboards. Skrifttypene har vandret fra medium til medium og bærer med seg både følelse og historikk. Men frem til helt nylig har webben vært preget av en skriftmessig monotoni begrenset til et knippe fonter. Kanskje både en hodepine og ‑pute for designere, men nå er heldigvis denne tiden definitivt over.
I arbeidet med å fornye Vox Publica er fontvalg et sentralt tema. I vårt originale design bruker vi kombinasjonen Georgia (hovedoverskrifter), Verdana (sekundæroverskrifter) og Arial (brødtekst), i tillegg er logoen og plakatteksten Futura. Dette er en vanlig kombinasjonsløsning og såkalt “best practice” for typografi; den klassiske magasin-typografien bruker motsetningen mellom serif og sans-serif som designskille mellom overskrift og brødtekst. Serif (Georgia) har små føtter på bokstavene som man kjenner fra gamle skrivemaskiner, mens sans-serif (Arial, Verdana, Futura) betyr “uten”. Videre er leselighet en sentral nøkkel for fontvalg.
Når man programmerer for web velger man imidlertid også flere substitutt-fonter for hvert element for å være sikker på at brukeren kan lese teksten — dette fordi fontene hentes fra brukerens egen maskin og får sitt utseende idet siden hentes inn i nettleseren. Dette har både ført til mange uheldige kombinasjoner og har begrenset valgmulighetene i design siden det forutsetter at fonten må ligge i brukerens arkiv.
Googles web-fonter endrer dette. Fontene hentes her inn fra Googles arkiv på nett idet siden leses, litt som å inkludere (embedde) en video fra YouTube på en blogg. Google er på ingen måte alene om dette — det fins plenty gratis- og betalingsløsninger. En annen løsning for web-fonter involverer at man legger hele fonten på sin egen web-server slik at fonten lastes derfra og at man derfor har alt på ett sted.
Vårt arbeid med fontene startet med Googles web-fonter og et ønske om å videreføre spesielt det modernistiske preget i Futura fra logoen og plakattekstene. Valget falt derfor først på Josefin/Josefin sans. Det ble imidlertid raskt klart at denne fonten får stor grad av forvrengning i små typer. Spesielt går dette ut over leseligheten på mobil.
Neste alternativ er Googles Droid som finns i både serif og sans-serif. Denne fonten er spesielt utviklet for mobil/lesebrett-operativsystemet Android, og fonten har fått veldig gode kritikker for å ha god leselighet og distinkt karakter. Det ble imidlertid raskt klart at Droid oppleves som litt utflytende i små størrelser på nye mobilskjermer.
Etter en ny runde research fant vi at problemet allerede langt på vei er løst av Google selv. Fonten Roboto er spesielt utviklet for skarp gjengivelse på høyoppløselige mobilskjermer, og vår testing støtter dette. Riktignok har mottagelsen av Roboto vært svært blandet. De verste kritikerne har kalt den en firehodet-franken-font.
Nå er ikke redaksjonen i Vox Publica for fontnerder å regne, og vi har først å fremst vært ute etter god leselighet, konsistens og skarp gjengivelse. Men Droid har unektelig mer karakter enn Roboto. Konklusjonen blir derfor å bruke Droid for ulike overskrifter og navigasjon som skal være i stor type, de nye logoene er også basert på Droid, mens Roboto forbeholdes brødtekst og små typer. Slik får vi også testet to teknologier ved å bruke én inkludert web-font (droid) og én serverbasert (roboto).
Bruk av web-fonter på begge måtene vi har valgt vil selvfølgelig medføre noe økt lastingstid for leserne, og dette er kanskje den største haken med å forlate våre tidligere web-safe fonter. Foreløpige tester tyder imidlertid på at dette er et minimalt problem, og vi føler oss sikre på at vi har tatt gode valg både estetisk og funksjonelt. Vi holder imidlertid fortsatt døren på gløtt hvis våre lesere skulle komme med vektige argumenter eller bedre alternativer.
Om du har erfaringer med bruk av nye web-fonter hører vi gjerne fra deg.
Vi har eksperimentert litt med web fonter i en ny blogg mal for departementene og kom nesten i mål før vi måtte gå over til å bruke bilder i stede.
Grunnen tror vi er dårlig font hinting på fonten vi brukte og dette gjorde at den så forskjellig 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.