Guide d'utilisation Annuler

Polices colorées OpenType-SVG

  1. Guide de l’utilisateur d’Adobe Fonts
  2. Introduction
    1. Conditions d’abonnement et configuration requise
    2. Navigateurs et systèmes d’exploitation pris en charge
    3. Ajout de polices sur ordinateur
    4. Ajout de polices à votre site web
    5. Ajout de polices sur CC Mobile
  3. Attribution de licences pour les polices
    1. Attribution de licences pour les polices
    2. Gérer votre compte
    3. Attribution de licences pour les clients de Creative Cloud abonnement Entreprise
    4. Ajout de licences de police à votre compte
    5. Suppression de polices de la bibliothèque d’abonnement
    6. Adobe Fonts indisponible pour les Adobe ID enregistrés en Chine
    7. Pourquoi ces polices ne sont-elles pas incluses dans mon abonnement Creative Cloud ?
    8. Suppression de polices Morisawa septembre 2021
  4. Obtention et utilisation de polices
    1. Utilisation d’Adobe Fonts dans les applications Creative Cloud
    2. Gestion des polices
    3. Résolution des problèmes de polices manquantes dans les applications de bureau
    4. Utilisation des polices dans InDesign
    5. Polices et typographie
    6. Utilisation de polices web dans les documents Canvas HTML5
    7. Utilisation de polices dans InCopy
    8. Comment utiliser des polices dans Adobe Muse
    9. Utilisation de polices web dans Muse
    10. Assemblage de fichiers de polices
    11. Guide de dépannage : ajout de polices
    12. Les polices ajoutées n’apparaissent pas dans le menu des polices
    13. « Impossible d’ajouter une ou plusieurs polices » ou « Une police avec le même nom est déjà installée »
    14. Que se passe-t-il si une police que j’utilise est mise à jour par la fonderie ?
  5. Conception et développement web
    1. Ajout de polices à votre site web
    2. Guide de dépannage : ajout de polices à un site web
    3. Utilisation de polices web dans des bulletins d’information ou des courriers électroniques HTML
    4. Utilisation de polices web avec des pages AMP (Accelerated Mobile Pages)
    5. Sélecteurs CSS
    6. Personnalisation des performances des polices web avec les paramètres font-display
    7. Codes incorporés
    8. Jeu partiel dynamique et distribution de polices web
    9. Événements typographiques
    10. Pourquoi mes polices web proviennent-elles du réseau use.typekit.net ?
    11. Le site ne peut pas se connecter à use.typekit.net
    12. Utilisation de polices web avec CodePen
    13. Navigateurs et systèmes d’exploitation pris en charge
    14. Domaines
    15. Utilisation de polices web au cours d’un développement en local
    16. Politique de sécurité du contenu
    17. Impression de polices web
  6. Prise en charge linguistique et fonctionnalités OpenType
    1. Prise en charge linguistique et jeux partiels
    2. Utilisation des fonctionnalités OpenType
    3. Syntaxe des fonctionnalités OpenType en CSS
  7. Technologie des polices
    1. Polices colorées OpenType-SVG
    2. Ten Mincho : remarques importantes concernant la mise à jour à partir de la version 1.000

Le format OpenType-SVG est un format de police dans lequel tous ou certains des glyphes d’une police OpenType sont représentés comme des images SVG (Scalable Vector Graphics). Il est ainsi possible d’afficher dans un seul glyphe plusieurs couleurs et dégradés. C’est pourquoi les polices OpenType-SVG sont également appelées « polices colorées ».

Grâce aux polices OpenType-SVG, le texte peut s’afficher avec toutes ces qualités graphiques, tout en restant modifiable et indexable et faire l’objet de recherches. Ces polices peuvent aussi contenir les fonctionnalités OpenType, qui permettent la substitution des glyphes ou des variantes des styles de glyphe.

Les polices colorées telles que Trajan Color Concept et EmojiOne Color apparaissent avec les autres polices types dans les menus de polices de vos applications. Il est possible toutefois qu’elles ne soient pas entièrement fonctionnelles, car de nombreuses applications ne prennent pas totalement en charge les composants de couleur. Si votre logiciel ne prend pas en charge les images SVG dans les polices, les glyphes sont remplacés par un style noir uni. Il est toutefois possible de colorer ce style de substitution, puisqu’il fonctionne de la même façon qu’une police OpenType type.

Utilisation des polices colorées OpenType-SVG dans Photoshop

Photoshop (CC 2017 et nouvelles versions) prend en charge les polices OpenType-SVG et est fourni avec deux de ces polices : Trajan Color et EmojiOne. La police Trajan Color est également incluse avec votre abonnement Creative Cloud en vue d’une utilisation sur le web ou sur un ordinateur.

Polices OpenType-SVG : couleurs et dégradés multiples
Polices OpenType-SVG : couleurs et dégradés multiples

Pour utiliser les polices OpenType-SVG, procédez comme suit :

  • Créez un calque de type texte de paragraphe ou de point.
  • Définissez la police comme police OpenType-SVG. Ces polices sont marquées de l’icône OpenType-SVG :

  • Effectuez la saisie à l’aide du clavier ou sélectionnez des glyphes spécifiques à l’aide du panneau Glyphes. Pour afficher le panneau Glyphes, sélectionnez Fenêtre > Glyphes.

Avec les polices OpenType-SVG, vous pouvez saisir des lettres simplement à l’aide du clavier ; toutefois, la gamme complète des variantes de glyphes est disponible uniquement à partir du panneau Glyphes. Trajan Color Concept, par exemple, comprend 20 jeux stylistiques pour chaque caractère, notamment Silver (argent), Copper (cuivre), Steel Blue (bleu acier) et Marble (marbre), accessibles uniquement dans le panneau Glyphes.

Si vous convertissez un calque de texte en forme modifiable (en sélectionnant Texte > Convertir en forme), le style de substitution noir et blanc des caractères des polices OpenType-SVG est rétabli.

Style de substitution de Trajan Color
Style de substitution de Trajan Color

Style de substitution d’EmojiOne
Style de substitution d’EmojiOne

Utilisation des polices colorées OpenType-SVG dans Illustrator

Illustrator prend en charge les polices OpenType-SVG telles que Trajan Color et EmojiOne Color. À l’aide du panneau Glyphes, vous pouvez sélectionner des glyphes spécifiques, mais aussi créer des glyphes composés et explorer d’autres variantes de caractère. Pour plus d’informations sur les polices OpenType SVG dans Illustrator, rendez-vous à l’adresse https://helpx.adobe.com/fr/illustrator/using/fonts.html#OpenTypeSVGfonts.

Trajan Color Concept

Trajan Color Concept est l’un de nos concepts Adobe Type Concepts : une police de caractères élaborée selon un processus de développement souple et un caractère simplifié que nous pouvons proposer plus tôt à nos clients entreprenants afin qu’ils nous fassent part de leurs commentaires pour que nous puissions perfectionner la conception.

Trajan Color Concept propose différentes (19) couleurs et textures. Le recours à des images SVG aussi détaillées pour accéder aux différentes combinaisons de couleur dans les 20 jeux stylistiques augmente la taille générale du fichier. (Si vous pensez que l’utilisation de ces polices est plus complexe, vous avez raison. C’est pourquoi Trajan Color est considérée comme une police conceptuelle.)

Le style de couleur par défaut (Gold) et les 18 premiers jeux stylistiques OpenType de Trajan Color Concept composent toutes les options multicolores de la police. Le style de substitution (qui s’affiche dans les applications qui ne prennent pas encore en charge les fonctionnalités de couleur des polices OpenType-SVG) correspond au jeu stylistique 20.

Vous pouvez sélectionner d’autres couleurs de caractère dans Trajan Color en utilisant le panneau Glyphes ou le panneau de sélection contextuel.
Dans Photoshop (illustré) et dans Illustrator, vous pouvez sélectionner d’autres couleurs de caractère dans Trajan Color en utilisant le panneau Glyphes ou le panneau de sélection contextuel.

EmojiOne Color

Les polices Emoji constituent un autre exemple de polices OpenType-SVG. Elles vous permettent d’inclure dans vos documents un grand choix de caractères colorés et graphiques, tels que des émoticônes, des drapeaux, des panneaux de signalisation, des animaux, des personnages, des aliments ou des monuments. Les polices d’émojis OpenType-SVG, telles que la police EmojiOne, permettent de créer des glyphes composés d’un ou de plusieurs autres glyphes. Par exemple, vous pouvez créer des drapeaux de pays ou modifier la couleur de peau de certains glyphes représentant des personnes et des parties du corps comme les mains et le nez.

EmojiOne Color est une police colorée Open Source élaborée par Adobe d’après l’illustration EmojiOne conçue par Denis Denz et produite par Rick Moby. Elle contient tous les caractères emoji Unicode 9.0 et prend en charge les emojis de « liant sans chasse », de diversité de coloration de la peau et de drapeaux de pays.

Panneau Glyphes dans Photoshop présentant une portion du jeu de caractères d’EmojiOne Color.
Panneau Glyphes dans Photoshop présentant une portion du jeu de caractères d’EmojiOne Color.

Les caractères d’une police emoji telle qu’EmojiOne diffèrent des lettres de votre clavier. Ils peuvent être insérés uniquement par l’intermédiaire du panneau Glyphes, du système d’exploitation (Charmap (Windows) et Characters (Mac OS)) ou en copiant le texte d’une page en ligne telle qu’emojicopy.com.

Remarques :

  • Vous pouvez également ouvrir le panneau Glyphes en sélectionnant Fenêtre > Espace de travail > Graphique et Web, puis en cliquant sur l’onglet Glyphes.
  • Les emojis récemment utilisés apparaissent dans la ligne supérieure du panneau Glyphes.

Dans Photoshop, vous pouvez insérer une séquence de glyphes EmojiOne afin de composer de nouveaux glyphes. Par exemple, vous pouvez créer des drapeaux de pays ou modifier la couleur de peau ou une partie du corps d’une personne. (Ceci n’est pas possible sur un emoji de deux ou plusieurs personnes.)

Création de drapeaux de pays Les lettres encerclées (A, B, C, D, etc.) dans EmojiOne ne correspondent pas aux touches du clavier. Lorsque vous insérez ces caractères depuis le panneau Glyphes pour composer le code ISO d’un pays, les deux caractères forment le drapeau de ce pays. Par exemple, US donne le drapeau américain, GB donne le drapeau britannique, AR donne le drapeau argentin et IN donne le drapeau indien. La liste complète des codes est définie par la norme ISO 3166-1.

Combinaison de glyphes pour former les drapeaux des pays

Création de variantes de caractère Associez les caractères ou membres d’une seule personne à l’un des phototypes de la classification de Fitzpatrick (GID 356 à 360). Le caractère par défaut d’origine est remplacé par un autre qui correspond à la couleur de peau. Ces combinaisons ne sont actuellement pas compatibles avec les glyphes contenant plusieurs personnes.  

Caractères à la peau colorée (GID 356 à 360)

Combinaison de caractères de personnage avec des couleurs de peau

Remarques :

  • Les emojis de membres ou de caractères par défaut d’une seule personne peuvent être associés une seule fois aux caractères de couleur de peau.
  • Les séquences de glyphes sont l’une des fonctions de police. Toutes les polices OpenType-SVG ne permettent pas de combiner plusieurs caractères pour composer un seul glyphe.

Utilisation des polices OpenType-SVG avec CSS

Les fonctions des polices OpenType-SVG peuvent être activées par l’intermédiaire des feuilles CSS de la même façon que les autres polices OpenType. Reportez-vous aux sections Utilisation des fonctionnalités OpenType et Syntaxe des fonctionnalités OpenType en CSS pour savoir comment accéder à ces fonctions.

D’autres styles de couleur dans Trajan Color Concept, par exemple, sont configurés comme des fonctions OpenType appelées « jeux stylistiques », numérotés de 1 à 20 (ss01, ss02, ss03, etc.). Pour appliquer l’un des 20 styles au texte dans Trajan Color, utilisez les paramètres de fonctionnalité de police :

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

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

Dans les navigateurs qui ne prennent pas en charge les polices OpenType-SVG, le style de substitution (identique au jeu stylistique 20) s’affichera.

Lorsque vous ajoutez des polices web OpenType-SVG sur votre site, gardez à l’esprit que les fichiers peuvent être plus volumineux que les polices OpenType ordinaires, en raison de l’ajout d’images SVG associées à tous ou à certains des glyphes de la police.  

Applications prenant en charge les polices OpenType-SVG

  • Photoshop, version CC 2017 et versions ultérieures
  • Illustrator
  • Firefox, versions 32 et versions ultérieures
  • Microsoft Edge, Windows 10 version anniversaire et versions ultérieures
  • Sous Windows 10, les composants de plateforme DirectWrite et Direct2D permettent la prise en charge d’OpenType-SVG dans n’importe quelle application utilisant ces API.

Problèmes connus

Illustrator et InDesign

Les problèmes suivants peuvent survenir lors de l’utilisation de polices colorées OpenType-SVG dans Illustrator ou InDesign :

  • Il se peut que des glyphes apparaissent à des positions incorrectes à la suite d’une exportation au format PDF ou SVG.
  • Lorsque vous appliquez l’effet Sheer, Rotate ou Reflect sur des polices SVG colorées, il se peut que cet effet disparaisse ou que les caractères quittent leur position initiale lors de la création des contours de glyphe. 
  • Lorsque vous définissez le texte verticalement, il se peut que la position des caractères semble différente après l’exportation.
  • Lorsque vous définissez le texte sur un tracé en spirale, le positionnement des caractères peut paraître incorrect.

Les équipes logicielles travaillent actuellement à l’élaboration de correctifs pour ces problèmes. 

Autres ressources

Voici quelques liens vers d’autres sources d’informations relatives à la préparation et à l’utilisation des polices OpenType-SVG :

 

 Adobe

Recevez de l’aide plus rapidement et plus facilement

Nouvel utilisateur ?

Adobe MAX 2024

Adobe MAX

The Creativity Conference

Du 14 au 16 octobre à Miami Beach et en ligne

Adobe MAX 2024

Adobe MAX

The Creativity Conference

Du 14 au 16 octobre à Miami Beach et en ligne