Individuelle Webtypografie mit @font-face

atfontface
Wer mit Safari ab 3.1 oder Firefox ab Version 3.5 surft, kann sich glücklich schätzen. Die neuen Browser unterstützen schon die @font-face-Regel, mit der Open Type oder True Type Schriften auf Internetseiten dynamisch verwendet werden können …

Fonts sind Schriftdateien, die die Gestalt der einzelnen Schriftzeichen beschreiben und so individuelles und themengerechtes Kommunikationsdesign erst möglich machen. Die Einbettung von Schriftdateien als Webfonts mit @font-face erlaubt nun, dass eben diese Fonts gleichzeitig vom Server geladen werden, wenn der User eine Webseite aufruft. Das stellt sicher, dass der Font, den der Webdesigner bestimmt hat, auch dem User zugänglich ist. Also können mit dieser Technik Fonts eingesetzt werden, die nicht weit verbreitet sind und eine bessere und exklusivere Webtypografie bieten. Die @font-face-Technik wurde erstmals in der Spezifikation CSS 2 niedergelegt.

Das Thema wird in der Fachwelt kontrovers diskutiert. Denn die Einbettung erlaubt mit wenig Know-how auch einen freien Download der Font-Dateien selbst. Das kann dazu führen, dass Fonts außerhalb einer gültigen Nutzungsvereinbarung (Lizenz) verwendet werden oder sich illegal im Netz verbreiten.

Ein legaler Download des im Beispiel verwendeten Open-Source-Fonts "Titilium" ist übrigens hier möglich.

Diese Art der Font-Einbettung ist noch nicht sehr weit im Internet verbreitet, wird aber jetzt mit der Veröffentlichung der Browserversionen Firefox 3.5 and Safari 4, erwartungsgemäß ansteigen. Kleine Probleme können noch durch den Browser-Cache auftreten. Beim Besuch von im Cache vorgeladenen Seiten erfolgt die gewüschte Schriftdarstellung manchmal nicht richtig, sodass aber ein Rückgriff des Browser auf den im klassischen CSS Fontstack nächsten, websicheren Font erfolgt.

Ein riesiger Vorteil von @font-face gegenüber der Designmethode "Text als Bilddatei" ist die weiterhin schnelle Editierbarkeit von Texten zum Beispiel im CMS und der gleiche Grad an Barrierefreiheit wie bei Layouts mit websicheren Fonts. Die vorherschende konkuriende Technik für individuelle Typografie im Netz ist Flash. Flash erlaubt natürlich zusätzlich ganze Welten von Animationen und Spezialtechniken, ist zur Zeit jedoch noch nicht auf Mobilgeräten wie dem iPhone darstellbar.

 
Comments

Ich habe gerade den neuen Google Chrome 4.0 Browser für Mac installiert. Auch hier wird @font-face unterstützt. – Der Gesamteindruck von Chrome ist auch sehr gut, sofern man es nach 10 Minuten sagen kann.

Comments are closed.