Webdesign mit unüblichen Schriftarten

Arial, Times, Helvetica, Verdana, sans-serif. Als kreativer Webentwickler hat man es trotz CSS3 nicht wirklich leicht. Die Auswahl an verfügbaren Webschriftarten ist eher überschaubar und schränkt die persönlichen Vorstellungen oft ein. Aber muss das wirklich sein? Warum nicht einfach mal einen neuen Font einbinden?


Klingt nach einer ganz netten Idee und in der Tat hat sogar Google das Problem erkannt und einige Hundert Fonts für die Verwendung in Webseiten optimiert. Man kann sie kostenlos benutzen und die Einbindung erfolgt ganz simpel via CSS:


Mehr braucht es also nicht, um beispielsweise die Schrift "Imprima" einzubinden, die dann ungefähr so aussehen sollte:

Der Haken? Das Rendering!

Wenn das Einbinden schöner Schriften also so simpel ist, warum gibt es dann kaum Webseiten, die es praktizieren?

Weil es, wie meistens, dann leider doch nicht so einfach ist, wie es scheint. Verschiedene Betriebssysteme und Browser setzen auch verschiedene Techniken und APIs zum Rendern der Schriftarten ein. (Wer sich diesbezüglich belesen möchte sollte nach Begriffen wie "GDI API","Direct2D API" oder "DirectWrite API" suchen.)

Einige Rendering Ergebnisse könnt ihr in der nebenstehenden Galerie betrachten. Ich habe nicht nur die Imprima-Schrift unter verschiedenen Browsern und Systemen verglichen, sondern auch die Darstellung der Standardschriftart Arial. Selbst bei dieser gibt es deutliche Unterschiede in der Darstellung, aber sie ist zumindest unter allen Systemen gut lesbar - eben eine Standardschrift.

Imprima hingegen präsentiert sich je nach Betriebssystem und Browser mal verwaschen, mal klarer und manchmal auch etwas zerhackstückelt. Abhängig von der Schriftgröße, -dicke und -farbe erhält man so, je nach eingesetztem Programm, lesbare, schwer lesbare und kaum noch lesbare Ergebnisse.

Die schönsten Ergebnisse lieferte aus meiner Sicht (und ich bedauere das zugeben zu müssen) Apples Safari Browser. Dies erklärt sich vielleicht auch in der Tatsache, dass Apple ja seit jeher sehr auf optische Reize fixiert ist und auf eigene Techniken für das Rendering von Schriften zurückgreift.

Unterm Strich muss ich sagen, dass ich eher von der Verwendung allzu spezieller Schriftarten abraten würde. Die Darstellungsergebnisse sind sowohl von der gewählten Schrift und deren Parametern, als auch vom eingesetzten Browser und Betriebssystem abhängig. Das sind zu viele Parameter, um sie alle auf allen Systemen in Einklang bringen zu können.

Wer dennoch Mut beweisen will, sollte nach einer Schriftart Ausschau halten, die weniger filigran veranlagt ist, als der hier gezeigte Imprima-Font. Ich könnte mir auch vorstellen, dass sich die Darstellungseigenschaften verbessern, wenn man auf SVG-Schriften zurückgreift. Jedenfalls sieht die SVG-basierte Schriftart "Ubuntu Condensed" auf den meisten Systemen recht gut aus. Es wäre auch ein Kompromiss, individuelle Schriftarten nur für vereinzelte Bereiche einer Webseite, wie Überschriften und Layout Komponenten, zu verwenden. Somit wären im Zweifelsfall zumindest noch die eigentlichen Inhalte gut lesbar.

Oder... lasst es einfach, spart euch den Stress und werdet mit Arial und Co glücklich!

Geschnatter