Making the Web Beautiful!

Seit jeher war es möglich per HTML-Tags und später per Cascading Style Sheets Einfluss auf Schriften auszuüben: anfangs sehr primitiv auf dem Niveau von Schriftauszeichnungen mittels der HTML-Tags "H1" (bis 6), "B", "U", "I", "TT", "PRE" und später auch "BIG", "SMALL", "SUP", "STRONG", "EM", "CODE", "CITE", etc. und dann mittels FONT-Tag, welcher später in CSS überging.

Mit dem FONT-Tag war es erstmals möglich auf eine Schriftfamilie zu referenzieren: entweder auf abstrakter Ebene mittels generischer Schriftfamilien der Klassen: "serif", "sans-serif", "monospace", etc. oder konkreter Listen von Schriftfamilien, die ggf. auf den Rechnern der Nutzer installiert waren, wie z.B. "Arial", "Helvetica", "Courier", "Times", etc. Diese Form der Referenzierung auf Schriftarten ist nach wie vor per CSS üblich und ein Quasistandard im Webdesign (ausgenommen Adobe Flash und Grafiken).

Die Kontrolle über die Schriftarten und die Typografie ist durch eine einfache Referenzierung auf Schriftarten, die auf den Rechnern der Nutzer vermutlich installiert sind, auf die Schnittmenge der Standardschriftarten von Windows und MacOS beschränkt.

Eine bessere Kontrolle wird durch die Referenzierung einer einzubetteten Schriftartdatei erreicht. Doch genau dieses Thema war und ist hingegen ein Thema, das eine erstaunlich lange Geschichte hat und lange Zeit nie wirklich gelöst wurde. Es gab schon zu Zeiten des Netscape Navigator-Browsers (ich glaube in Version 3 oder 4) proprietäre Versuche auf Schriftdateien zu verweisen. Irgendwann verschwanden diese Möglichkeiten oder wurden durch andere Versuche in anderen Browsern ersetzt. Unterm Strich gab es bis zum CSS3-Entwurf keinen echten Standard dazu.

Da sich CSS3 trotz des Entwurfsstatuses mehr und mehr in den aktuellen Browsern durchsetzt und die Möglichkeit bietet Schriftdateien der Formate "woff" (Web Open Font Format), "truetype", "opentype", "embedded-opentype" und "svg" zu integrieren, spricht mittlerweile nichts mehr dagegen im Webdesign ein detailliertes typografisches Konzept umzusetzen.

Unterstützt wird das Ganze mal wieder von Google durch die „Google Web Fonts“ und der entsprechenden API, die die Integration der Schriften vereinfacht. „Google Web Fonts“ ist ein umfangreiches Verzeichnis sofort nutzbarer freier und bezahlbarer Web-Schriften. Wer ein WordPress-Blog betreibt, kann einfach das „WP Google Fonts„-Plugin verwenden. Alle anderen können der Anleitung „Schriftarten mit der Google Web Fonts Api einbinden“ folgen oder einfach auf der Detailseite der Schriftarten den Font-Previewer starten, um sich den notwendigen CSS-Code generieren zu lassen.

Mit dem Typetester können sowohl System- als auch Webschriften getestet werden, um die optimale Schriftkombination zu finden. Im Übrigen findet sich hier die oben erwähnte Schnittmenge als "safe list", die Windows- und Mac-Schriften und einige wenige Google Fonts.