Ein variabler Font ist eine einzelne Fontdatei, in der eine kontinuierliche Palette an Fontstil-Variationen (mit verschiedenen Breiten, Stärken oder Größen) gespeichert werden kann.

Im Rahmen der OpenType 1.8-Spezifikation wurden neue Datenstrukturen für variable Fonts eingeführt. Mithilfe dieser Datenstrukturen können zwei oder mehr Stile aus einer Fontfamilie in eine einzelne Fontdatei gepackt werden.

Ein variabler Font enthält ein einzelnes Konturen-Set, von dem nahezu unbegrenzte Instanzen über Datensets abgeleitet werden können. Dies geschieht durch Definition eines Sets von Konturen-Variationen innerhalb des Fonts. Diese stellen einen ein- oder mehrachsigen Gestaltungsraum dar, in dem eine große Anzahl von Font-Instanzen interpoliert werden kann.

Nutzen Sie die Option Nur variable Fonts anzeigen für Variable Fonts im Abschnitt Filter auf der Seite Durchsuchen>Fonts von Monotype Fonts, um die variablen Fonts anzuzeigen.

Hinweis: Alle variablen Fonts, die von Monotype Fonts zur Verfügung gestellt werden, sind mit dem Label versehen.

Der Unterschied zwischen statischen Fonts und variablen Fonts

Der Unterschied zwischen statischen Fonts und variablen Fonts ergibt sich aus der nachstehenden Tabelle:

	Statische Fonts	Variable Fonts
Definition	Fonts mit festgelegten Stilen, die für jede Variation eine andere Datei erfordern.	Fonts, die die Speicherung vieler verschiedener Schriftvariationen in einer einzelnen Datei ermöglichen.
Unterschiedliche Datei für jede Variation	Ja	Nein
Verbessert die Website-Performance	Nein	Ja
Bietet Flexibilität beim Design	Nein	Ja
Unterstützt CSS-Übergänge	Nein	Ja
Komprimierung	Nein	Ja
Responsive Typografie	Nein	Ja
Einfache Verteilung	Nein	Ja
Zugängliche Typografie	Nein	Ja
Anzahl der enthaltenen Stile	Ein Stil	Mehr als ein Stil
Browser-Support	Ja	Wird nicht von allen Web-Browsern unterstützt
Verfügbarkeit dynamischer Texteffekte	Nein	Ja

Die Vorteile variabler Fonts

Der Einsatz variabler Fonts hat viele Vorteile, wie z. B.:

Komprimierung
Die Größe eines variablen Fonts ist geringer als die Gesamtgröße der statischen Fonts, die denselben entsprechenden Stilumfang des variablen Fonts darstellen. Die Gesamtgröße zweier statischer Fonts, die innerhalb eines Projekts separat genutzt werden, übersteigt beispielsweise die Größe eines einzelnen variablen Fonts, der diese beiden Fonts umfasst. Je mehr Stile Sie einem variablen Font hinzufügen, desto mehr sparen Sie.
Verbesserte Website-Performance
Eine Website kann eine einzelne variable Fontdatei laden und die Variationen bei Bedarf anpassen. Dies verbessert die Ladegeschwindigkeit und die Performance der Website.
Einfache Verteilung
Dynamische Texteffekte
Variable Fonts können anhand von CSS-Animationen oder -Übergängen animiert werden. Sie können außerdem dynamische Texteffekte erstellen, die die Stärke, Breite, Neigung oder sonstige Eigenschaften des Fonts mit der Zeit ändern.
Mehr Variabilität
Sie können eine große Bandbreite an Stilen in eine einzelne Fontdatei packen. Die OpenType 1.9-Spezifikation definiert Tags für fünf spezifische Achsen:
- Schriftstärke
- Schriftbreite
- Optische Größen
- Kursiv (ggü. Roman)
- Geneigt (ggü. Roman)
Die OpenType-Fontspezifikation lässt uns jedoch alle denkbaren Variationen erstellen und durch private benutzerdefinierte Achsen zeichnen.

Monotype bietet viele Fontfamilien, die für eine Vielzahl von Stärken und Breiten konzipiert sind. Zum Beispiel: Helvetica Now, Cotford, Kairos Sans und Futura Now.
Responsive Typografie
Variable Fonts bieten responsive Typografie und Anwendungsoptimierung. Die Stärke, der Kontrast und andere Variablen können zur Optimierung der Lesbarkeit auf einem bestimmten Gerät angepasst werden. Dies ähnelt dem Edge-Tuning, wobei wir die Optimierung hier gezielter anwenden können als nur im Rahmen eines Filters, der sich sowohl auf X als auch auf Y gleich auswirkt.
Hinweis: Bei der Typografie bezieht sich der Begriff „Edge-Tuning“ auf die Optimierung (Anpassung) der Abstände, Kurven und Winkel von Buchstaben, um optimale Lesbarkeit und visuelle Harmonie zu erzielen.
Bietet kreative Effizienz
Variable Fonts sind flexibel und effizient und verfügen außerdem über kreatives Potenzial. Dies macht sie zu einer wertvollen Ressource für kreative Designer.
Zugängliche Typografie
Anhand der möglichen Variationen bei variablen Fonts, die sich an die Leser und ihre Umgebung anpassen können, kann ein besseres Erlebnis erzielt werden.

Beschränkungen variabler Fonts

Je nach Anwendungsfall können variable Fonts den folgenden Beschränkungen unterliegen:

Ein variabler Font ist eine komprimierte Form mehrerer Stile. Wenn Sie jedoch nur daran interessiert sind, zwei oder drei Stärken aus einer riesengroßen variablen Fontfamilie einzusetzen, verlieren Sie möglicherweise die Größeneinsparungen. Das heißt, dass variable Fonts zwar die Dateigröße verringern können, aber auch erhöhen, wenn sie viele Variationen umfassen, die nicht benötigt werden.
Nicht alle Fonts sind im variablen Format erhältlich.

Neuere Fontdaten werden üblicherweise als interpolierbare Schriften gezeichnet und können einfach als variable Fonts entwickelt werden. Ältere Fonts, die separat als statische Designs gezeichnet wurden, weisen unter Umständen eine größere strukturelle Variabilität über eine Achse hinweg auf und lassen sich nicht einfach als interpolierbare Fonts erstellen.

Times New Roman ist beispielsweise ein schlechter Kandidat, da die Änderungen bei der Betonungsdirektionalität sowie bei der Form und Ausrichtung der Serifen bei den Kleinbuchstaben zu seltsamen Interpolationen führen.

Es gibt weltweit eine Handvoll von Fontfamilien, bei denen aufrechte Zeichen als interpolierbar mit der entsprechenden kursiven Variante gezeichnet werden. Es gibt auch viele schräge oder geneigte Fonts, die sich vielleicht eignen, aber diese Variabilität zwischen den Extremen bietet einen Mehrwert für die Kunden.
Variable Fonts werden nicht von allen Browsern unterstützt.

Einzelheiten hierzu sind dem Abschnitt Browser-Support zu entnehmen.
· Die Anpassung der Variationen eines Fonts innerhalb der variablen Fontdatei kann sich komplex gestalten und erfordert gute CSS- und Fontdesign-Kenntnisse.

Browser-Support für variable Fonts

Unsere WOFF- und WOFF2-Fontdateien werden von allen modernen Browsern unterstützt. Unterschiedliche Browser oder Browser-Versionen können unterschiedliche Formate unterstützen.

Browser-Support für WOFF-Fontdateien

Internet Explorer 9+
Edge 12+
Firefox 3.6+
Chrome 5+
Safari 5.1+
Opera 11.5+
iOS Safari 5+
Android 4.4+
Blackberry 7+
Opera Mobile 12+
Chrome Android 70+
Firefox Android 63+
Internet Explorer Mobile 10+
UC for Android 11.8+
Samsung Internet 4+
QQ 1.2+
Baidu 7.12+

Browser-Support für WOFF2-Fontdateien

Edge 14+
Firefox 39+
Chrome 36+
Safari 12+
Opera 23+
iOS Safari 10+
Android 67+
Opera Mobile 46+
Chrome Android 70+
Firefox Android 63+
Samsung Internet 4+
QQ 1.2+
Baidu 7.12+

Anwendungsfälle für variable Fonts

Download von variablen Fonts

Führen Sie die nachstehenden Schritte aus, um variable Fonts von der Monotype Fonts-Plattform herunterzuladen:

Klicken Sie auf das Symbol Synchronisierungs- und Downloadoptionen für den erforderlichen variablen Font.
Öffnen Sie die Registerkarte Downloadoptionen.
Wählen Sie Ihr bevorzugtes Dateiformat (z. B. CFF oder TFF) für den Download aus.
Wählen Sie einzelne Fontstärken und -stile für den Download aus oder klicken Sie auf Fontfamilie herunterladen, um die gesamte Fontfamilie herunterzuladen.

Installation von variablen Fonts

Mac

Führen Sie die nachstehenden Schritte aus, um einen Font auf einem Mac-Gerät zu installieren:

Extrahieren Sie die Inhalte des heruntergeladenen ZIP-Archivs per Doppelklick.
Jetzt stehen Ihnen die beiden folgenden Optionen zur Installation eines Fonts auf dem Mac-Gerät zur Verfügung:
Ziehen Sie die Fontdateien zur Aktivierung des Fonts in den Ordner „Fonts“, der sich im Ordner „Library“ befindet: Macintosh HD/Library/Fonts. Sie können auch die Tastenkombination Strg+Umschalttaste+G verwenden.
Verwenden Sie Font Book, die Fontverwaltungs-App für Mac OS, zur Installation der Fonts.
Klicken Sie zweimal auf den Font, sodass ein „Font Book“-Fenster erscheint.
Klicken Sie zur Installation der Fonts auf Fonts installieren.
Der Abschnitt „Support“ auf der Website von Apple – http://support.apple.com/kb/HT2509 – enthält weitere Informationen hierzu.
Starten Sie alle offenen Anwendungen neu, um die neu installierten Fonts nutzen zu können.

Windows

Windows XP oder höher:

Klicken Sie mit der rechten Maustaste auf das ZIP-Archiv und wählen Sie Alle extrahieren. Dies erstellt einen neuen Ordner mit Ihren Fonts an dem von Ihnen gewählten Speicherort.

Alle anderen Windows-Versionen:

Gehen Sie zu Festplatte (C:) › Windows › Fonts. Gehen Sie zu dem Ordner, den Sie mithilfe der heruntergeladenen ZIP-Datei erstellt haben, und ziehen Sie die Fontdateien in den Ordner „Fonts“.

Windows 7 und höher:

Klicken Sie mit der rechten Maustaste auf die extrahierten Fontdateien und wählen Sie Installieren oder Für alle Benutzer installieren.
Starten Sie alle offenen Anwendungen neu, um die neu installierten Fonts nutzen zu können.

Synchronisierung variabler Fonts

Die Synchronisierung von Fonts involviert den Transfer von Fonts vom Browser-Dashboard in die Desktop-App von Monotype.

Fonts und Fontfamilien, die in die Desktop-App von Monotype synchronisiert wurden, stehen in den meisten Design-Anwendungen automatisch zur Verfügung. Es ist kein Download von einzelnen Fontdateien erforderlich.

Die Synchronisierung ist die primäre Methode, mit der über Monotype Fonts auf Fonts zugegriffen werden kann.

Führen Sie die nachstehenden Schritte aus, um variable Fonts in der Desktop-App von Monotype zu synchronisieren:

Klicken Sie zur Synchronisierung des benötigten variablen Fonts auf das Symbol Synchronisierungs- und Downloadoptionen.
Wählen Sie in der Registerkarte Mit Monotype-App synchronisieren Ihr bevorzugtes Dateiformat (z. B. CFF oder TTF) aus.
Synchronisieren Sie einzelne Fontstärken und -stile oder klicken Sie zur Synchronisierung der gesamten Fontfamilie auf Fontfamilie synchronisieren.

Rückgängigmachen der Synchronisierung variabler Fonts

Führen Sie die nachstehenden Schritte aus, um die Synchronisierung eines variablen Fonts rückgängig zu machen:

Klicken Sie auf das Symbol Synchronisierungs- und Downloadoptionen für den synchronisierten variablen Font.
Klicken Sie in der Registerkarte Mit Monotype-App synchronisieren auf Synchronisierung rückgängig machen.

Einsatz variabler Fonts

Kommerziell erhältliche variable Fonts werden derzeit im TTF-Format erstellt. Es besteht die Möglichkeit, ein Set von statischen Fonts, die zu Ihren variablen Fonts passen, anzufordern. Diese können zeitgleich mit den variablen Fonts installiert werden.

Variable Fonts bringen wahrscheinlich für Web- und Design-Teams den größten Nutzen. Sie bieten im Vergleich zu statischen Fontfamilien Einsparungen bei der Dateigröße. Dies ist besonders relevant für Webanwendungen. Die Einsparungen bei der Dateigröße sind abhängig vom Design und von der Anzahl der Stile. Generell sind sie innerhalb der Fontfamilie proportional zur Anzahl der Stile. Variable Fonts bieten außerdem mehr Flexibilität für das UI-Design-Team.