Inzwischen können eigentlich alle modernen Browser mit Non-Websafe-Schriften umgehen und wenn der Internet Explorer (IE) sein „Spezialfutter“ bekommt, kann der das auch – selbst die älteren Modelle. Als Font-Versionen kommen u.a. TrueType (.ttf ), OpenType (.woff) und der Embedded Open Type (.eot) für den IE infrage. Die Webfonts lädt man auf den eigenen Server und kann sie dann mit @font-face in ein Stylesheet einbetten. Danach lassen sie sich wie gewohnt per font-family ansprechen. Eine Anleitung mit Code-Beispiel gibt es auf Elmastudio. Dort sind auch einige Quellen erwähnt, wo man freie Schriften bekommt und Tools, mit denen sich die eigene Schrift in die o.g. Formate umwandeln lässt. Unbedingt darauf achten, dass die Schriften für diese Verwendung freigegebenen oder lizenziert sind!

Problem beim Webfonts einbetten

Nachdem ich mein @font-face Kit bei Font Squirrel runtergeladen und den mitgelieferten CSS-Code eingebaut hatte, sah ich meine neue Schrift in allen Browsern, sogar im IE7. Nur der Firefox – Version 3.6 – wollte partout nicht. Irgendwas stimmte mit meiner CSS-Datei nicht, denn die Beispieldatei aus dem Kit lief problemlos. Inzwischen bin ich schlauer: Der @font-face-Code muss nicht nur am Anfang der CSS-Datei stehen, er darf auch unter keinen Umständen innerhalb von @media all oder ähnlichen Anweisungen stehen. Nachdem ich das geschnallt habe, klappt es jetzt auch mit dem @font-face.