Door: Herco Terweij

03102009

Fonts vast in het web..

Zitten we nu echt vast aan fonts zoals Helvetica, Georgia, Arial of de Tahoma? De nieuwe standaard is daar niet over uit.

Bij de ontwikkeling van websites of applicaties in HTML hebben we keuze uit een klein aantal fonts die op de meeste besturingssystemen is geïnstalleerd. Jammer, want het is vaak onmogelijk om teksten en koppen te plaatsen die conform de huisstijl zijn.

In de nieuwe standaarden (HTML 5 en CSS 3) zijn verschillende voorstellingen gedaan om de mogelijkheden uit te breiden. Helaas zijn daar nog geen concrete oplossingen uit gekomen. Dit heeft alles te maken met licenties en beveiligingen van deze fonts. Zodra het besluit definitief is, zal het nog enkele maanden tot een jaar duren voordat de gangbare browsers deze standaarden zal adopteren en de internetgebruiker up-to-date is...

Maar zoals Jeff Goldblum al zei in Jurasic Park 1: "Nature wil always find its way", zijn hier een aantal alternatieven voor ontwikkeld door de web-gemeenschap.

Font-Replacement

Met het Font-Replacement techniek worden van te voren aangegeven objecten (zoals koppen of navigatieteksten) ingelezen door javascript en teruggekoppeld naar een script dat draait op de webserver. Deze webserver maakt van die tekst een afbeelding. De afbeelding wordt opgeslagen op de server en vervangt de inhoud van het object. Voila! Koppen in de juiste huisstijl.
Voordelen: weinig vertraging aan de klantzijde
Nadelen: meer dataverkeer, alleen mogelijk op servers met bepaalde software (voor het genereren van de afbeelding). Kwaliteit is redelijk en alleen geschikt voor koppen.

SIFR

SIFR maakt min of meer gebruik van dezelfde techniek. In plaats van afbeeldingen wordt de , de inhoud van een object in een flashbestand ingelezen, in het juiste font gezet en op de juiste plaats gezet.
Voordelen: hogere kwaliteit dan FR of Cufon?.
Nadelen: kan alleen draaien met een Flash-plugin. Typografie is lastig te finetunen. Alleen geschikt voor koppen.

CUFON

Compleet Open-Source (dus geen Flash plugin e.d. nodig). Het gewenste font wordt eerst gedistilleerd naar een speciaal bestand. Javascript leest vervolgens de gewenste objecten in en zet deze met behulp van het speciaal aangemaakte fontbestand in het juiste font.
Voordelen: goed te stijlen met CSS. Hoge kwaliteit. Geschikt voor koppen en niet al te lange teksten.
Nadelen: bij grotere stukken tekst of oudere computers kan vertraging optreden.

Conclusie

Bij alle bovengenoemde technieken treden er vertragingen op bij het laden of opbouwen van de pagina. Daarbij moet wel in ogenschouw worden genomen dat computers en internetverbindingen gemiddeld snel genoeg zijn om dit te compenseren. Mijn voorkeur gaat uit naar CUFON. Deze komt, als we de geluiden uit te markt geloven, het dichtst bij de komende standaarden en is bovendien relatief eenvoudig te implementeren en te gebruiken. Hier zijn enkele voorbeelden van bovenstaande technieken.

Nieuwsgierig voor de mogelijkheden op uw site? Bel of mail voor een afspraak