Schlanke Webseiten mit dem FontFont Subsetter

Fast 100%ige Unterstützung erfahren selbst­ge­hos­tete Fonts (Formate .woff und .eot) inzwi­schen von Web-Browsern. Der Einbau von Schriften in Webseiten ist denkbar einfach: Lizenzierte Font-Software auf den Server kopieren und im CSS Schrift-Namen und Stil vermerken – fertig.

Fonts trans­por­tieren visu­elle Kennzeichen unver­än­dert ins Netz. Der FontFont-Subsetter sorgt für ein sport­lich-schlankes  Datenvolumen der betei­ligten Web-FontFonts. Das Bild zeigt FF Dax Web beim Einsatz auf der Fan-Seite von Juventus Turin.

Web-FontFonts kommen mit einer groß­zü­gigen Zeichenausstattung. So enthält die DIN Web 322 Glyphen, die DIN Web Pro mit 694 Glyphen über doppelt so viele. Nicht jede Website braucht den voll­stän­digen Zeichenumfang. Wie auch für Bilder, gilt für Schriftenim Netz: Weniger ist mehr, je kleiner desto besser. Auch wenn die Geschwindigkeit der Datenübertragung rasant zunimmt, schlanke Seiten flut­schen besser durchs Netz. Da die Ladezeit ein Bestandteil von Googles Such-Algorithmus ist, kann auch das Ranking sich verbessern.

Schnell schrumpft der Subsetter die Font-Datei, indem nur die benö­tigte Sprache ausge­wählt wird 

Das Online-Tool FontFont-Subsetter ermög­licht auch Font-Technik-Laien, die Ausstattung ihrer Webfonts für die eigenen Zwecke maßzu­schnei­dern und nur die gewünschten Zeichen in der Webfont-Datei zu belassen. Dabei kann sich die Größe eines Webfonts um bis zu 90 % redu­zieren, was bei den Empfängern einer Website für einen schnel­leren Seitenaufbau sorgt und beim Betreiber der Website für dras­tisch redu­zierten Traffic.

Hier den FontFont Subsetter auspro­bieren … und wer gerade keinen Web-FontFont zu Hand hat, lädt sich hier die kosten­lose FF Nuvo Web.

So kann der FontFont-Subsetter helfen

Fall 1: Sie möchten die sprach­lich gut ausge­stat­tete Schrift FF Celeste für der Website eines englisch-unga­ri­schen Verlags opti­mieren. Der Pro-Font im .eot-Format enthält die Schriftzeichen für Latin Extended, Cyrillic Extended und Neugriechisch.

Subsetting: Laden Sie die Fontdatei auf die Subsetter-Website, deak­ti­vieren Sie das Kerning (Browser, die EOT unter­stützen, igno­rieren Kerning-Tabellen), wählen Sie die Option »Keep only a Subset of Specified Characters« und deak­ti­vieren sie alle Sprachen außer Ungarisch und Englisch. So wird aus einer 316 K schweren CelesteWebPro-BookIta.eot eine 62 K leichte CelesteWebPro-BookIta_modified.eot … Ersparnis: 81 Prozent.

Fall 2: Sie sind vernarrt in die exzen­tri­schen Ziffern der FF Amman Black und möchten diese im Kalender Ihres Weblogs einsetzen.

Subsetting: Laden Sie Amman SC Web Black in den Subsetter (der Small-Caps-Schnitt enthält die eleganten Mediävalziffern als Standardzahlen), klicken Sie »Keep only a Subset of Specified Characters«, entfernen Sie das Häkchen bei »uncheck all cate­go­ries« und »uncheck all languages« und tippen Sie einfach die Zahlen 0123456789 in die Textbox. Während AmmanSansScWeb-Black.woff 33 K groß war, ist die neu entstan­dene AmmanSansScWeb-Black_modified.woff nur noch 8k groß … Ersparnis: 76 Prozent. Tip: Man kann auch einzelne Schriftzeichen aus der Tabelle im Subsetter in die Textbox kopieren.

Fall 3: Ich brauche eigent­lich auf meiner Website nur die Buchstaben für einen stati­schen Text, dessen Sprache und Inhalt ich aber noch nicht kenne …

Subsetting: Wenn Ihnen der frei­ge­ge­bene Text vorliegt, klicken Sie auf »Keep only a Subset of Specified Characters«, danach »uncheck all cate­go­ries« und »uncheck all languages«. Kopieren sie nun den Text in die Textbox und gene­rieren sie einen mageren Web-FontFont, der genau die Zeichen enthält, die für die Darstellung des Textes benö­tigt werden.

Fall 4: Ich möchte im Moment keinen Web-FontFont modi­fi­zieren, sondern einfach mal nach­schauen, welche Schriftzeichen enthalten sind und wie man auf sie zugreift.