La culture de la typographie sur le Web

Les concepteurs sur le Web ont connu une période délicate avec la typographie. D'une part, la plupart des concepteurs Web ne sont pas formés comme des "typographes" comme le sont la plupart des concepteurs graphiques traditionnels. Une autre raison est que la typographie sur le Web n’est pas utilisée depuis plus de 15 ans environ? et la plupart d'entre nous n'ont pas été la conception même pour la moitié de ce temps.

Photo miniature de Stephen Coles de Typographica.org. La police est FF Unit.

En tant que tel, le nouveau média le plus puissant de l'histoire du monde manque cruellement de formation formelle pour la discipline la plus importante qu'un concepteur puisse maîtriser: la typographie. Cet article est le premier d'une série qui cherche à compiler un condensé de leçons sérieuses de typographie Web..

Avant de commencer, cet article d'introduction est à la fois éducatif et éditorial. Il s'agit d'un article improvisé sur certains des principes que les concepteurs Web doivent prendre au sérieux. Je ferai de mon mieux pour éviter d'en faire un article de type "10 façons évidentes d'améliorer votre typographie"? nous en avons déjà assez sur le Web, et si jamais nous décidons d'en utiliser un, nous veillerons à le faire correctement. Cette série portera davantage sur la création de processus logiques raisonnés pour développer des systèmes de types efficaces que sur quelques astuces aléatoires. Premièrement, nous allons faire face à certains des obstacles culturels auxquels sont confrontés les concepteurs Web.


Notre dilemme: un manque d'histoire

Regardons les choses en face, comparé aux vastes quantités de livres et d’années de ressources pour les concepteurs d’imprimés, le Web a une expérience relativement courte de la typographie. Nous ressemblons beaucoup à des adolescents avec leur tout nouveau permis de conduire: beaucoup de pouvoir et de responsabilité sans trop d'expérience. Parce que le Web est si jeune, les concepteurs n’ont plus que deux choix: 1) essayer de recréer une esthétique imprimée sur l’écran ou 2) errer dans le grand vide noir? espérant découvrir la perfection du type Web.

Le problème avec le premier choix est que l’impression ne se traduit pas directement sur le Web. Le problème avec la seconde est que c'est un peu comme lancer des fléchettes? bien sûr, nous aurons quelques succès, mais ce sera au prix de tout un tas de flops.

Existe-t-il déjà des ressources étonnantes sur le sujet? Oui absolument? et je les énumérerai à la fin de cet article. Mais le simple fait demeure que, pour un jeune concepteur de sites Web qui souhaite faire ses preuves sur le sujet, il est souvent difficile d’envisager le sujet sans perdre de nombreuses heures à parcourir des blogs aléatoires. En fait, le problème tient en partie au fait que la typographie Web est souvent présentée comme une information "subjective". Le seul principe directeur sur lequel la plupart des gens peuvent s'entendre est que "le type doit être lisible"? mais après cela, il y a beaucoup d'opinions et peu de faits.

Ceci m’amène à mon premier point "culturel" pour tous ceux qui veulent vraiment améliorer leurs compétences en typographie Web?


Règle 01: Arrêtez le jeu du blâme

Voyons le premier véritable obstacle entre un concepteur et une grandeur typographique: Blâmer quelque chose ou quelqu'un d'autre. Si j'avais un dollar pour chaque fois que j'entendais un concepteur Web reprocher à ses navigateurs de rendre le texte différemment - ou qu'un éditeur de contenu aléatoire ruinait sa mise en page - ou qu'un client refusait tout simplement de voir la raison, je serais un centaire (le moindre cousin connu du milliardaire? Allez, je ne connais pas beaucoup de monde!).

Ce sont tous ce que j'appelle des "risques professionnels" - vous les connaissez lorsque vous entrez dans l'industrie et vous les rencontrez pratiquement tous les jours jusqu'à ce que la normalisation professionnelle sérieuse s'installe sur le Web (ce que je ne prédis pas dans peu de temps). Je n'essaie pas de dire que ces problèmes n'existent pas (ils existent, et ils sont pénibles), mais de jeter toutes nos insuffisances typographiques sur le dos d'Internet Explorer 6 ou de créer des mecs au hasard 8 $ l'heure évite le problème.

Le grand avantage est qu’un typographe Web sérieux peut résoudre ces problèmes. Les navigateurs peuvent être testés; Les schémas peuvent être rendus "idiot-proof", et les clients peuvent être dit d'aller à? doucement demandé de voir la raison.


Règle 02: Posséder La tâche de la typographie

À l'ère des presses à imprimer, des lettres gravées sur bois et des caractères combinés, il existait un ordre hiérarchique clairement établi pour déterminer qui était responsable de l'exécution correcte des tâches (typographiquement). Il n’est donc pas surprenant que cette personne soit généralement le type qui avait le coude à coude dans l’encre noire et la seule personne en ville à savoir utiliser l’énorme engin. Zut, dans la plupart des villes, il était peut-être le seul à savoir lire, alors vous l'avez cru sur parole quand il vous a dit comment mettre en page votre publication..

Les clients ont apporté le contenu, les imprimeurs ont géré la mise en page et la conception. Personne n'a vissé avec le système.

De nos jours, il semble que nous souffrions du cas de "trop ​​de cuisiniers dans la cuisine". Parce que tout le monde a accès à Microsoft Word et à un clavier, les concepteurs doivent se faufiler dans un océan de "typographes insta" lors de la phase de conception?

Ne vous méprenez pas, recevoir les commentaires d'un client est un élément crucial du processus de création. mais ce n'est pas un substitut à la prise de décision réelle et expérimentée au niveau typographique. C'est votre travail - le concepteur. Si vous parcourez un projet, attendez et espérez qu'un client décide d'une police ou d'une longueur de ligne particulière, vous pouvez également vous renvoyer vous-même. En faisant cela, vous vous réduisez à un peu plus qu'un corps attaché à une souris.

Je me répète juste pour être en sécurité ici - cela ne signifie pas que vous devriez devenir un imbécile bourru qui se moque des commentaires précieux. Ce que j'essaie de dire, c'est que si personne n'accepte de "prendre en charge" le travail de typographie au cours d'un projet, vous allez vous retrouver avec un type médiocre, dilué, à moitié assed qui ne rend pas justice à la fait que nous avons des siècles de recherche typographique à portée de main. Disposer une colonne de texte en espérant qu'un autre concepteur, développeur ou client reviendra et donnera l'impression que c'est bien, c'est un flic.

Soyez le concepteur, assumez la responsabilité. La typographie est votre métier.


Règle 03: Traiter le type comme une interface utilisateur

Quand vous pensez à une interface utilisateur, à quoi pensez-vous? Le menu de défilement classique d'un iPod? Le tableau de bord de votre voiture? Un HUD de certains jeux vidéo de science-fiction? Ce sont peut-être tous des exemples d'interfaces utilisateur? mais j'aimerais que vous réexaminiez ce que cela signifie pour les concepteurs Web. Examinons brièvement les tendances en matière de style d'interface au cours de la dernière décennie:

  • Au début des années 2000, les concepteurs Web estimaient qu'une interface utilisateur de qualité comportait beaucoup de métal brossé, de boutons pseudo-réalistes et de lettres brillantes..
  • Au milieu des années 2000, les concepteurs Web estimaient qu'une interface utilisateur de qualité consistait à utiliser des boutons brillants, des couleurs vives et des graphiques éclatants..
  • À la fin des années 2000, les concepteurs Web pensaient qu'il s'agissait de textures tactiles, de faux environnements de "bureau" ou de bloc-notes et de caractères gras..
  • De nos jours, nous sommes concentrés sur les arrière-plans "bruyants", les séparateurs de trait internes / externes et les ombres de texte en blanc.

Ce sont toutes de bonnes manies (et oui, il y a évidemment beaucoup de grandes exceptions à ces généralisations)? mais considérons quelques-unes des marques axées sur le Web qui ont existé au cours de toutes ces années (et refusent toujours de mourir). Ici - je vais vous montrer à quoi ils ressemblent:

Existe-t-il certains de ceux que vous considéreriez comme "d'excellentes interfaces utilisateur"? Probablement pas? Mais ils ont tous un succès ridicule (et qu’on le veuille ou non, utilisable) dessins. Alors, pourquoi les concepteurs Web se penchent-ils en arrière pour créer des designs qui ressemblent rien du tout comme eux?

Mon humble avis: c'est parce que notre industrie / notre commerce est encore relativement immature. Nous espérons tous trouver le "prochain grand style". Nous évitons donc délibérément des dessins ennuyeux mais fonctionnels. Nous n'aimons pas l'idée que quelque chose conçu en 2005 ait encore des utilisateurs. Nous souscrivons à l’idée qu’en agrémentant nos dessins de techniques et de textures difficiles, nous pourrons les rendre plus utilisables..

Peut-être une meilleure analogie est trouvée dans les voitures? Nous essayons tous de concevoir une Ferrari typographique alors que 98% des projets nécessitent uniquement une Honda Civic (ou dans certains cas, une bicyclette). Tant que cela fonctionne pour amener les gens d'un point A à un point B, ça va. La seconde, nous commençons à modifier les fonctionnalités du site avec nos propres idées sophistiquées sur ce à quoi devrait ressembler une "interface utilisateur géniale", nous risquons de casser le vélo.

Le simple fait, c’est que le texte ancien, sans les effets de bulles, le brillant et les autres conneries que nous avons jeté autour de lui, est aussi utilisable en soi que si tout était stylé comme s’il était va marcher sur le tapis rouge.

Pourquoi? Parce que le texte est l'interface utilisateur! Avant de saisir l'outil de dégradé, rappelez-vous que le texte est l'interface. Vous ne pouvez pas avoir une interface utilisable sans texte lisible et significatif. Les internautes s’adapteront à la feuille de style que vous jetez sur un dessin - mais les éléments centraux d’un site (navigation + contenu) doivent fonctionner avant tout..

Note latérale: Ce concept de "texte en tant qu'UI" est à l'origine attribué à Khoi Vinh - mais j'ai eu du mal à trouver où il avait écrit à ce sujet - vous devrez donc me croire sur parole.


Règle 04: Prenez le CSS au sérieux

Tapez toujours dans une mise en page, et les mises en page sur le Web n'existent jamais, jamais sans code.

La dernière règle que je vais aborder aujourd'hui concerne les éléments constitutifs de la typographie Web: CSS. Avec un CSS bien écrit, votre site Web tout entier doit s'auto-ordonner de manière logique - chaque page se ressemblera, créant une présentation unifiée et cohérente du site. Avec du CSS bien écrit, il est possible d’adresser plusieurs navigateurs et appareils. Heck, avec des CSS bien écrits, vous empêcherez les éditeurs de textes inspirés des cheveux de casser vos belles conceptions.

Le point sur lequel je veux en venir est le suivant: si vous avez l’impression d’être un concepteur de sites Web, mais que vous n’êtes vraiment bon que pour réaliser des maquettes Photoshop, il vous manque la moitié de ce que signifie concevoir pour le Web. Tapez toujours dans une mise en page, et les mises en page sur le Web n'existent jamais, jamais sans code.


Conclusion

Je ne dirai pas grand chose parce que, franchement, je suis impatient de commencer à écrire les premières parties de cette série - mais je voudrais terminer avec une poignée de liens que vous pouvez vérifier en attendant. Mon objectif pour cette série sera de compiler un impressionnant compendium de vrais tutoriels pratiques sur la typographie Web. mais je vais me baser sur des informations provenant de divers auteurs, articles et livres. Alors, voici ma liste:

  • Information Architects (Post 1) (Post 2)
  • Le ministère de type (poste 1)
  • Une liste à part
  • Soustraction (site de Khoi Vinh)
  • Les éléments du style typographique appliqués au Web
  • Penser avec le type