Font-Subsetter

So verkleinern Sie eine Schrift

1. Prüfen Sie die Lizenz. Subsetting erzeugt eine veränderte Kopie der Schrift. Offene Lizenzen wie die SIL Open Font License (OFL) und Apache 2.0 erlauben das, viele kommerzielle Desktop- und Weblizenzen dagegen nicht oder nur unter Bedingungen. Lesen Sie zuerst die Lizenz Ihrer Schrift.
2. Ziehen Sie eine TTF-, OTF- oder WOFF-Datei auf die Ablagefläche oder klicken Sie darauf, um eine auszuwählen. Der Bereich Originalschrift zeigt Familie, Format, Dateigröße, die Anzahl der Glyphen und die Anzahl der Zeichen, die die Schrift abbildet.
3. Wählen Sie die Zu behaltende Zeichen: Basis-Lateinisch, Latin-1, Lateinisch wie bei Google Fonts, Französisch und Ziffern und Zahlzeichen lassen sich kombinieren. Für deutsche Texte genügt meist Latin-1, denn es enthält ä, ö, ü, ß und die Guillemets; für „deutsche Anführungszeichen“ und den Gedankenstrich brauchen Sie das Preset Lateinisch wie bei Google Fonts. Eigene Zeichen ergänzen Sie unter Zeichen aus einem Text (jedes unterschiedliche Zeichen des Textes wird behalten) oder unter Unicode-Bereiche, geschrieben wie in CSS: U+0020-007E, U+2013, U+04??.
4. Aktivieren Sie Hinting entfernen, wenn Sie die kleinstmögliche Datei wollen.
5. Klicken Sie auf Schrift verkleinern. Die Engine (etwa 650 KB) wird beim ersten Mal geladen, danach wird die Schrift auf Ihrem Gerät verarbeitet.
6. Vergleichen Sie die Größen unter Ergebnis, sehen Sie sich die Vorschau des Subsets an, nutzen Sie dann TTF herunterladen (oder OTF) und WOFF herunterladen und kopieren Sie die Regel CSS @font-face.

Die Schriftdatei verlässt Ihren Computer nie: Sie wird im Browser gelesen, verkleinert und neu verpackt.

Was Subsetting bewirkt

Eine Schrift enthält oft Hunderte oder Tausende Glyphen: Kyrillisch, Griechisch, Vietnamesisch, Symbole, Alternativformen. Eine Seite auf Deutsch nutzt davon nur einen Bruchteil. Dieses Tool führt hb-subset aus, den Subsetter der Text-Engine HarfBuzz (derselbe Code, den Google Fonts und viele Build-Tools verwenden), kompiliert zu WebAssembly. Er behält die Glyphen der ausgewählten Zeichen sowie die Glyphen, die OpenType-Features zu deren Darstellung brauchen (Ligaturen wie „fi“, Kapitälchen und Akzentformen, sofern sie von Ihren Zeichen aus erreichbar sind), und entfernt den Rest. Kerning und andere Layout-Tabellen werden passend gekürzt.

Typische Ergebnisse: Eine vollständige Schrift mit Latein, Kyrillisch und Griechisch von 300 KB schrumpft für deutschen oder französischen Text auf 20 bis 30 KB, und eine Logoschrift, reduziert auf die Buchstaben eines einzigen Wortes, wiegt oft nur wenige Kilobyte.

Die Zeile Nicht in der Schrift listet Zeichen auf, die Sie angefordert haben, die die Schrift aber nicht enthält. Browser zeichnen sie mit einer Ersatzschrift.

Ausgabeformate und unicode-range

• TTF/OTF: Das Subset behält den Konturtyp des Originals (TrueType oder CFF).
• WOFF: dieselbe Schrift, jede Tabelle mit zlib komprimiert. Alle aktuellen Browser lesen das Format. Eine WOFF-Eingabe wird zuerst entpackt.
• WOFF2 ist nicht verfügbar: Für seine Brotli-Kompression und Tabellentransformationen gibt es im Browser keinen Encoder, und WOFF2-Dateien können hier auch nicht gelesen werden. Wandeln Sie WOFF2 zuerst in TTF um (z. B. mit fontTools). Ihr Server kann TTF/OTF außerdem on the fly mit gzip oder Brotli komprimieren.

Die Regel CSS @font-face nennt die WOFF-Datei zuerst, setzt font-display: swap und ergänzt eine unicode-range, die aus den tatsächlich im Subset vorhandenen Zeichen gebildet wird. Mit unicode-range lädt der Browser die Datei nur, wenn die Seite eines dieser Zeichen verwendet. So können Sie eine Familie in mehrere Dateien aufteilen (etwa Latein und Kyrillisch), und jeder Besucher lädt nur, was er braucht. Passen Sie den Name für font-family an den Namen in Ihrem Stylesheet an.