Toollet
Nach Aufgabe oder App-Name suchenSuchenKontakt
Preise

Webfont-Paket erstellen

Wählen Sie TTF-, OTF-, WOFF- oder WOFF2-Schriftarten aus, um WOFF2-Dateien, CSS und eine HTML-Vorschau zu erstellen. Prüfen Sie vor der Einbindung in eine Website den Beispieltext und den CSS-Namen, die Gewichtung, den Stil und die Anzeige während des Ladens, und speichern Sie das Paket dann als ZIP. Eine Zeichen-Untermenge wird nicht erstellt.

TTF · OTF · WOFF · WOFF2

Was du tun kannst

Dateien für das Web bündeln

Erstelle aus TTF, OTF, WOFF oder WOFF2 die Dateien WOFF2, CSS und eine HTML-Vorschau. Du kannst mehrere Schriften zusammen auswählen.

Glyphen und CSS-Bedingungen prüfen

Prüfe das Aussehen der konvertierten Schriften. Die im Web verwendeten Namen, Stärken und Stile sowie die Anzeige während des Ladens lassen sich bei Bedarf ändern.

Das Paket direkt als ZIP weitergeben

Speichere den Ordner fonts, die Datei fonts.css und die Datei preview.html als Paket. Du kannst sie verwenden, wenn ihre relativen Positionen erhalten bleiben.

Verwendung

  1. Schriften zusammen auswählen

    Wähle Schriften aus, die du im Web verwenden darfst. Wenn du mehrere verwendest, wähle sie zusammen aus.

  2. Aussehen und Web-Einstellungen prüfen

    Gib Text für die Vorschau ein und prüfe jede Schrift. Um Name, Stärke oder andere Optionen anzupassen, öffne die CSS-Einstellungen der jeweiligen Schrift.

  3. Paket erstellen und ZIP speichern

    Klicke auf „Webfont-Paket erstellen“ und speichere die erzeugte webfont-kit.zip.

  4. Entpacken und in eine Webseite einbinden

    Entpacke die Dateien, während du die Positionen des Ordners fonts, der Datei fonts.css und der Datei preview.html erhältst. Lade das CSS auf der Seite, auf der du die Schriften verwendest, und verwende die angegebenen Fontnamen.

Nützlich, wenn

Eine Website für die Veröffentlichung vorbereiten

Bündele deine Schriften in Web-Formate und CSS und stelle so die für die Einbindung nötigen Dateien zusammen.

Das komplette Paket an das Produktionsteam übergeben

Bündele mehrere Schriften wie Normal- und Fettstil und übergib sie zusammen mit HTML, das Text zum Prüfen enthält.

Wie Schriften und CSS zusammenspielen

WOFF2 ist ein Schriftformat für das Web

Es wird WOFF2 mit den ursprünglichen Zeichen bereitgestellt. Eine Einschränkung der Zeichen findet nicht statt. Die Dateigröße hängt von der Schrift ab.

Namen, Stärken und Stile in CSS registrieren

Diese Einstellungen legen fest, bei welcher Angabe im Web diese Schrift verwendet wird. Sie bearbeiten die Glyphen der Schrift nicht zu fett oder kursiv.

Denselben Namen durch Stärke und Stil unterscheiden

Normal- und Fettstil können denselben Namen verwenden, aber die Kombination aus Name, Stärke und Stil darf nicht doppelt vorkommen.

Anzeige während des Ladens wählen

Standardmäßig wird zuerst eine Ersatzschrift angezeigt und auf die eigentliche Schrift umgeschaltet, sobald sie bereit ist. Bei Bedarf kannst du das Warten und Umschalten in den CSS-Einstellungen ändern.

Relative Positionen der Dateien erhalten

fonts.css verweist auf Dateien wie fonts/font-1.woff2. Wenn du den Ordner oder das CSS verschiebst, passe die Verweispfade entsprechend an.

Häufig gestellte Fragen

Wohin sollen die erzeugten Dateien gelegt werden?

Entpacke die ZIP und platziere den Ordner fonts, die Datei fonts.css und die Datei preview.html so, dass ihre relativen Positionen erhalten bleiben. Lade fonts.css aus deiner Seite und verwende den angegebenen Fontnamen in CSS.

Worin unterscheidet sich das von einer reinen Formatkonvertierung?

Dieser Bildschirm bündelt WOFF2 mit CSS und einer HTML-Vorschau. Wenn du nur das Schriftformat ändern möchtest, verwende „Schriftformat konvertieren“.

Kann ich mich auf die Zeichen beschränken, die ich verwende?

Dieser Bildschirm schränkt Zeichen nicht ein. Er bereitet Schriften vor, die die ursprünglichen Zeichen behalten.

Werden die Zeichen fetter, wenn ich die Stärke ändere?

Die Einstellung legt den in CSS verwendeten Stärkewert fest. Sie verändert die Glyphen in der Schriftdatei nicht. Um fett oder kursiv zu verwenden, stelle eine Datei bereit, die diese Glyphen enthält.

Kann ich mehrere Dateien mit demselben Fontnamen verwenden?

Du kannst Dateien mit unterschiedlicher Stärke oder unterschiedlichem Stil registrieren. Wenn dieselbe Kombination aus Name, Stärke und Stil doppelt vorkommt, prüfe die betreffenden Einstellungen.

Was passiert, wenn ich die Schriften erneut auswähle?

Das aktuelle Schriftpaket und die erzeugte ZIP werden entfernt und das neu ausgewählte Paket wird geladen. Wähle auch die Dateien mit aus, die du weiterhin verwenden möchtest.

Was ist, wenn nicht alle Beispielzeichen angezeigt werden?

Zeichen, die nicht in der Schrift enthalten sind, werden möglicherweise mit einer anderen Schrift angezeigt. Prüfe die darstellbaren Zeichen und das Aussehen an der Stelle, an der die Schrift verwendet wird.

Was ist, wenn eine Schrift nicht geladen werden kann?

Wähle Schriften in einem unterstützten Format erneut aus. Wenn eine Datei im Paket nicht konvertiert oder geladen werden kann, wird kein teilweise erfolgreiches Paket gespeichert.

Eingabe und Ergebnis

Eingabe
TTF, OTF, WOFF und WOFF2. Du kannst mehrere zusammen auswählen.
Bedingungen
Prüfe die Nutzungsbedingungen der eingegebenen Schriften, einschließlich der Einbettung ins Web.
Einstellungen
In CSS verwendete Namen, Stärken, Stile und die Anzeige während des Ladens.
Ausgabe
webfont-kit.zip. Enthält WOFF2, fonts.css und preview.html.

Aktuelle Einstellungen

Werkzeuge suchen