Morph Blog
Schriftarten

TTF zu WOFF2, im Detail.

Warum WOFF2 30 % kleiner ist, wie es Core Web Vitals verbessert und wie man ohne Verstoß gegen Lizenzbedingungen konvertiert — alles in deinem Browser, in Sekunden.

BY MORPH3 MIN READUPDATED APRIL 2026

Wenn Sie TTF-Schriften auf Ihrer Website bereitstellen, senden Sie etwa 30 % mehr Daten als nötig. WOFF2 liefert dieselbe Schriftart in einer deutlich kleineren Datei, und jeder moderne Browser unterstützt es. Hier ist, wie Sie konvertieren – und warum es für die Leistung Ihrer Website wichtig ist.

Warum WOFF2?

WOFF2 (Web Open Font Format 2.0) verwendet Brotli-Komprimierung, um Schriftdateien um etwa 30 % im Vergleich zu TTF zu verkleinern, ohne Qualitätsverlust. Die Schriftzeichen, Hinweise, Kernen und alle typografischen Merkmale werden identisch erhalten. Wenn ein Browser eine WOFF2-Datei lädt, dekomprimiert er sie zu denselben Daten wie die ursprüngliche TTF.

Der Leistungseinfluss ist real. Schriftarten sind render-blockierende Ressourcen — der Browser zeichnet Text erst, nachdem Schriftarten geladen sind. Eine 120 KB TTF, die zu einer 84 KB WOFF2 wird, bedeutet, dass Text schneller angezeigt wird, besonders bei mobilen Verbindungen. Google's Core Web Vitals messen dies direkt: kleinere Schriftarten verbessern Largest Contentful Paint (LCP) und reduzieren Cumulative Layout Shift (CLS) durch Schriftartwechsel.

Browserunterstützung ist universell. Chrome, Firefox, Safari und Edge unterstützen alle WOFF2. Die einzigen Browser, die dies nicht tun, sind Internet Explorer und sehr alte Android-Browser — beide unter 1 % des globalen Verkehrs.

Wie man konvertiert

Schritt 1 Öffnen Sie morph.cool/ttftowoff2 in Ihrem Browser.
Schritt 2 Lege deine .ttf-Schriftart-Datei auf die Seite.
Schritt 3 Morph komprimiert es mit wawoff2 (einem WebAssembly-Port des Google WOFF2-Encoders mit Brotli-Komprimierung).
Schritt 4 Ihre .woff2-Datei wird automatisch heruntergeladen. Fügen Sie sie Ihrem Projekt hinzu und aktualisieren Sie Ihre CSS-@font-face-Regel.

Verwendung von WOFF2 in CSS

Nachdem Sie Ihre WOFF2-Datei haben, verweisen Sie darauf in Ihrem Stylesheet. Listen Sie WOFF2 zuerst mit einem TTF-Fallback für maximale Kompatibilität auf:

@font-face {
  font-family: 'MyFont';
  src: url('/fonts/myfont.woff2') format('woff2'),
     url('/fonts/myfont.ttf') format('truetype');
  font-display: swap;
}

Die font-display: swap-Anweisung sagt dem Browser, sofort Fallback-Text anzuzeigen und die benutzerdefinierte Schriftart zu ersetzen, sobald sie geladen ist, um unsichtbaren Text während des Schriftladevorgangs zu vermeiden.

Schriftart-Lizenzkonformität

Viele kommerzielle Schriftartlizenzen enthalten Klauseln, die das Hochladen von Schriftartdateien auf Drittanbieter-Webdienste einschränken. Dies schafft ein Problem: Sie müssen die Schriftart in WOFF2 konvertieren, um Leistung zu verbessern, aber die meisten Konvertierungstools erfordern das Hochladen der Schriftart auf einen Server.

Morph konvertiert Schriftarten vollständig in Ihrem Browser mithilfe von WebAssembly. Die Schriftartdatei verlässt nie Ihr Gerät – sie wird lokal verarbeitet und direkt in Ihren Downloads-Ordner gespeichert. Kein Upload bedeutet keine Verteilung an eine Drittpartei.

Natürlich, immer die spezifischen Lizenzbedingungen Ihres Schriftschnitts prüfen. Doch die lokal-only Natur von Morphs Konvertierung beseitigt die häufigste Compliance-Sorge.

Andere Schriftartkonvertierungen

Morph unterstützt auch OTF zu WOFF2, WOFF zu WOFF2, TTF zu OTF und jede andere Kombination von TTF, OTF, WOFF und WOFF2. Brauchen Sie kostenlose Schriftarten zum Starten? Durchsuchen Sie die Morph-Schriftartenbibliothek mit 1.500+ kostenlosen Schriftarten.

TTF zu WOFF2 konvertieren — Kostenlos