OpenType-SVG ist ein Schriftartenformat, in dem alle oder einige Glyphen einer OpenType-Schriftart in Form von SVG-Grafiken (skalierbare Vektorgrafiken) dargestellt werden. Dadurch wird die Anzeige mehrerer Farben und Farbverläufe in einer Glyphe möglich. Aufgrund dieser Merkmale bezeichnen wir OpenType-SVG-Schriftarten auch als „Farb-Schriftarten“.

OpenType-SVG-Schriftarten bieten die Möglichkeit, Text mit solchen grafischen Optionen anzuzeigen, während er gleichzeitig weiterhin bearbeitet, indiziert oder durchsucht werden kann. Unter Umständen enthalten Sie auch OpenType-Merkmale, die Glyphenersetzung oder alternative Glyphenstile ermöglichen.

Farb-Schriftarten wie Trajan Color Concept und EmojiOne Color werden genau wie herkömmliche Schriftarten in den Schriftarten-Menüs Ihrer Applikationen angezeigt, entfalten dabei jedoch unter Umständen nicht ihr volles Potenzial, da einige Applikationen die Farbkomponenten noch nicht vollumfänglich unterstützen. Wenn Ihre Software-Applikation die SVG-Grafiken in den Schriftarten nicht unterstützt, sind die Glyphen stattdessen schwarz. Sie können dennoch Farben auf diesen Ausweichstil anwenden, da er wie eine herkömmlicher OpenType-Schriftart funktioniert.

Verwenden von OpenType-SVG-Farb-Schriftarten in Photoshop CC

Photoshop CC 2017 unterstützt OpenType-SVG-Schriftarten und enthält zwei davon: Trajan Color und EmojiOne. Auch Trajan Color ist für die Web- und Desktop-Verwendung im Rahmen Ihres Creative Cloud-Abonnements enthalten.

OpenType-SVG-Schriftarten: Mehrere Farben und Verläufe
OpenType-SVG-Schriftarten: Mehrere Farben und Verläufe

Führen Sie folgende Schritte aus, um OpenType-SVG-Schriftarten zu verwenden:

  • Erstellen Sie entweder einen Absatz oder eine Punkttext-Ebene.
  • Legen Sie eine OpenType-SVG-Schriftart fest. Diese Schriftarten sind mit dem OpenType-SVG-Symbol gekennzeichnet:
svg-font-icon
  • Verwenden Sie die Tastatur oder wählen Sie einzelne Glyphen über das Glyphenbedienfeld aus. Um das Glyphenbedienfeld anzuzeigen, wählen Sie „Fenster“ > „Glyphen“.

Sie können zwar mittels OpenType-SVG-Schriftarten einzelne Buchstaben eingeben, doch das gesamte Spektrum der Glyphenvarianten steht nur über das Glyphenbedienfeld zur Verfügung. Trajan Color Concept umfasst beispielsweise 20 verschiedene Stilsets für jedes Zeichen, wie Silber, Kupfer, Stahlblau oder Marmor. Der Zugriff darauf erfolgt über das Glyphenbedienfeld.

Wenn Sie eine Textebene in eine bearbeitbare Form konvertieren (durch Auswahl von „Typ“ > „In Form konvertieren“), werden Zeichen aus OpenType-SVG-Schriftarten auf den schwarzweißen Ausweichstil zurückgesetzt.

Ausweichstil von Trajan Color
Ausweichstil von Trajan Color

Ausweichstil von EmojiOne
Ausweichstil von EmojiOne

Verwenden von OpenType-SVG-Farb-Schriftarten in Illustrator CC

Illustrator unterstützt OpenType-SVG-Schriftarten wie Trajan Color und Emoji One Color. Sie können bestimmte Glyphen mithilfe des Glyphenbedienfelds einrichten. Außerdem können Sie im Glyphenbedienfeld zusammengesetzte Glyphen erstellen und andere Zeichenvarianten ausprobieren. Weitere Informationen zu OpenType-SVG-Schriftarten in Illustrator finden Sie unter https://helpx.adobe.com/de/illustrator/using/fonts.html#OpenTypeSVGfonts.

Trajan Color Concept

Trajan Color Concept ist Teil von Adobe Type Concepts: Eine Schriftart, die im Rahmen eines agilen Entwicklungsprozesses entwickelt und so herunterskaliert wurde, dass wir sie experimentierfreudigen Kunden vorab zur Verfügung stellen können, um Feedback für das weitere Design zu erhalten.

Bei Trajan Color Concept können Sie zwischen vielen (19) verschiedenen Farben und Strukturen wählen. Durch die Verwendung so vieler detaillierter SVG-Grafiken für unterschiedliche Farbkombinationen in den 20 Stilsets wird die Datei insgesamt größer. (Wenn dies für Sie nach einer Herausforderung bei der Verwendung klingt, haben Sie recht. Aus diesem Grund gilt Trajan Color weiterhin als Konzept-Schriftart.)

Der Standard-Farbstil (Gold) und die ersten 18 OpenType-Stilsets in Trajan Color Concept liefern sämtliche in der Schriftart verfügbaren Multicolor-Optionen. Der Ausweichstil, der in Applikationen angezeigt wird, die die Farbfunktionen von OpenType-SVG noch nicht unterstützen, entspricht dem Stilset 20.

TrajanColor-Glyphs-panel
Sie können in Trajan Color im Glyphenbedienfeld oder im Popup-Auswahlfeld andere Zeichenfarben auswählen.
In Photoshop CC 2017 (gezeigt) und in Illustrator CC können Sie in Trajan Color im Glyphenbedienfeld oder im Popup-Auswahlfeld andere Zeichenfarben auswählen

EmojiOne Color

Emoji-Schriftarten sind eine Untergruppe der OpenType-SVG-Schriftarten. Mithilfe von Emoji-Schriftarten können Sie verschiedene farbenfrohe und grafische Zeichen, wie Smileys, Flaggen, Straßenschilder, Tiere, Personen, Essen oder Sehenswürdigkeiten in Ihre Dokumente einfügen. OpenType-SVG-Emoji-Schriftarten wie EmojiOne ermöglichen es Ihnen, bestimmte zusammengesetzte Glyphen aus einer oder mehreren anderen Glyphen zu erstellen. Sie können beispielsweise Länderflaggen erstellen oder die Hautfarbe bestimmter Glyphen ändern, die Personen oder Körperteile wie Hände oder Nasen darstellen.

EmojiOne Color ist eine Open-Source-Farb-Schriftart, die von Adobe auf der Basis der von Denis Denz entworfenen und von Rick Moby produzierten EmojiOne-Grafiken entwickelt wurde. Die Schriftart enthält sämtliche in Unicode 9.0 verfügbaren Emojis sowie Unterstützung für breitenlose Verbinder, unterschiedliche Hauttöne und Länderflaggen.

Glyphenbedienfeld mit einem Teil des Zeichensatzes von EmojiOne Color
Glyphenbedienfeld in Photoshop CC 2017 mit einem Teil des Zeichensatzes von EmojiOne Color.

Zeichen in einer Emoji-Schriftart, wie EmojiOne, unterscheiden sich von den Buchstaben Ihrer Tastatur. Sie können ausschließlich über das Glyphenfeld des Betriebssystems – Charmap (Windows) bzw. Characters (Mac OS) – oder durch das Kopieren von Text von einer Online-Seite wie emojicopy.com eingefügt werden.

Anmerkungen:

  • Sie können das Glyphenbedienfeld auch öffnen, indem Sie „Fenster“ > „Arbeitsbereich“ > „Grafik und Web“ auswählen und dann auf die Registerkarte „Glyphen“ klicken.
  • Zuletzt verwendete Emojis werden in der oberen Zeile des Glyphenbedienfelds angezeigt.

In Photoshop CC können Sie eine Sequenz von EmojiOne-Glyphen eingeben, um andere Glyphen zu erzeugen. Sie können beispielsweise Länderflaggen erstellen oder den Hautton von Figuren oder Körperteilen ändern. (Dies funktioniert nicht bei Emojis mit zwei oder mehr Personen.)

Erstellen von Länderflaggen Die eingekreisten Buchstaben (A, B, C, D usw.) in EmojiOne entsprechen nicht den Tasten auf der Tastatur. Wenn Sie diese Zeichen im Glyphenbedienfeld einfügen, um den ISO-Code eines Landes zu erstellen, bilden die beiden Zeichen die Flagge des jeweiligen Landes. So ergibt beispielsweise „US“ die US-amerikanische Flagge , „GB“ die britische Flagge, „AR“ die argentinische Flagge und „IN“ die indische Flagge. Die vollständige Code-Liste ist in ISO 3166-1 definiert.

Kombinieren von Glyphen zur Darstellung von Länderflaggen
Kombinieren von Glyphen zur Darstellung von Länderflaggen

Erstellen von Zeichenvarianten Kombinieren Sie Standardzeichen mit einer Person oder Körperteile mit einem der fünf auf der Fitzpatrick-Skala verfügbaren Hauttypen (GID 356 bis 360). Das ursprüngliche Standardzeichen wird durch eines mit der passenden Hautfarbe ersetzt. Solche Zusammensetzungen sind derzeit nicht mit Glyphen möglich, die mehrere Personen enthalten.  

Hautfarbene Zeichen (GID 356 bis 360)
Hautfarbene Zeichen (GID 356 bis 360)

Anwenden von Hauttönen auf Zeichen mit einzelnen Personen
Anwenden von Hauttönen auf Zeichen mit einzelnen Personen

Anmerkungen:

  • Die Standard-Emojis mit einer Person oder Körperteilen können nur einmal mit einer Hautfarbenoption kombiniert werden.
  • Bei Glyphensequenzen handelt es sich um ein Schriftarten-Merkmal. Nicht bei allen OpenType-SVG-Schriftaren können Sie mehrere Zeichen zu einer einzelnen Glyphe kombinieren.

Verwenden von OpenType-SVG-Schriftarten mit CSS

OpenType-SVG-Schriftarten enthalten bestimmte Merkmale, die über CSS aktiviert werden können, wie dies auch bei anderen OpenType-Schriftarten der Fall ist. Einen Überblick über den Zugriff auf diese Merkmale finden Sie unter Verwenden von OpenType-Merkmalen und unter Syntax für OpenType-Merkmale in CSS.

Die zusätzlichen Farbstile in Trajan Color Concept sind z. B. als OpenType-Merkmale eingerichtet, die als Stilsets bezeichnet werden und von 1 bis 20 nummeriert sind (ss01, ss02, ss03 usw.). Um einen der 20 Stile auf in Trajan Color gesetzten Text anzuwenden, können Sie font-feature-settings verwenden:

.Trajan-gold { font-family: 'Trajan Color Concept';
               font-feature-settings: "ss01"; }

.Trajan-silver { font-family: 'Trajan Color Concept';
               font-feature-settings: "ss02"; }

In Browsern, die keine OpenType-SVG-Schriftarten unterstützen, wird der Ausweichstil (identisch mit Stilset 20) angezeigt.

Wenn Sie Ihrer Website OpenType-SVG-Web-Schriftarten hinzufügen, beachten Sie, dass diese unter Umständen größere Dateien verwenden als gewöhnliche OpenType-Schriftarten, da allen oder nur einigen der Glyphen in der Schriftart SVG-Grafiken zugeordnet sind.  

Applikationen, die OpenType-SVG-Schriftarten unterstützen

  • Photoshop CC 2017
  • Illustrator CC
  • Firefox,Version 32 und höher
  • Microsoft Edge (unter Windows 10 Anniversary Edition und höher)
  • Unter Windows 10 bieten die Plattform-Komponenten DirectWrite und Direct2D OpenType-SVG-Unterstützung für sämtliche Applikationen, die diese APIs nutzen

Bekannte Probleme

Illustrator CC & InDesign CC

Möglicherweise stellen Sie bei der Verwendung von OpenType-SVG-Farb-Schriftarten in Illustrator oder InDesign die folgenden Probleme fest:

  • Glyphen werden unter Umständen nach dem Export in PDF oder SVG an den falschen Positionen angezeigt.
  • Bei Applikation der Effekte „Verbiegen“, „Drehen“ oder „Spiegeln“ auf SVG-Schriftarten gehen die Effekte unter Umständen verloren oder die Zeichen bewegen sich bei der Erstellung der Glyphenkonturen von ihrer ursprünglichen Position weg. 
  • Bei vertikalem Text können Zeichen nach dem Export an anderen Positionen angezeigt werden.
  • Bei Text auf einem Spiralpfad können Zeichen an falschen Positionen angezeigt werden.

Die Software-Teams arbeiten an der Behebung dieser Probleme. 

Weitere Ressourcen

Im Folgenden finden Sie einige Links zu anderen Informationsquellen zum Vorbereiten von und Arbeiten mit OpenType-SVG-Schriftarten:

 

Dieses Werk unterliegt den Bedingungen der Creative Commons Attribution-Noncommercial-Share Alike 3.0 Unported License.  Twitter™- und Facebook-Beiträge fallen nicht unter die Bedingungen der Creative Commons-Lizenz.

Rechtliche Hinweise   |   Online-Datenschutzrichtlinie