Webfont-Formate: Beschaffenheit und Einsatzmöglichkeiten im Webdesign

Mit der neuen Möglichkeit, beliebige Schriften per @font-face in Webseiten einzubinden, ist ein neues Stilmittel hinzugekommen, dass die gewohnte Eintönigkeit der Systemschriften ablösen soll. Diese Artikelserie beleuchtet die Entwicklung und vor allem die heutigen Möglichkeiten dieser Technik ausführlich. In diesem Teil der Serie geht es um die Vor- und Nachteile der verschiedenen Formate.

Diese Beiträge könnten Sie auch interessieren:

Webfont-Formate

EOT, TTF, OTF, CFF, AFM, LWFN, FFIL, FON, PFM, PFB, WOFF, SVG, STD, PRO, XSF, …
Sich im Dschungel der Fontformate zurecht zu finden, ist nicht gerade einfach. In diesem Artikel werden jene Fontformate näher beleuchtet, die für den Einsatz auf Webseiten besondere Relevanz besitzen.

TrueType

Dieses Format wurde Ende der 1980er Jahre als Alternative zu Adobes PostScript-Schriften-Formaten entwickelt. Als skalierbares Outline-Format löste es die bis dahin bei der Bildschirmdarstellung üblichen Bitmap-Fonts ab. In der Folge wurde es auch von Microsoft übernommen und entwickelte sich rasch zu dem Format für Systemschriften. Der Grund liegt vor allem in der Möglichkeit, die Bildschirmdarstellung sehr präzise und abgestimmt auf die jeweilige Schriftgröße kontrollieren zu können.

OpenType

Dieses Format wurde in Partnerschaft von Microsoft und Adobe entwickelt. Es setzt direkt auf dem TrueType-Format auf, bietet aber optionale, erweitere typografische Funktionen (Ligaturen, Bruchziffern, Kontextbedingte Alternativzeichen etc.), die vor allem in professionellen Design-Anwendungen zum Einsatz kommen und bislang leider in Browsern noch unzureichend unterstützt werden.

Wichtig zu wissen ist ferner, dass OpenType-Fonts in zwei Arten vorliegen können, je nachdem welche Outline-Technologie zum Einsatz kommt. Es gibt OpenType-Fonts mit TrueType-Outlines (OpenType TT) und solche mit PostScript-Outlines (OpenType PS). Letzteres werden häufig auch CFF-basiert (Compact File Format) genannt. Dies spielt beim Einsatz als Webfonts eine Rolle, da unter Windows die PostScript-basierten Fonts derzeit meist ohne Subpixel-Rendering dargestellt werden, was die Darstellungsqualität beträchtlich verschlechtert. Hier sind also die TrueType-basierten Fonts klar zu bevorzugen, auch wenn Microsoft dieses Problem in Zukunft ausmerzen wird.

Da sich TrueType- und OpenType-Fonts strukturell sehr ähneln, gilt die Unterstützung in der Regel für beide Formate. Bei Browsern ist eine Unterstützung gegeben seit Safari 3.1, Firefox 3.5 und Opera 10.

EOT

Das Format Embedded OpenType (EOT) wird seit Ende der 1990er Jahre im Internet Explorer eingesetzt. Es ist eine Abwandlung des TrueType bzw. OpenType-Formates, die sich durch zwei Besonderheiten auszeichnet: Zum einen sind EOT-Fonts in der Regel für eine schnellere Auslieferung im Web komprimiert. Zum anderen lassen sich EOT-Fonts an bestimmte Webseiten koppeln (URL Binding). Der Font funktioniert dann nur auf den so voreingestellten Webseiten. Ein unberechtigtes Kopieren zu einer anderen Domain ist nicht möglich.

EOT funktioniert ausschließlich im Internet Explorer. Auch wenn es sicherlich als Webfont-Format keine Zukunft hat, bietet es sich derzeit noch an, dieses Format auszuliefern, um auch die Benutzer der verschiedenen IE-Versionen mit Webfonts zu versorgen.

Ein aktuelles Windows-Programm zum kostenlosen Erstellen von komprimierten EOT-Fonts ist EOTFast.

WOFF

Das Web Open Font Format (WOFF) schickt sich derzeit an, der Standard für Schrift auf Webseiten zu werden. Es ist als ein Kompromiss zwischen Schrift- und Browser-Herstellern entstanden. Und so verwundert es auch nicht, dass das Format von zwei Schriftgestaltern und einem Mozilla-Entwickler in Gemeinschaft entwickelt wurde. Streng genommen ist WOFF kein neues Format, sondern eher ein Container-Format um das weit verbreitete OpenType-Format.

Auch bei WOFF ist wie beim EOT-Format eine Komprimierung direkt integriert. Darüber hinaus können Meta-Daten hinterlegt sein, die zum Beispiel eine Nutzungslizenz ausweisen, auch wenn diese Daten allenfalls Informationscharakter haben und in keiner Weise von Browser überprüft werden.

Mozilla kann seine Hausschrift FF Meta dank einer WOFF-Lizenz nun ohne Umwege auf der eigenen Webseite verwenden

Firefox unterstützt das Format seit Version 3.6 und eine Standardisierung durch das W3C ist derzeit im Gange. Alle anderen Browserhersteller arbeiten bereits an einer Integration in kommende Browser-Versionen.

Zur Konvertierung in das WOFF-Format kann der kostenlose Online-Dienst von Fontsquirrel benutzt werden.

SVG

Innerhalb des Vektorgrafik-Formates SVG lassen Fonts direkt in die entsprechenden SVG-Dateien einbetten. Man spricht meist von SVG-Fonts, wobei es sich in technischer Hinsicht dann kaum noch um Fonts im eigentlichen Sinne handelt. Vielmehr sind die Umrisslinien der einzelnen Buchstaben hinterlegt und sie werden dann entsprechend auf der Zeichenfläche der SVG-Grafik dargestellt.

Das Format hat im Zusammenhang mit Webfonts aktuell dennoch Relevanz, da es momentan das einzige der hier beschriebenen Formate ist, das auf iPhone und iPad im Mobile Safari benutzt werden kann.

Zur Erstellung kann ebenfalls der Dienst von Fontsquirrel benutzt werden.

Der Webfont-Dienst Typekit liefert seine Fonts auch im SVG-Format für iPhone und iPad aus.

In den nächsten Teilen der Serie lesen Sie:
  • Webfont-Anbieter
  • @font-face-Einbindung selbst gemacht
  • Ausblick: Schrift im Web

(mm),

Ralf Herrmann hat sich in der Typografie-Szene vor allem als Betreiber der beliebten typografischen Internet-Community Typografie.info einen Namen gemacht. Er ist außerdem Autor typografischer Fachbücher und Herausgeber des Typografie-Magazins TypoJournal. Die neuen Entwicklungen rund um Webfonts dokumentiert er auf der Seite webfonts.info

Sortiert nach:   neueste | älteste | beste Bewertung
Daniel S
Gast
5 Jahre 11 Monate her

Und wieder kocht der IE sein eigenes Süppchen…

Wenn Microsoft bei OpenType mitgewirkt hat, warum nimmt der IE dann nur EOT-Fonts? Weiß jemand, welchen Font-Type der IE9 unterstützen wird?

Jens
Gast
Jens
5 Jahre 11 Monate her

Unterstützen wird der IE 9 das Web Open Font Format (WOFF). Also OpenType und TrueType.

Ralf H.
Gast
5 Jahre 11 Monate her

Nun ja, Microsoft war mit EOT allerdings als erster da. Man könnte auch sagen, warum haben die anderen Browser ihr eigenes Süppchen gekocht und nicht auch auf EOT gesetzt.
Aber mit dem IE9 wird man ja bereits auf den zukünftigen Standard WOFF setzen. Insofern ist Microsoft in dieser Hinsicht ausnahmsweise mal nichts vorzuwerfen. ;-)

trackback

[…] greifen hier ein paar Themen des Magazins auf die euch interessieren könnten: Webfont-Formate: Beschaffenheit und Einsatzmöglichkeiten im Webdesign Mit der neuen Möglichkeit, beliebige Schriften per @font-face in Webseiten einzubinden, ist […]

trackback

[…] Überblick über die “Web-Fonts”, beschreibt dieser Artikel bei Dr. Web sehr gut: Webfont-Formate: Beschaffenheit und Einsatzmöglichkeiten im Webdesign. Jahrelanges Streitthema zwischen Designer und Programmierer: Der Font. Der Designer […]

trackback

[…] Dr. Web – Webfont-Formate: Beschaffenheit und Einsatzmöglichkeiten im Webdesign […]

wpDiscuz

Mit der Nutzung unseres Angebots erklärst du dich damit einverstanden, dass wir Cookies verwenden. Weitere Informationen

Wir verwenden Cookies, um Inhalte und Anzeigen zu personalisieren, Funktionen für soziale Medien anzubieten und die Zugriffe auf unsere Website zu analysieren. Dadurch geben wir nicht personenbezogene Informationen zur Nutzung unserer Website an unsere Partner für soziale Medien, Werbung und Analysen weiter. Nähere Informationen findest du in unserer Datenschutzerklärung. Durch die Weiternutzung unserer Website (oder das ausdrückliche Klicken auf "Einverstanden") gehen wir davon aus, dass du mit der Verwendung von Cookies einverstanden bist.

Schließen