Comprendre la typographie Web (Bootcamp de conception d'UI, semaine 2) | Rob Sutcliffe | Skillshare

Vitesse de lecture


1.0x


  • 0.5x
  • 0.75x
  • 1 x (normale)
  • 1.25x
  • 1.5x
  • 1.75x
  • 2x

Comprendre la typographie Web (Bootcamp de conception d'UI, semaine 2)

teacher avatar Rob Sutcliffe, UI Designer / Developer

Regardez ce cours et des milliers d'autres

Bénéficiez d'un accès illimité à tous les cours
Suivez des cours enseignés par des leaders de l'industrie et des professionnels
Explorez divers sujets comme l'illustration, le graphisme, la photographie et bien d'autres

Regardez ce cours et des milliers d'autres

Bénéficiez d'un accès illimité à tous les cours
Suivez des cours enseignés par des leaders de l'industrie et des professionnels
Explorez divers sujets comme l'illustration, le graphisme, la photographie et bien d'autres

Leçons de ce cours

    • 1.

      Introduction

      0:57

    • 2.

      Importance de la typographie

      3:44

    • 3.

      Polices ou polices

      3:44

    • 4.

      Typographie Web

      3:44

    • 5.

      Communication non verbale

      5:37

    • 6.

      Anatomie de type

      5:15

    • 7.

      Presse à imprimer

      6:05

    • 8.

      Serif Serif

      4:09

    • 9.

      Typeface sans Serif

      5:35

    • 10.

      Résumé

      0:51

  • --
  • Niveau débutant
  • Niveau intermédiaire
  • Niveau avancé
  • Tous niveaux

Généré par la communauté

Le niveau est déterminé par l'opinion majoritaire des apprenants qui ont évalué ce cours. La recommandation de l'enseignant est affichée jusqu'à ce qu'au moins 5 réponses d'apprenants soient collectées.

376

apprenants

5

projets

À propos de ce cours

L'aspect le plus crucial pour former une grande expérience utilisateur est d'avoir une interface utilisateur magnifiquement élaborée. Quelques petits changements à votre esthétique peuvent avoir un impact énorme ou l'expérience pour vos utilisateurs. Si
vous concevez sur une application web, vous prenez des décisions en matière de typographie, de couleurs et de composition. Ces dernières auront un effet sur l'image de marque, le style, la facilité d'utilisation et l'expérience utilisateur de votre application. Vous prenez déjà ces décisions mais êtes-vous au courant de leur impact. L'utilisation très subtile de la typographie et de la couleur peut avoir une personnalité suffisante pour que nous n'ayons besoin d'aucun autre visuel. Nous pouvons donner la vie à un bloc de texte ennuyeux et cela peut rendre notre utilisateur plus facile ou plus difficile à lire. Obtenir quelques choix simples peut faire ou casser l'application.

Semaine 2 : Histoire de la typographie
représente 95 % de ce que nous voyons sur une application web, elle dicte chaque autre décision de conception. Pourtant, peu de gens s'arrêtent vraiment pour apprendre à utiliser la typographie à leur avantage.

Cette semaine, nous apprendrons les classifications typographiques. D'où viennent différentes polices et comment parler de polices de polices.

Ce cours est pour moi ? Idéalement,
vous aurez déjà passé un certain temps à concevoir des sites Web et/ou des applications. Chaque aspect du cours est créé avec des débutants à l'esprit, mais vous pouvez trouver que vous allez plus loin si vous avez déjà créé des designs. Vous aurez également besoin de savoir comment utiliser un logiciel de conception. Je vous recommande Figma, mais Adobe XD, Invission Studio, Sketch ou certains logiciels similaires seront également compatibles.

Le cours est créé avec des designers en tête, mais il peut également être d'intérêt pour les développeurs ou les propriétaires de produits frontaux.

Rencontrez votre enseignant·e

Teacher Profile Image

Rob Sutcliffe

UI Designer / Developer

Enseignant·e
Level: Beginner

Notes attribuées au cours

Les attentes sont-elles satisfaites ?
    Dépassées !
  • 0%
  • Oui
  • 0%
  • En partie
  • 0%
  • Pas vraiment
  • 0%

Pourquoi s'inscrire à Skillshare ?

Suivez des cours Skillshare Original primés

Chaque cours comprend de courtes leçons et des travaux pratiques

Votre abonnement soutient les enseignants Skillshare

Apprenez, où que vous soyez

Suivez des cours où que vous soyez avec l'application Skillshare. Suivez-les en streaming ou téléchargez-les pour les regarder dans l'avion, dans le métro ou tout autre endroit où vous aimez apprendre.

Transcription

1. Introduction: Dans ce petit module, nous commencerons à examiner la typographie pour la conception de l'interface utilisateur de notre projet. Cette semaine, nous allons décrire et parler de quelques polices de caractères. Pour ce faire, nous devons connaître l'anatomie de la police de caractères. Nous parlerons donc de toutes les polices de caractères et de la façon d'en parler , comment les appeler. Ensuite, nous examinerons également l'historique des polices de caractères et la façon dont différentes polices ont été classées. Enfin, nous commencerons à discuter des raisons pour lesquelles vous pouvez choisir une police plutôt qu'une autre. Les polices de caractères constituent la quasi-totalité de votre conception lorsque vous créez une conception d'interface utilisateur. Il est donc très important que vous sachiez travailler avec eux. Et avant de commencer à travailler avec eux, vous devez comprendre ce qu'ils sont. Vous devez pouvoir en parler avec votre client et vous devez savoir ce que vous regardez. Commençons donc par ce fondement vital. 2. Importation de la typographie: Bien sûr, vous suivez déjà un cours en ligne de typographie Web. Je ne vais pas vous parler trop fort de l'importance de ce sujet. Vous savez déjà, c'est pourquoi vous êtes ici. Il y a de nombreuses années, Oliver, non ? Einstein a fait valoir que l'Internet est une typographie à 95%. Par conséquent, nous devons vraiment, vraiment nous assurer que nous y parvenons. Au cours des années qui ont suivi, Internet est encore très rempli de typographie, et la plupart sont plutôt mauvais. Une bonne typographie a des effets sur l'efficience et l'efficacité de notre lecture en ligne, mais elle nous affecte également sur le plan émotionnel. Maintenant, si nous voulons être de bons designers bien équilibrés, et que nous voulons créer des designs caractère unique, qui transmettent le message de la marque. Mais nous voulons également créer un site Web qui a un minimum. Ensuite, nous voulons essayer de transmettre tous les autres éléments de la topographie parce que techniquement, nous pourrions créer un site Web avec juste taper dessus, condition que nous puissions utiliser la typographie suffisamment bien pour transmettre ce message de marque, pour avoir du caractère, être unique et toujours lisible. peut-être tout ce dont nous avons besoin. Nous n'avons pas besoin d'en faire trop avec d'autres éléments du design. Je trouve infiniment fascinant la façon dont les gens vont essayer deviner ce que c'est à propos de Steve Jobs qui lui a fait créer un logiciel aussi réussi. Les gens diront, eh bien, Apple fabrique des produits plus faciles à utiliser. Quelque chose dans lequel je ne vois personnellement aucune preuve. Les gens disent que les produits Apple se sentent familiers et à l' aise pour nous. Ils nous parlent d'une manière que nous comprenons pourquoi cela peut être vrai. Nous devons ensuite deviner à nouveau, deviner, ou comment Apple a-t-il fait cela ? Comment Steve Jobs a-t-il fait cela ? Et peut-être que c'était le choix du type ou les couleurs ou quelque chose à voir avec les mises en page des pages. Ensuite, nous devons deviner encore une fois, quelles compétences Steve Jobs a-t-il développées pour être aussi bon dans ce domaine ? Eh bien, si nous voulions imiter le succès de Steve Jobs, plutôt que de prendre trois suppositions consécutives pour décider quelles compétences nous devrions apprendre. On pourrait juste regarder son CV ou son CV. Et nous apprendrions qu'il a étudié calligraphie, qu'il a étudié les polices de caractères. C'est la compétence qu'il a développée pour être si bon. Peut-être que l'étude de la topographie nous permet de mieux voir les détails importants que les autres personnes manquent. Peut-être que cela nous permet de mieux comprendre comment mettre en page les conceptions dans leur ensemble. Cela nous donne peut-être quelques informations techniques. C'est vraiment de la spéculation. Si nous voulions essayer d'imiter le fondateur de la société technologique la plus prospère de notre époque. Nous voudrions peut-être au moins en apprendre un peu plus sur la typographie. Cela peut parfois ressembler à un petit détail insignifiant, qu'une police de caractères fonctionne avec une autre, ou si c'est exactement la bonne taille. Mais ces petits détails s'additionnent. Et la typographie est la plupart de ce que nous regardons sur un site Web ou une application Web, ces petits détails insignifiants et ennuyeux s'additionnent et nous mettent mal à l'aise et ils ne nous rendent pas J'aime l'utiliser et faire en sorte que le produit ressemble à un travail acharné. typographie est la brique et le mortier le plus basique d'un site Web. Et cela représente environ 95 % de tous les sites Web et applications. Si vous n'êtes pas sûr de l'importance de l' étude de la topographie, il convient peut-être de rappeler que le PDG de la société technologique la plus prospère de notre époque a étudié la typographie. 3. Face ou polices: À quelques étapes de ce cours, je vais vous donner une terminologie, de nouveaux mots. Un glossaire si vous le souhaitez. C'est l'une de ces vidéos. Nous allons définir ce qu'est une police de caractères, quelle est la topographie, ce qu'est une police et ce qu'est un glyphe. Désormais, une police de caractères est l'œuvre d'art globale. Si vous parlez de Verdana, Times New Roman, vous parlez d'une police de caractères. Une police, par contre, est un logiciel que vous installez sur votre ordinateur afin que vous puissiez utiliser la police de caractères si vous souhaitez, par exemple, utiliser une police de caractères dans certains logiciels de conception de votre ordinateur, vous allez sur un site Web qui vend la police de caractères et vous achèteriez divers fichiers de polices sur les sites Web de Matt. Ces fichiers de polices comprendraient une version en gras d' une police de caractères et une version italique de la police. Et chacun sera disponible dans un format de fichier tel qu'un point T, T F ou un ETF à point, ou un point w OFF. Ce fichier est appelé police. se souvenir de la différence entre n'est pas trop important de se souvenir de la différence entre ces deux termes car même si vous travaillez dans un studio de design, vous allez souvent appeler la police de caractères et peut-être utiliser ces deux mots. de manière interchangeable. Mais pour le reste de ce cours, je vais faire référence à la police de caractères en utilisant le terme correct. La police est l'illustration, la police est le fichier. Similaire à la façon dont une chanson est un morceau de musique et qu'un MP3 est un fichier. Quelqu'un peut écouter un morceau de musique et dire que j'aime vraiment que ce MP3 ne soit pas complètement inexact, mais il y a probablement une meilleure façon d'exprimer cela. Vous direz que j'aime vraiment cette chanson. La topographie est peut-être deux choses. Il s'agit de sélectionner la police de caractères. Et c'est aussi la façon dont nous utilisons la police de caractères, les différentes tailles, hauteurs de lignes, longueurs de ligne, mais aussi comment et quand nous utilisons la version audacieuse de la police, typographie est la décision que nous lorsque nous utilisons la police de caractères dans un avenir pas trop lointain, vous allez travailler sur un système typographique. Il s'agit de la topographie. Vous allez sélectionner la police de caractères que vous utilisez, mais vous allez également prendre des décisions quant à la façon dont elle sera utilisée. Pendant que vous prenez ces décisions. Vous êtes concepteur de type ou graphiste ou typographe. Et la dernière nouvelle pièce de vocabulaire que je veux vous donner est le mot glyphe. Un glyphe est le symbole individuel d'un fichier de polices. Vous voudrez peut-être parler de cette lettre, mais ce n'est pas tout à fait exact car certains sont des nombres et certains sont des points de grammaire, et certains d'entre eux ne sont aucun de ces éléments. glyphe est un terme que nous utilisons pour tous les expliquer. Un glyphe est le symbole individuel la police de caractères du fichier de polices. Qu'il s'agisse d'une lettre, d'un chiffre, d'un symbole grammaire ou de toute autre chose. Une police de caractères est l'œuvre d'art. Verdana est une police de caractères. Font est le fichier que vous installez sur votre ordinateur ou votre site Web afin que vous puissiez accéder à cette police de caractères. typographie est l'art de choisir une police de caractères et de choisir comment elle est utilisée. Et un glyphe est le symbole individuel d'un fichier de polices. 4. Typographie Web: Jusqu'à tout récemment, la typographie Web et topographie imprimée ont été traitées exactement de la même manière. Il y a eu un ensemble de livres, un ensemble de tutoriels. Tout le monde a appris un type de typographie, mais la typographie Web est très différente du type d'impression. Il existe certaines restrictions à la typographie Web. Plus précisément, chaque police que vous utilisez va ralentir le chargement de votre page Web. Vous êtes limité à utiliser uniquement polices pour lesquelles vous disposez de licences Web, ce qui peut être plus coûteux. Il y a des choses qui sont simplement différentes avec la typographie Web, nous devons réfléchir au moteur de rendu des navigateurs et à son apparence l'écran plutôt que de penser à l'imprimante ou l' encre que nous utilisons. Et il y a des choses qui sont mieux avec la typographie sur le Web, les gens ont une option sur quel type d'écran ils vont la lire. Ils peuvent réellement contrôler la taille du type. Parfois, certaines règles sont simplement différentes. Par exemple, des textes surdimensionnés comme vous pouvez le voir dans un magazine double page. Cela ne fonctionnera pas sur un écran de téléphone portable. Les règles qui régissent la différence entre ce travailleur lorsque le texte est rendu sur l'ordinateur de l'utilisateur, nous ne savons pas si quelque chose va mal tourner. Nous devons donc programmer en cas de repli et réfléchir à ce qui se passe lorsqu' un fichier ne se charge pas. Par exemple, un utilisateur peut disposer d'une connexion Internet incroyablement rapide. Je vais avoir une connexion Internet incroyablement lente dans le monde de l'impression. Ce serait comme s' ils l'imprimaient sur des qualités de papier complètement différentes. Et bien sûr, il y a le problème que chaque utilisateur peut potentiellement utiliser un navigateur différent. C'est un gros problème pour la typographie car les navigateurs qui, bien qu'ils se mettent à jour assez régulièrement et qu'ils restent à jour avec beaucoup de rôles. Parfois, avec quelque chose comme une topographie qui peut souvent oublier des choses et les laisser derrière elles. Et parfois, les navigateurs peuvent être très, très lents à adapter de nouvelles conventions. Ou le navigateur ne rend pas toujours bien notre type ou la façon dont les règles le disent, il devrait le rendre. Nous ne pouvons pas faire confiance à un ordinateur de la même manière que nous pouvons faire confiance à nos imprimantes sur notre papier. Et probablement la différence la plus importante et la plus importante entre topographie imprimée et la typographie Web est le moment où quelqu'un prend les décisions typographiques pour un dessin imprimé, on leur donne souvent le texte exact , puis c'est à eux coiffer et de déterminer comment il s'insère sur la page en ligne. Ce n'est pas possible. Les journaux peuvent imprimer plusieurs articles par jour. Normalement, le concepteur, le typographe, travaille sur le système avant la rédaction de l'article. En tant que typographe. Pour la typographie Web, il vous appartient de créer un système typographique plutôt que de prendre du contenu existant et de le mettre Vous devez créer un système qui s'applique à scénarios légèrement différents pour assurez-vous que le texte est toujours bon. Est-ce que ça a l'air bien lorsque le titre est long de dix mots et qu'il est long d' un mot, par exemple. Bien que les bases absolues de ce qui rend la topographie lisible et ce qui la rend belle soient les mêmes sur l' impression et sur le Web. Il y a beaucoup de choses très différentes. Nous voulons apprendre la typographie Web en tant que discipline complètement distincte. L'une des principales différences réside dans le fait que la topographie du Web est normalement conçue avant que nous ayons le contenu plutôt qu'après. 5. Communication non verbale: Si vous avez déjà suivi formation commerciale ou une formation orale publique de quelque nature que ce soit, vous avez probablement entendu le commentaire. 93 % de la communication est non verbale, bien que ce n'est pas exactement faux, c'est une simplification excessive. Il est basé sur une série d' expériences menées par un certain Albert Mehrabian à l'UCLA en 1972. Mehrabian a classé le pire en fonction de la façon dont ils sonnaient négatifs ou positifs. Par exemple, le mot plaisir est probablement un mot plutôt positif, alors que le mot tragédie est plutôt négatif. Mehrabian combine ensuite les mots avec expressions faciales positives ou négatives pour voir comment les gens se sentaient. S'ils, par exemple, j'ai entendu le mot tragédie, mais quand quelqu'un avait une expression faciale assez positive, Mehrabian a également essayé cela en variant le ton de la voix. Par exemple, quelqu'un peut dire un mot assez positif comme le plaisir, mais avec un ton négatif. suite, Mehrabian a examiné les données et a conclu que 55 % de nos communications sont basées sur des informations visuelles, 38 % sur le ton de la voix et 7 % sur le mot affiché. La raison pour laquelle ce commentaire, 93% de la communication est non verbale est peut-être une simplification excessive, c'est parce qu'il ne faisait que tester combien d'émotion a été communiquée et pas vraiment d'information du tout . Il était aussi en train de tester dans quelque chose qui n'est pas vraiment un scénario du monde réel. Et bien sûr, un seul mot sorti de son contexte n'a généralement pas beaucoup n'a généralement pas beaucoup de sens à lui seul. Si nous faisons entièrement confiance aux expériences Mehrabiennes, nous pourrions conclure que lorsque vous prononcez un seul mot, la façon dont vous dites cela pourrait être plus important que le mot que vous dites. Mais si vous deviez dire une phrase entière, ou même un paragraphe entier, il est probablement plus important de choisir les mots que vous choisissez. Maintenant, si nous revenons à regarder nos sites Web, il est probablement tout à fait injuste de dire nos choix typographiques sont plus importants que les mots choisis. Mais malgré ce commentaire, 93 % de la communication n'est pas verbale est une simplification massive et massive. Il est important pour nous de rappeler qu'une grande quantité de communication, moins non verbale, et qu'une grande partie de cette communication non verbale est émotionnelle. La façon dont les gens pensent l'entreprise et de l' application qu'ils utilisent est largement communiquée par les choix typographiques plutôt que par les mots utilisés. Si nous voulons qu'un lecteur fasse confiance à notre entreprise et ressent un lien émotionnel, il est essentiel que nous fassions de bons choix typographiques. D'autres recherches ont révélé des résultats similaires en examinant la mémoire. Essentiellement, les gens se souviennent mieux des visuels qu'ils ne se souviennent des mots réels. Si nous voulons que les gens se souviennent de ce que nous avons écrit, encore une fois, le type de graphique que les choix seront vraiment importants. Certains artistes, en particulier des artistes abstraits comme Jackson Pollock, par exemple, estiment que les mots sont une représentation inefficace de la faute. Qu'il s'agit d'une forme de communication faible parce que vous devez compter sur la signification d'une quantité limitée de symboles, de mots, d'art abstrait pour tenter communiquer de manière plus authentique à un niveau plus profond. Parce que dès que nous utilisons des mots, ils sont mal interprétés et ils sont mal représentés. Et nous leur faisons donc un peu moins confiance à quelque chose comme la topographie en puisant dans la puissance de cette communication inconsciente ou subconsciente. Il y a quelque chose d'incroyablement audacieux et confiant une marque qui choisit une topographie avec beaucoup de caractère. Parce que, aussi durement qu'ils essaient, ils mettent inconsciemment des parties de leur personnalité dans cette décision. Et cette petite partie de leur personnalité ne peut pas être un mensonge. Alors que les mots qu'ils choisissent d' écrire peuvent facilement être alliés. Pour cette raison, je crois fermement à la théorie selon laquelle il y a plus de vérité dans la fiction que dans la non-fiction. Si quelqu'un écrit une autobiographie, essayez naturellement de vous persuader de quelque chose dans sa vie. Mais quand quelqu'un écrit de la fiction, il verse par inadvertance sa vraie personnalité dans le livre. Je pense que nous pouvons en apprendre beaucoup plus sur la race humaine en lisant de la fiction qu' en lisant des livres sur l'anthropologie. De même, je pense que l'on peut apprendre autant d'une marque par ses choix typographiques que par les mots qu'elle choisit d'y écrire. Il serait absurde de notre part de suggérer que 93 % de la communication est non verbale ou même de suggérer la topographie est plus importante que les mots choisis, à moins que nous ayons une application avec un seul mot sur l'application. Cependant, la communication non verbale, des choses comme la topographie ou la communication à un niveau très différent. Ils communiquent sur le plan émotionnel. Et c'est très important pour notre application. Si ce n'est pour aucune autre raison, parce que nous faisons confiance aux messages communiqués sur le plan émotionnel. 6. Anatomie de type: Améliorer notre vocabulaire sur les polices de caractères. Non seulement cela nous permettra de mieux travailler avec la police de caractères, mais cela nous permettra également de mieux communiquer avec notre équipe ou de communiquer avec nos clients. pourquoi il est important que nous prenions le temps d' apprendre tous les noms de l' anatomie de la typographie. La première chose dont il faut parler est la façon dont nous définissons la hauteur. Il y a la hauteur globale des glyphes dans la police de caractères, mais il y a aussi la hauteur du capuchon, et c'est la hauteur des majuscules. Ensuite, nous avons la hauteur X. Il s'agit de la hauteur d'une lettre minuscule. Ce n'est pas nécessairement la hauteur exacte d'un x minuscule, car parfois des x stylisés différents peuvent ne pas être exactement les mêmes que la hauteur X. Il vaut mieux penser que la hauteur X est la hauteur des lettres minuscules. Et lorsque nous parlons la hauteur des lettres minuscules, cela ne comprend pas les ascendants et les descendants. Ce sont les bits que vous pouvez considérer comme allant au-dessous ou au-dessus de la ligne. Un H minuscule, par exemple, possède un ascender qui reste au-dessus de la hauteur X de la lettre minuscule. Et un g minuscule a un descendant qui descend en dessous de la lettre minuscule. Nous faisons référence à la ligne qui compose la lettre a été le trait. Nous pourrions donc parler de la largeur du trait, la largeur de la ligne. La ligne verticale principale, comme sur un T majuscule, est appelée tige. Toutes les lignes horizontales telles que celles situées au milieu d'un A majuscule sont appelées barre transversale. Toutes les lettres où le trait principal est incurvé, sont parfois appelées colonne vertébrale, comme par exemple, le S majuscule a une colonne vertébrale. Les zones arrondies comme sur un O ou un A sont appelées le bol. La zone fermée à l'intérieur de la cuvette est appelée comptoir. Et si cette zone est ouverte comme un E ou un C, nous l'appelons un compteur ouvert. Parfois, je police a ces petits pieds, ces chapeaux, on les appelle des sérifs. Et s'il n'a pas de serif, on parle de la fin de la lettre comme un terminal. Chaque fois que les sérifs sortent en augmentant légèrement la largeur de la lettre, nous appelons cela un dépassement. Et toutes les lignes diagonales, si nous avons une ligne diagonale qui s'accroche à la lettre, nous l'appelons un bras, et une ligne qui s'abaisse d'une lettre, nous appelons cela un décalage. Comme un M et un N ou un H, avons ce que nous appelons une épaule, une partie supérieure droite arrondie de la lettre. Et une lettre comme une file d'attente a une queue qui sort. Parfois, la police de caractères peut ajouter quelques petites lignes décoratives qui ne sont pas nécessaires pour identifier la lettre. On pourrait appeler ça un coup de fouet. Avoir ces nouveaux termes et notre vocabulaire pour parler de nos polices de caractères. Il sera beaucoup plus facile pour nous de prendre des décisions et d'avoir des conversations. Par exemple, on pourrait dire que Helvetica, ayant une grande hauteur X peut le rendre lisible à une petite taille. Mais cela réduit les hauteurs de l'ascender sur un h minuscule sorte que les minuscules h et n minuscules ressemblent beaucoup plus. On pourrait dire que même si Futura utilise des formes géométriques très simples qui pourraient faire un O, un E, un A, un C et un à un semblable. Il convient également de noter que la SEA dispose d'un très grand compteur, ce qui le rend nettement différent de ces autres lettres. Une police sans serif n'a pas de sérifs et n' a donc pas de dépassements. Nous pouvons avoir une version plus condensée, ce qui la rendra beaucoup plus appropriée à l'intérieur des boutons ou dans les menus. Il y a trois exemples de conversations que vous pouvez maintenant avoir, que ce soit dans votre tête avec vos clients ou avec vos coéquipiers sujet de polices de caractères que vous auriez probablement pu avoir il y a cinq minutes. Jetez un coup d'œil à quelques polices de caractères autour de vous et identifiez les différentes anatomies identifiez les différentes anatomies de chaque lettre de la police. Et voyez quels sont les avantages et les inconvénients d' avoir ces caractéristiques pour chaque police de caractères. Apprendre à communiquer sur l'anatomie des polices de caractères vous permettra de prendre des décisions beaucoup plus facilement, surtout avec une équipe. Passez du temps à vous familiariser avec ces mots. Chaque petit détail d' une lettre porte un nom unique. Souvent, les personnes qui ont conçu des polices de caractères utilisent beaucoup ces noms. En tant que typographe ou concepteur Web, vous n'avez probablement pas eu à les utiliser trop, mais cela vaut la peine de passer un peu de temps à les apprendre. En fait, dans l'ensemble, nous nous intéressons probablement davantage aux qualités de la police de caractères, à la forme générale , à leur largeur l'épaisseur du trait, au contraste et à l' épaisseur du trait, qu'il ait des sérifs ou non. Mais à un moment donné, vous allez utiliser tous ces mots. Alors assurez-vous de les connaître. 7. Presse d'impression: Au XVe siècle, un Allemand nommé Johannes Gutenberg a créé type mobile ou l'imprimerie ou alors l'histoire européenne se passe du moins. La presse à imprimer a bien sûr été inventée beaucoup plus tôt en Chine. Le problème en Chine, c'est qu' beaucoup trop de personnages pour que cela soit utile. Rendre coûteux la création d'une presse à imprimer, mais aussi prendre beaucoup de temps pour arranger toutes les lettres. Et plus important encore, il est beaucoup plus difficile de réduire la taille des lettres. En Europe, à l'époque de Gutenberg, la plupart des livres ressemblaient à ceci, un style de texte que nous appelons la lettre noire aujourd'hui. Et vous verriez très rarement que quelqu'un utilise cela, à part l'Allemagne nazie, part l'Allemagne nazie, qui l'utilisait comme une sorte de rejet de quoi que ce soit de nouveau ou moderne parce qu'ils étaient contre les idées mondialisées. Et parfois des studios de tatouage. Peut-être parce que la lettre noire est assez décorative ou que vous avez un dos entier et que vous voulez juste y mettre six lettres. Mais lorsque vous essayez d' imprimer une page entière d'un livre, ce n'est en fait pas un type particulièrement utile. Il est un peu trop décoratif pour en faire deux petites, mais il a aussi ces lignes noires très épaisses et dures qui signifient que lorsque vous les rendez plus petits et que vous entrecoupez plus de lettres ensemble, vous créez une zone très dense de contraste sur la page qui n'est pas invitant à un lecteur ou facile à lire. La presse à imprimer n' aurait probablement pas été très utile sans Nicholas Jensen. Et Nicholas Jensen n' aurait pas été très utile sans le style de calligraphie minuscule humaniste de Vérone au XVe siècle, dans l' Italie de la Renaissance, ils faisaient référence à lettre noire des derniers jours. Moderna. Mon latin n'est pas parfait, mais cela signifie des lettres modernes. Et ils sont appelés ce que les Romains utilisaient comme savoirs traditionnels et les derniers jours. Les Romains viennent d'avoir les lettres majuscules. Ils ont donc beaucoup expérimenté pour décider à quoi ressemblent les lettres minuscules et, par conséquent, ils ont créé quelque chose qui semblait beaucoup plus moderne que la lettre noire. Jensen passe un certain temps à observer et expérimenter ces nouvelles lettres de la Renaissance et certaines des décisions qu' il a prises à l'époque au XVe siècle de stock jusqu' à aujourd'hui sur la façon dont décidons de l'apparence d'une fin ou d'un D. Jensen a créé une police de caractères qui peut être découpée beaucoup plus petite que le type de lettre noire, et donc beaucoup plus économique pour contenir beaucoup plus de lettres sur une page et donc plus d'informations. Il peut être diffusé à travers l'Europe beaucoup plus économique et plus efficace. Vous pouvez toujours utiliser une forme de police de caractères de Jensen aujourd'hui. Vous pouvez, par exemple, par Adobe Jensen, cette police de caractères ici. Si c'est le cas, vous vous demandez peut-être pourquoi est-ce que je paie pour quelque chose qui a environ 500 ans et qui est hors de droit d'auteur ? En fait, l'effort qu' Adobe a fait pour recréer cette police de caractères est bien plus que ce que vous penseriez. Vous voyez que si vous prenez un vieux livre imprimé écrit en Jensen, chaque E n'est pas le même. Il y a de minuscules divergences dans les différentes coupes de la lettre. Pour qu'Adobe puisse créer une seule lettre, il doit numériser des centaines de Jensen 0, puis déterminer à peu près la moyenne. Il y a plusieurs raisons pour lesquelles chaque E sur la page n'était pas identique alors qu'il ne s'agissait pas nécessairement de coupes exactement les mêmes. Et l'une de ces raisons est en fait que les gens étaient tellement habitués à lire des pages manuscrites que la monotonie partagée de voir une page de symboles identiques uniformes permettrait d'endormir le cerveau des gens. Ils ne pouvaient pas interagir ou interagir avec ce matériel. Moins l'empreinte de chaque mot sur la page est nouvelle, moins l' empreinte et le cerveau sont nouveaux, moins nous avons de chances de s'en souvenir et d'interagir avec le matériel. Cela nous permet également que différentes tailles aient été prises légèrement différemment parce que si la façon dont cette perception fonctionne, nous ne voyons pas un grand E et un petit E de la même police a été identique. Ils apparaissent légèrement différemment lorsqu' ils sont plus petits. Quelque chose que nous appelons l'attente optique. De façon réaliste, si vous vouliez recréer aujourd'hui une police de caractères comme Jensen, vous devrez recréer plusieurs fichiers de polices, un pour des textes de 16 pixels de hauteur, puis un fichier de polices entièrement séparé. pour les textes d'une hauteur de 20 pixels. Par exemple, avec une coupe légèrement différente, un poids optique légèrement différent. Parce qu'une police de caractères affichant 20 pixels ne ressemble pas à 20 pixels ne ressemble pas une version légèrement plus grande d' une police affichée à 16 pixels. Ce n'est pas comme ça que la perception fonctionne. Nous en parlerons plus tard, mais c'est la police Jensen, et c'est ce que nous appelons maintenant un empattement à l'ancienne. Vous n'utiliseriez probablement pas Jensen parce que cela a trop d' implications de l'époque, à moins que vous ne vouliez créer un design qui semble avoir un échec du XVe siècle. Vous choisiriez probablement quelque chose de plus comme Garamond si vous vouliez une police à serif à l'ancienne. L'invention de la presse à imprimer a posé un tout nouveau défi. Comment réduire la taille des lettres tout en les rendant lisibles tout en les rendant confortables et agréables à lire. Heureusement, cela a déjà été résolu par calligraphes en Italie à peu près à la même époque. Ainsi, des polices comme Jensen ou Garamond ont été créées, très confortables et faciles à lire. Même une plus petite hauteur de 16 pixels sur notre page, le panneau de presse d'impression. D'autres défis, y compris à quel point il semblait monotone de voir une page de symboles identiques, et aussi en quoi l'attente optique est différente pour les caractères plus grands et plus petits. Ce sont des problèmes que nous avons résolus à l'époque et que nous avons depuis oublié. En fait, beaucoup disent que les typographes ou les 200 dernières années sont devenus paresseux. 8. Serif: Nous pouvons classer les polices de caractères à empattement en quelques catégories. Tout d'abord, nous avons pour un empattement à l'ancienne comme Jensen ou Garamond, dont nous venons de parler. Par la suite, nous avons des séries transitoires comme Baskerville dont nous parlerons sous peu. Et puis nous avons des séries modernes comme Bodoni et Diderot. Plus la police de caractères est moderne, plus le contraste entre les largeurs de trait est élevé, plus le style ancien ou traditionnel est humaniste, plus la largeur de ligne semble se fondre l'une dans l' autre comme si elle était dessinée à la main avec un stylo. Examinons tout d'abord ces polices de caractères transitoires comme Baskerville. Maintenant, John Baskerville vivait à Birmingham, en Angleterre, et vers la fin de sa vie, il a décidé d'investir tout son argent pour essayer d'améliorer les processus d'impression. Il a donc essayé d'améliorer l'encre et le papier pour essayer d'obtenir un regard cohérent sur la page. Et en fait, en améliorant le papier d'impression et l'encre comme presque comme une vitrine, il a créé cette police de caractères, Baskerville, qui pourrait avoir des lignes très fines et lignes assez épaisses sur le même papier et regarder C'est plutôt bien. Il n'a peut-être pas été possible d' imprimer avec Baskerville tant que la qualité de l'encre et du papier ne s'est pas suffisamment améliorée pour que cela ait l'air net et net sur la page, les gens détestaient la police de caractères des ballons de basket au gens ont dit qu'il était assez difficile de voir ces lignes très minces. Ils ont dit que ça leur faisait même mal aux yeux. Il est probable que beaucoup de presses à imprimer étaient probablement jalouses. Et avouons-le, ses livres coûtent juste plus cher parce qu'ils ont été imprimés avec encre et du papier de meilleure qualité. Le basket-ball est un symptôme de police métallique qui disparaît principalement, mais il est apparu en France peu temps avant la Révolution française quand il a été utilisé pour le matériel pour certaines idées révolutionnaires imprimées, le fait qu'il soit différent, frais et moderne l' a rendu parfait pour exprimer ces idées révolutionnaires. Et peu de temps après un autre designer français l'a créée, est-ce cette police qui est presque synonyme la Révolution française et d'idées beaucoup plus modernistes, très semblables à celles d'un italien police appelée Bodoni. Est-ce que les Bodoni sont tous les deux aussi populaires. Lorsque nous pensons aux polices de caractères à empattement modernes, si nous mettons les trois à côté de l'autre, nous pouvons voir comment les trois étapes des polices à serif deviennent progressivement moins humanistes et plus contrastées à mesure que les gens obtiennent habitué à regarder des choses qui ne sont pas écrites à la main et à s'habituer à identifier les différents contrastes regardant un petit type sur une page, j'ai récemment entendu quelqu'un faire référence à la différence style a été comme la différence de style de la Renaissance, du rocher et des erreurs d'illumination. Il y a une dernière étape de la typographie à empattement, à savoir le serif égyptien, parfois appelé empattement de dalle, comme Rockwell par exemple. Cela est devenu populaire à un moment donné à l'ère victorienne lorsque nous voulions que nos affiches aient de belles grosses rubriques percutantes. Et il avait l'air très audacieux et confiant en haut de notre affiche. Au XXIe siècle, nouvelles polices de caractères s' intègrent très rarement dans une seule catégorisation. Par exemple, la police de caractères que j'ai utilisée pour les titres tout au long de ce cours, sur quelques autres cours, est celle qui est un empattement de coin. Il ne rentre dans aucune de ces autres catégories qui ont ces gros sérifs triangulaires, ce qui, je pense, le rend ultra moderne. Traditionnellement, nous adaptons les polices serif en trois catégories : style ancien, transitionnel et moderne. Vous pouvez les considérer comme étant comme Garamond, Baskerville et Bodoni, chaque génération légèrement moins humaniste et ayant un contraste légèrement plus épais avec Serif de l'une de ces trois périodes de l'histoire. Il lui confère un caractère distinct de cette époque. Aujourd'hui, il existe toutes sortes de nouveaux types de sérifs comme Slab Serif et Wedge Serif, mais ne s'intègrent confortablement dans aucune de ces catégories. 9. Sans caractère.: Au début du XXe siècle, les artistes avant-gardistes voulaient rejeter tout ce qui s'était passé avant et créer de nouveaux designs plus simples pour tout. Les puristes ne voulaient rien sur une forme de lettre qui distrait le symbole pur le plus basique en dessous. Naturellement, les concepteurs ont commencé à enlever les sérifs. Nous savons maintenant que ces petites séries nous aident probablement à reconnaître une lettre d'une autre. Mais ils sont aussi globalement la page de maquillage un peu plus désordonnée, un peu plus complexe. Et en 1927, Paul Renner a créé Futura. Cette police de caractères entièrement composée de formes géométriques nous a permis de percevoir incroyablement rapidement , faire pénétrer dans notre cerveau. Et si rien d'autre, il correspond parfaitement au style de l'époque. Sans le fait qu'il ait vécu en Allemagne peu après en 1927, les nazis ont pris le contrôle de l'Allemagne. Et comme nous en avons parlé plus tôt, ils adoraient la lettre noire, ils aimaient l'ancienne. Ils ne voulaient rien de nouveau ou de moderne. Futura est devenu populaire ou dans le reste du monde et est devenu une police de caractères internationale après la Seconde Guerre mondiale, Helvetica a été créée en Suisse ou dans le reste du monde et est devenu une police de caractères internationale après la Seconde Guerre mondiale, Helvetica a été créée en Suisse. police de caractères la plus populaire et la plus utilisée au monde. Il a fière allure, aussi grand que vous le souhaitez, et il peut être lu assez petit. C'est très minimaliste, mais il a encore un peu de caractère. Et c'est exactement ce qui a motivé Eric Gill à créer Gill Sans. Maintenant, cela présente tous les avantages d'une police sans empattement, mais elle a une légère sensation humaniste. Ces polices sans empattement ont été des succès massifs dans le monde qui ont émergé après la Seconde Guerre mondiale. Un monde avide de changement et qui voulait accepter la mondialisation du monde. Ensuite, nous avons inventé des ordinateurs, des ordinateurs à très basse résolution pour des écrans pixélisés. Et donc naturellement, les sans serifs sont devenus encore plus populaires parce qu'ils étaient faciles à rendre sur ces moniteurs de mauvaise qualité. polices de caractères comme Vedanta ont été créées pour être une sorte d'Helvetica pour l'ordinateur où chaque pixel a été pris en compte pour s' assurer qu'il était bien rendu sur un écran d' ordinateur pixélisé. Plus tard, Arial a également été créé pour la même raison, après des décennies à regarder des écrans avec des textes tous écrits en Verdana et maintenant un peu daté. Si vous avez vu un site Web aujourd'hui et tous les textes ont été écrits en Verdana, vous pourriez penser que vous n'avez que 30 ans de temps, l'époque où une police de caractères est plus moderne simplement parce qu'elle est sans Serif est parti depuis longtemps. En fait, ils peuvent avoir l' air un peu datés parce que tout ce qui est rendu sur un écran et sans empattement, cela ressemble à ce que vous regardiez dans les années 1990. Tout comme les différentes polices serif nous rappellent les périodes dans l'histoire. La plupart des polices sans serif nous ont également rappelé ce qui est aujourd'hui une période historique. Et bien sûr, de nouvelles classifications et nouvelles polices de caractères sont créées tout le temps. La police de caractères Gotham a été créée vers l' an 2000 et les États-Unis ont été rendus populaires en raison de la campagne politique d'Obama. Utiliser une toute nouvelle police de caractères de pointe, c'est tout autant faire une déclaration politique que l'utilisation d'une ancienne police. L'Allemagne nazie utilisant une lettre noire à l' ancienne faisait une déclaration politique au sujet valeurs traditionnelles et de ce qu' elle croyait important, tout autant que la Révolution française utilisant Baskerville puis déduisez, nous faisons une déclaration sur la façon dont ils étaient avant-gardistes et comment ils voulaient faire partie d'un nouveau monde. Gotham correspond parfaitement à la campagne politique de Barack Obama. Barack Obama essayait d'être vu comme quelque chose de nouveau et de différent. Il ne semblait pas être un nouveau choix parce qu'il utilisait un san-empattement. Il semblait être un nouveau choix parce qu'il utilisait Gotham. Ses affiches n'auraient pas eu ce genre d'impacts si elles étaient écrites en Helvetica ou Gill Sans. La pertinence des classifications de polices de caractères est beaucoup moins importante avec les nouvelles polices de caractères. En fait, les concepteurs de typographie se divisent souvent entre différentes classifications ou en créent de nouvelles. n'y a pas de classification qui correspond à nos temps modernes. Tout comme la mode dans d'autres industries a accéléré incroyablement la mode dans les polices de caractères. Les concepteurs ont commencé à créer des polices sans empattement au début du XXe siècle. Et ils sont devenus très populaires après la Seconde Guerre mondiale, alors que les gens attendaient avec impatience un nouveau monde international mondialisé, les polices sans empattement ne sont pas forcément devenues plus populaires car ils étaient plus faciles à lire. Nous pourrions probablement dire qu'il est plus facile de les percevoir, de les assimiler dans notre cerveau, mais probablement un peu difficile les différencier ou de reconnaître les lettres. Mais ils sont également devenus plus populaires parce qu'ils étaient plus faciles à rendre sur des écrans d'ordinateur de mauvaise qualité. Aujourd'hui, cela fait probablement paraître certaines polices sans empattement aussi datées que Garamond Vedanta, c'est maintenant un morceau d'histoire car nouvelles polices sont conçues et créées, elles transcendent souvent les genres ou classifications. 10. Résumé: typographie est la voix de notre application de marque ou d'un service. Certaines voix sont plus claires, mais la voix la plus claire n'est peut-être pas la plus engageante ou la plus mémorable. Avez-vous besoin d'une voix avec plus de caractère ? Et si oui, quel personnage ? Chaque police de caractères, comme chaque voix, a une personnalité. Quelle que soit la police que nous choisissons, elle exprimera quelque chose dont nous avons besoin pour assurer qu'elle exprime la bonne chose. Une police de caractères parle d' une époque et d'un lieu. Nous devons choisir le bon. Et à mesure que nous évoluons davantage vers un système typographique complet, il se peut que nous ayons besoin d'utiliser plusieurs polices de caractères et de bien fonctionner et de se complimenter mutuellement.