Skip to content

Hausschriften im Web – Webfonts kommen

Hausschriften im Web - Webfonts kommen

FSI FontShop International startet eine neue Kollektion digitaler Schriften, die ausschließlich für den Einsatz im Internet angefertigt sind. Webdesigner sind nicht mehr allein auf die wenigen Systemschriften angewiesen, die bei allen Website-Besuchern installiert sind. Die neuen Web-FontFonts werden so mit den Elementen einer Website verknüpft, dass erstmals HTML-Texte für alle Besucher die gleiche, individuelle Typografie aufweisen können.

Dieser lang erwartete Schritt erlaubt nicht nur das freie typografische Gestalten von Internetseiten. Corporate Design von Unternehmen und Marken kann nun noch konsistenter auf die digitalen Medien angewandt werden. Zu diesem Zweck stehen seit heute über 30 der erfolgreichsten FontFont-Schriften zur Verfügung, darunter FF DIN, FF Meta, FF Dax und FF Kievit – insgesamt 1250 Fonts; weitere werden bald folgen.

Der Preis für einen Schriftschnitt startet bei 40 Euro, was deutlich günstiger ist, als ein vergleichbarer Zeichensatz für Print-Anwendungen. Alle Infos zu den Webfonts gibt es im Fontblog, wo schon gut diskutiert wird und im FontShop, wo der Verkauf der sogenannten Woff- (Web Open Font Format) und Eot-Dateien(Embedded OpenType) am kommenden Montag beginnt.

Was bedeutet die Einführung der Webfonts? Nun, erst einmal werden sie nicht die Systemschriften verdrängen. Schriften wie die Verdana, Arial oder die Georgia sind speziell für die Darstellung am Monitor entwickelt worden und sind so verbreitet, dass gegen sie kein Kraut gewachsen ist. Wenn es darum geht längere Texte darzustellen, werden sie nach wie vor ihre Stärken und auch ihre Schwächen ausspielen dürfen. Martin Liebig hatte ihre Lesbarkeit untersucht und hier im dt darüber ausführlich geschrieben.

Webfonts sehe ich eher als Alternative, um Headline-Schriften einzubinden. Image-Replacement und die sIFR-Technik (praegnanz.de)sind da bislang die gängigen Methoden, um Hausschriften in Webpräsenzen zu integrieren. Ersteres kommt z.b. auch hier im dt zum Einsatz (Logo) und funktioniert einwandfrei. Das ist aber immer einer Frage des Aufwands. Für komplexe Sites greift man bislang zu sIFR, einem Verfahren, mit dem sich per Flash und JavaScript Schriften einbinden lassen, die bei nahezu jedem Nutzer angezeigt werden. Das funktioniert allerdings nicht immer reibungslos.

In diesem Sektor also könnten Webfonts aus meiner Sicht ihre Stärke ausspielen. Ich selbst habe noch kein Projekt mit Webfonts realisiert, deswegen kann ich nichts aus der Praxis berichten. In jedem Fall spannend, dass sich hier eine Alternative auftut.

Dieser Beitrag hat 29 Kommentare

  1. Bzgl. der Schriftenglättung und Typekit: Diese wird vom JavaScript, welches die Schrift einbettet, geregelt und hat nichts mit der Einstellung der allgemeinen (in Windows) Schriftenglättung, wie von Christina beschrieben, zu tun. Das ganze ist auf der Typekit Website für verschiedene OS und Browser dargestellt.

    Bei dem Typekit-“Verfahren” bleibt die Seite weiterhin valide und suchmaschienenfreundlich (=keine Änderung bzgl. SEO).

  2. @Audrey.

    Das ist vielleicht seit der Neuen Rechtschreibung so. Und darauf geht Deine Quelle nicht explizit ein.

    Ich sehe das unter dem Aspekt der Verständlichkeit. »Nachwievor« ist ein eigenständiges Wort, wie »Kennenlernen« oder »Zusammenhängend«. Es beschreibt Handlungen, Zustände, etc. sehr eindeutig. Getrenntgeschrieben ist die Bedeutung nicht so stark, insbesonders dann, wenn bspw. das »vor« in die nächste Zeile fällt und der »nach wie« gelesen wird. Das verwirrt.

    Die Neue Rechtschreibung hat ca. 1000 dieser Worte aufgetrennt. Und Deine Quelle ist sich wohl etwas zu sicher, wenn er behauptet, daß dies nie zusammengeschrieben wurde. Ich kann auch nicht eruieren, ob er für seine Aussage den alten oder neuen Duden konsultiert hat.

    Was diese Techniken betrifft: Ich als Webdesigner finde dies, oberflächlich betrachtet, eine interessante Neuerung, jedoch vermute ich auf der technischen Seite einen riesigen Aufwand sowie Unstimmigkeiten in den Browsertechniken, inbesondere bei Windows IE, auf uns zukommen. Fast jeder benutzt IE, jedoch ist dieser der technisch unterlegenste von allen. Und daran wird sich nie was ändern.

    Mir reichen die Standardschriften. Ich kann alles damit machen. Und für Kunden ist nur wichtig, daß die Lesbarkeit und das Verständnis stimmt.

  3. Fast jeder benutzt IE

    Auch in Deutschland benutzt die Mehrheit der Nutzer mittlerweile den Firefox. Nicht repräsentativ aber interessant: Lediglich einer von zehn dt-Lesern nutzt noch den IE (FF 50,2%, Safari 32,5%, IE 10,2%).

  4. Spielt (noch) keine große Rolle, ob die Marge größer ist. Diese Gruppe macht immernoch die größten Probleme, da sie ja den IE nutzen. Insofern wird die Technik bis auf weiteres auf IE als schwächstes Glied in der Kette abgemünzt. Wenn der Prozentsatz auf 10 % fällt, wird’s endlich interessant.

  5. Das Problem an dem Paket ist, aus technischer Sicht, sicherlich nicht der IE – selbst in der Version 6 lassen sich dort Schriften über das EOT-Format einbinden. Viel problematischer ist da eher das WOFF-Format, da bisher Firefox 3.6+ der einzigste Browser ist der dieses Format unterstützt.

    Kantenglättung ist nochmal eine andere Geschichte …

  6. @ Gast:

    Du sagst: “Und für Kunden ist nur wichtig, daß die Lesbarkeit und das Verständnis stimmt.”

    Damit habe ich andere Erfahrungen gemacht – und ich teile die Meinung auch nicht. Meiner Meinung nach gilt folgendes: “Der Kunde weiß erst dann was er will, wenn er sieht was er will.” Zeige ihm Bewährtes und er ist zufrieden. Zeige ihm Neues und er ist begeistert (oder auch nicht, aber das macht den Reiz aus).

    Alles machen kann man eben nicht… Ich stelle mir immer wieder vor, wie genial es doch wäre, dasselbe zu tun, wie meine Kollegen aus dem Print-Bereich: Typografisch mehr oder minder “unabhängig” zu sein. Gerade, wenn der Punkt der individuellen Typografie ins Web eintritt, werden sich Websites vielleicht wieder maßgeblich von einander unterscheiden. Ich finde, dass das Schriftbild (eben unter anderem durch die Schriftarten) ein maßgeblicher Faktor für das individuelle Aussehen einer Seite ist.

  7. Richtig DK. Wenn es möglich ist, die Fontbeschränkungen wirksam und wirkungsvoll zu erweitern, sodaß ein Kunde dies auch wahrnimmt und dies dann will, soll es mir auch recht sein. Doch ich kenne den Aufwand dafür nicht. Ich bin konstruktiv skeptisch, denn es muß in meinen Workflow passen und darf mir keine Zeit stehlen.

    Wenn ein System entwickelt werden muß, daß die Fontdaten vom jeweiligen Server zieht, und dieses aufwendig zu produzieren ist, frage ich mich, ob es diesen Aufwand wert ist. Jeder Coder weiß, wieviel Stunden in so eine Programmierung fließen wird. Und dann muß alles wieder für die jetzigen und zukünftigen Browser abgestimmt werden. Wieder eine Baustelle mehr. Dazukommt, daß Windows in der Schriftdarstellung sehr stark der Appleplattform unterlegen ist, und sich somit der Aufwand für diese Plattform nicht lohnen würde.

    Solange das nicht einwandfrei und unproblematisch läuft, beschränke ich mich lieber auf die Stilmittel, die ich effektiv browser- und plattformübergreifend mit wenig Aufwand einsetzen kann.

    Ich kompensiere die Schriftdefizite mit einer gelungenen Gestaltung. Ob ich da nun immerwieder die Arial einsetze, fällt dann nicht mehr ins Gewicht.

    Man muß nicht immer mit den Wölfen heulen, um gute Ergebnisse zu erarbeiten.

  8. Der Grund, weshalb bei FSI nur WOFF und EOT angeboten werden, liegt wohl in der Tatsache begründet, dass man in WOFF im Gegensatz zu OTF und TTF Metadaten über den Autor und Fontschmiede hinterlegen kann. Microsofts EOT-Format ist sowieso schon immer auf Kopierschutz ausgelegt gewesen. FSI legt da offenbar wert drauf.
    Typekit und Font Squirrel machen das anders und bieten alle Formate gleichermaßen an.

    Wer aber Lust hat zu frickeln: einfach die .woff-Datei in .zip umbenennen, und dann extrahieren. In dem Archiv sollte eine TTF- oder eine OTF-Schrift zum Vorschein kommen, mit der man wiederum Safari, Chrome und Opera bedienen kann.

    Wie man das Einbetten schnell und “bullet proof” vollzieht, hat der gute Paul Irish entwickelt und hier beschrieben. Wem das zuviel Plakerei ist, der sei auf den @font-face Generator von Font-Squirrel hingewiesen.

    Die Frage des Kopierens ist auch der Antwort auf die Frage, weshalb in Gottes Namen wir diese Methode der Schrifteneinbettung erst heute an die Hand bekommen: ursprünglich schon als Spezifikation für CSS 2 anvisiert, wurde der Punkt letztlich wieder gestrichen, weil die Schriftenhersteller nicht bereit waren, ihre Schriften ohne Kopierschutz rauszurücken. Diese Denke hat sich in den vergangenen 10 Jahren offenbar geändert.

    Das Problem mit der Schriftenglättung unter Windows existiert übrigens tatsächlich, und hängt mit der Art und Weise ab, wie Windows Schriften auf den Bildschirm rendert. Jeder Browser unter Windows, egal ob IE, Firefox, und (mittlerweile) auch Safari greift auf die systemeigene Schriftenglättung zurück.

    Eine nicht-angeschaltete Schriftenglättung, wie es bei XP out-of-the-box der Fall ist, ist natürlich schon einmal extrem verheerend. Aber auch ein aktives Antialiasing schützt nicht immer vor den Nebenwirkungen der Windows-eigenen Grafikschnittstelle “GDI”. Die ist der eigentliche Bösewicht, der uns den Spaß an manchen Fonts unter Windows vermiest. Diese glättet Buchstaben nämlich nicht in alle Dimensionen gleichermaßen linear, und wenn Schriftarten per sogenanntem Font-Hinting nicht auf ein Gerendertwerden unter der GDI abgestimmt werden, dann bröselt’s halt.

    Typekit ist sich dieser Zusammenhänge bewusst und arbeitet fortlaufend an einem Ergänzen all seiner Schriften mit einem besser funktionierenden GDI-Font-Hinting.

    Wie Schriftenglättung im allgemeinen funktioniert, und wie im Speziellen unter Windows, OS X, Linux und in Adobe-Produkten wie dem Reader, das steht in diesem fantastischen aber auch sehr technischen Grundlagenartikel.

    Microsoft hat das Problem aber auch längst erkannt und Windows 7 neben dem alten GDI das bessere DirectWrite spendiert. Und es wird auch per DirectX-11-Update an die Vista-Benutzer nachgereicht. Dieses hat all die Textrendering-Macken von GDI nicht mehr, und lässt sich auch besser hardwarebeschleunigen. Die Unterschiede beider Modi sind hier gegenüber gestellt. Das verbleibende Problem: die Anwendungsentwickler müssen nun nachziehen und auch auf DirectWrite als Ausgabeschnittstelle wechseln.

    Wie der eben genannte Link schon andeutet: die Firefox-Jungs arbeiten schwer für FF 3.7 dran (es gibt sogar schon jetzt eine Version zum Ausprobieren), das Webkit-Team hat es sich ebenfalls auf die ToDo-Liste geschrieben, und Microsoft nutzt es sowieso für den kommenden IE9 (tolles Video. Es gibt Gerüchte, dass er zur anstehenden MIX 2010 eventuell schon als Preview/Beta herauskommen wird).

    Es wird also irgendwann alles gut. Vor allem, wenn die letzten XP-Benutzer das Handtuch geworfen haben werden.

    Wer auf seine Schriftenglättung partout auch unter XP nicht verzichten mag, der sollte sFIR links liegenlassen und sich wirklich lieber cúfon ansehen. cúfon läuft nur mit JavaScript, ohne Flash, und ist auch barrierefreier. Die cúfon-Buchstaben sind aufgrund der Umwandlung in eine Vektorgrafik und das geglättete Rendering derselben durch Browser immer schön glatt (sogar eher mal eine Spur zu unscharf).

    In Sachen Suchmaschinen verhält sich cùfon wie sFIR und die echte Schrifteneinbettung absolut transparent. Die Suchmaschine sieht mangels ausreichender Javascript-Fähigkeit nur die Originalform vor dem Schriftenrenderig, die der Programmierer ganz wie gehabt steuern kann.

  9. Mir ist jüngst aufgefallen, dass die Schriftkantenglättung unter Windows7 in Indesign CS4 (Anzeige hohe Quali) im Vergleich zur Darstellung unter OSX grässlich ist. Bei mir ist es sogar so schlimm, dass ich fast schon an einen Bug/Fehler glaube. Im Browser hingegen kann ich keine Qualitätsunterschiede feststellen (auf beiden OS Firefox). Die Darstellung der Schriften ist also demnach nicht betriebssystemabhängig, sondern vom jeweiligen Programm, oder?

    Habt ihr auch schon mal darüber nachgedacht, dass eure subjektiven Empfindungen eine Frage des verwendeten TFTs sein können? Da spielen ja viele Faktoren eine Rolle: Lochabstand/Anzahl der Bildpunkte im Panel, Panel-Technik, etc..

Kommentare sind geschlossen.

An den Anfang scrollen