Im Web von heute kommen nicht sehr viele verschiedene Schriftarten zum Einsatz. Das liegt vor allem daran, dass Webdesigner zumeist Typen wählen, die auf möglichst vielen Systemen vorhanden sind. Dazu gehören etwa Arial oder Verdana. Andere Fonts lassen sich jedoch auch nutzen. Das geht zum Beispiel über die Google Font API. Wenn eine Schriftdatei beim Aufruf einer Website nicht vorhanden ist, wird sie von Google auf den lokalen Rechner geladen und kann anschließend angezeigt werden. Letzteres wird durch CSS geregelt.
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="de" lang="de"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>Google Font API demo</title> <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=Tangerine"> <style type="text/css"> #eins { font-family: 'Tangerine', serif; font-size: 48px; } </style> </head> <body> <div id="eins">Überschrift</div> </body> </html>
Entscheidend hierbei ist, dass ein spezielles Stylesheet von Google geladen wird. Diesem wird per GET-Parameter mitgeteilt, welche Schriftart verwendet werden soll. Auf diese Weise lassen sich auch mehrere Schriften gleichzeitig laden, sowie Schriftschnitt bzw. -gewicht auswählen. Momentan stehen ein paar freie Schriften zur Auswahl; weitere, kommerzielle Schriften finden sich im Angebot von TypeKit.
Ich weiß leider nicht, wie es mit der Browser-Kompatibilität aussieht. Bei meinem Test hat es allerdings bestens im FF 3.5.9, IE 6-8, sowie Chrome 5 funktioniert. Opera 10.53 hat die Schrift erst nach einem Reload der Seite angezeigt.
Fazit: Auf den ersten Blick funktioniert das Ganze recht gut. Hoffentlich wird sich diese Technologie noch weiter entwickeln und vor allem in allen gängigen Systemen bzw. deren Browsern etablieren. Desweiteren wäre eine Alternative zu Google wünschenswert – aber sie haben ja dankenswerter Weise Teile ihres Codes auf GitHub gestellt.