Polices de couleurs Guide du débutant

Alors qu'est-ce que c'est que la police de couleur? C'est un terme qui revient sans cesse et commence à gagner du terrain, bien que son utilisation dans les grands projets de conception en soit encore à ses balbutiements.

Des fournisseurs tels que Typekit d’Adobe ont commencé à publier certaines options de police de couleur avec la prise en charge du navigateur. Il ya donc une tendance à une utilisation plus large. Certains ont même appelé les polices de couleur - la prochaine grande chose dans la conception web.

Ici, nous allons regarder la tendance et vous laisser décider quelle taille - ou pas - Ce concept sera.

Qu'est-ce qu'une police de couleur?

Les polices de couleur sont presque exactement ce qu'elles sonnent. Les polices de caractères comprenant plusieurs couleurs, nuances ou dégradés, textures ou transparences. Ces options géniales ne font pas qu'ajouter de la couleur au lettrage, elles sont des polices spécifiques avec tous les détails inclus.

Les polices de couleur peuvent inclure des formes vectorielles, des images bitmap ou les deux dans les fichiers de polices, ce qui peut rendre ces polices plus lourdes que les packages de polices standard. Des exemples courants de polices de couleur incluent un caractère emoji ou une lettre contenant des icônes. Les polices à une couleur de ce style sont souvent appelées polices chromatiques, car elles ne contiennent qu'une teinte ou un gris.

Le plus gros problème avec les polices de couleur est qu’il n’ya pas de véritable format standard. Et tous ces formats de fichiers ont un inconvénient: les images vectorielles et SVG peuvent être facilement redimensionnées, mais les versions bitmap peuvent potentiellement avoir des limites de taille.

Il y a en fait cinq formats à traiter:

  • SBIX (Apple): version bitmap avec prise en charge native sur les systèmes Mac et iOS
  • CBDT (Google): version bitmap avec prise en charge native sur les systèmes Android
  • COLR (Microsoft): version vectorielle avec prise en charge native sur les systèmes Windows 8.1+
  • SVG (W3C): versions vectorielles et bitmap
  • OpenType SVG (Adobe / Mozilla): versions vectorielles et bitmap insérant des formes SVG dans des polices OpenType

D'autre part, les principaux acteurs commencent à adopter des directives d'utilisation. Mozilla (la colonne vertébrale du navigateur Web Firefox) et Adobe ont convenu qu'OpenType SVG était le format préféré. d'autres sont encore en pleine mutation au moment où ils prennent une décision.

Si vous souhaitez en savoir plus sur le fonctionnement de ces polices et sur toutes les spécifications de format de fichier, Fontself est un très bon apprêt.

Comment utilisez-vous les polices de couleur?

Une des deux pensées se produit lorsque vous voyez une police de couleur:

  • Wow, c'est hideux!
  • Cool! Je sais exactement comment utiliser ça!

Quel que soit le camp dans lequel vous vous trouvez, il existe des applications parfaitement adaptées aux polices de couleur. Mais vous devez les utiliser dans des limites raisonnables. (Les polices de couleur sont pour les utilisations les plus économes.)

Essayez une police de couleur:

  • Pour une technique qui attire l'attention pour un mot court
  • Pour une icône ou un élément de style logo
  • Pour qu'une lettrine commence un long bloc de texte
  • Pour un traitement de titre audacieux dans un style minimaliste
  • Pour mettre en évidence un mot ou des mots spécifiques dans un grand bloc de texte
  • Quand le reste de la conception est simple
  • Quand la typographie sera votre élément artistique principal
  • Lorsque le projet exige quelque chose d'amusant et d'inhabituel pour attirer l'attention de l'utilisateur
    • Comment ne pas utiliser les polices de couleur

      Il existe plus de moyens de ne pas utiliser de polices de couleur que vous ne pouvez probablement en compter. Vous ne voulez pas que la conception de sites Web revienne à la folie des couleurs clignotante, clignotante et accablante des années 1990.

      N'utilisez pas de police de couleur:

      • Avec des images ou sur des images
      • Avec des milieux occupés
      • Pour beaucoup de texte
      • Avec beaucoup d'autres techniques de conception, telles que l'animation ou le mouvement; la couleur seule suffit généralement à créer un impact visuel
      • Avec d'autres polices de caractères de nouveauté ou de spécialité

      Une tendance en évolution

      La tendance des polices de couleur commence à gagner du terrain chez certains des principaux acteurs de la typographie. Le format OpenType SVG adopté par Adobe et Mozilla pourrait être l’outil et le format permettant à cette tendance de décoller réellement. Adobe a même récemment ajouté des polices de couleur à Photoshop (vous avez peut-être remarqué des émoticônes dans la palette des caractères).

      Voici comment Adobe explique OpenType SVG:

      ? OpenType-SVG est un format de police dans lequel une ou plusieurs de ses glyphes sont représentés sous forme d’illustrations SVG (graphiques vectoriels à l’échelle) dans une police OpenType. Cela permet d'afficher plusieurs couleurs et dégradés dans un seul glyphe. En raison de ces fonctionnalités, nous faisons également référence aux polices OpenType-SVG en tant que "polices de couleur".

      Les polices OpenType-SVG permettent d’afficher du texte avec ces qualités graphiques tout en lui permettant d’être édité, indexé ou recherché. Ils peuvent également contenir des fonctionnalités OpenType permettant la substitution de glyphes ou des styles de glyphes alternatifs.

      Les polices couleur telles que Trajan Color Concept et EmojiOne Color apparaîtront comme les polices classiques des menus de polices de vos programmes - mais elles n’auront peut-être pas tout leur potentiel, car de nombreux programmes ne prennent pas encore en charge les composants couleur. Si votre logiciel ne prend pas en charge les illustrations SVG dans les polices, les glyphes retomberont dans un style noir uni. La couleur peut toujours être appliquée à ce style de secours, car elle fonctionnera comme une police OpenType typique.

      En outre, la section Type de Web comporte une section consacrée à la mise à jour de la prise en charge par le navigateur des polices de couleur afin que vous puissiez déterminer le moment opportun pour franchir le pas.

      En ce qui concerne l'évolution des polices de couleur et l'adoption de l'utilisation, deux choses vont jouer un rôle majeur:

      • Adoption et compatibilité avec les navigateurs pour les projets de conception Web (actuellement, davantage de polices de couleur sont imprimées pour des raisons de compatibilité)
      • Techniques de style globales et détermination de la tendance globale des techniques de conception plus ornées et colorées

      Essayez une police de couleur

      Si vous préférez les polices de couleur, vous pouvez télécharger une police de couleur pour commencer ou créer la vôtre, en fonction du type de projet de conception.

      Crée le tien

      Le type de police de couleur que vous créez dépend vraiment de vos compétences en logiciel. Une police de couleur peut inclure n'importe quoi, des images de vos photos préférées aux belles bulles en passant par des dégradés de couleurs. Vous pouvez le faire vous-même ou utiliser un outil pour concevoir une police de couleur personnalisée.

      • Fontself est un add-on Adobe Illustrator ou Photoshop qui vous aide à créer des polices de couleur personnalisées.
      • Vous pouvez dessiner et tout concevoir à partir de zéro avec ce tutoriel de Glyphes
      • FontLab propose un didacticiel vidéo qui explique pas à pas le processus.

      Télécharger ou intégrer

      Il existe des polices de couleurs assez chouettes qui vous crient de les utiliser dans un projet aujourd'hui. En voici quelques-unes pour démarrer votre flux de création de polices de couleurs (avec des liens vers les autres polices de couleurs utilisées ci-dessus):

      • Tapez avec fierté
      • Serviette de plage
      • Bungee
      • Polices aquarelle
      • Bixa Couleur
      • Jouets Enfants
      • OneLine Gras
      • Gourou
      • Néon

      Conclusion

      Êtes-vous prêt à vous lancer dans la tendance des polices de couleur? Est-ce trop ou le soutien inégal est-il un réel problème pour vos projets?

      Personnellement, je trouve cette tendance très amusante et très pratique dans les projets d’impression tels que les affiches ou les dépliants. Je ne suis toujours pas convaincu quand il s'agit de projets de sites Web. Le temps nous dira seulement si cette tendance devient vraiment la prochaine étape dans la conception de sites Web. ou une autre lubie éphémère.