Ziel erreicht! Website sieht in jedem Browser anders aus ;-)

fhu

Beim Studium von AListApart stiess ich auf den Schriftendienst TypeKit. Dieser bietet an, dass mensch aus einer Vielzahl an hochwertigen Bildschirmschriften bekannter Foundrys welche in die eigene Website einbindet. Es gibt ein Trial-Paket — zwei Schriften für umsonst einbinden.

Gleich mal testen… Wobei, es sind Dutzende Schriften, die erst mal auf Tauglichkeit gescannt werden müssen. Aber nach ner Weile hatte ich die beiden raus, die ich einbinden wollte:

Meine TypeKit-Schriften: FF Nuvo Web Pro und Legitima

Meine TypeKit-Schriften: FF Nuvo Web Pro und Legitima

Gut. Dann gabs ein Stückchen Code, das in die header.php integriert werden muß (Aufruf zweier JavaScript-Dateien). Danach musste ich angeben, für welche CSS-Selektoren welche Schrift gelten soll; das habe ich quick & dirty gelöst — ich will ja nicht bis morgenheute um halb vier hier sitzen. So. Nun warten, bis das System die Eingaben gefressen und verarbeitet hat.

Chrome 4.x — ähm, das sagten sie schon — wird nicht so richtig unterstützt. Hier taucht statt der Legitima (Serifenschrift für Überschriften etc.) die Georgia als fallback-Lösung auf, und sonst ist fast alles beim Alten:

GoogleChrome - Blog mit Typekit

GoogleChrome - Blog mit Typekit

So, denn halt des Font-Designers Liebling — Safari 4.x. Wow, bestens, so soll es sein:

Apple Safari4 -- Blog mit TypeKit

Apple Safari4 -- Blog mit TypeKit

FireFox 3.5.x hat es auch nicht so mit der neuen Methode — er ignoriert sie komplett, und verwendet die originalen Schriften:

Firefox 3.5 -- Blog mit TypeKit

Firefox 3.5 -- Blog mit TypeKit

Der InternetExplorer 7 übernimmt in jedem Falle mal die Serifen-Schrift, bei der Brotschrift bin ich mir da nicht so sicher…

InternetExplorer7 -- Blog mit TypeKit

InternetExplorer7 -- Blog mit TypeKit

Mich hat es gewundert, dass es überhaupt irgendwo funktionierte, da die CSS-Datei nun vollgestopft ist mit sich widersprechenden Angaben — heute habe ich ja dauernd was Neues rangepfropft, ohne mal durchzujäten.

Aber in Safari siehts schon mal ganz nett aus!


2 Responses to “Ziel erreicht! Website sieht in jedem Browser anders aus ;-)”

Leave a Reply