Retour aux sources: une belle typographie en conception Web

Un excellent site Web commence par une belle typographie. Et tout en enfreignant la règle occasionnelle est génial, il est parfois bon de revenir aux principes de ce qui fait une grande typographie - et comment la créer.

Il s'agit d'un rafraîchissement essentiel qui peut vous aider à repenser les projets, à envisager une nouvelle approche ou tout simplement à revenir à une conception plus simple et plus rationalisée.

Donc, aujourd'hui, nous ignorons les tendances et les moyens d'enfreindre les règles pour nous concentrer sur la théorie de la typographie et sur la façon dont les «règles» peuvent être un excellent guide pour créer un type phénoménal.

Taille et hiérarchie

Questions de taille. La taille peut être l'un des facteurs les plus importants lors de la création d'un plan pour une typographie lisible sur les écrans. Un petit texte peut être discordant et difficile à voir. Un texte surdimensionné peut traverser les lignes de manière étrange et provoquer de la confusion.

La typographie lisible comporte plusieurs couches de hiérarchie pour indiquer aux utilisateurs ce qu'ils doivent lire en premier, en deuxième, etc. Il y a une échelle évidente pour que le corps du texte soit d'une taille dans la conception, les titres sont d'une autre taille et les sous-titres et les sous-titres ont également leurs propres spécifications.

Suivi et crénage

Souvent confus, le suivi et le crénage ne sont pas la même chose. Le crénage est l'ajustement de l'espace entre une paire de lettres. Le suivi est l'ajustement de l'espace entre un ensemble complet de caractères, tel qu'un paragraphe ou un ajustement global à un bloc de texte.

Le crénage est souvent appliqué à des éléments individuels pour créer de la précision et améliorer la lisibilité et même le style des gros textes. Le suivi est souvent utilisé pour resserrer une police lâche dans le corps du texte.

Limiter les polices de caractères

Trop de polices de caractères peuvent être accablantes et choquantes. Deux ou trois polices suffisent pour la plupart des projets.

La clé pour choisir une option de type solide est de choisir une famille de types avec beaucoup de variations de style. La plupart des polices de caractères de qualité sont fournies avec plusieurs styles - gras, régulier, italique, condensé, noir, etc. En choisissant une police de caractères avec plusieurs options, vous aurez un poids et un style pour plusieurs utilisations. (Certaines familles incluent même des options serif et sans serif si vous souhaitez conserver la conception entière dans une seule famille de polices.)

Mélanger et assortir les styles

Lorsque vous choisissez des polices de caractères - il est vrai que cela peut être la partie la plus difficile de nombreux projets de conception - il est correct, et même préféré, de choisir deux styles de caractères différents.

L'appariement le plus courant est un empattement avec et sans empattement. Mais vous n'avez pas à vous en tenir à cela.

Lorsque vous associez différents styles et polices de caractères, recherchez des lettres qui ont une hauteur x similaire (recherchez des jeux de caractères avec la même taille verticale "x" en minuscules) et la forme des bols (espace à l'intérieur de lettres fermées comme un "o").

Ces détails peuvent faire une grande différence en ce qui concerne la façon dont les polices se sentent ensemble et la facilité avec laquelle les utilisateurs peuvent lire le texte. L'utilisation de formes de lettres similaires dans différents styles a toujours une familiarité visuelle qui peut rendre tous les types plus faciles à lire ensemble.

Oubliez les tirets et la justification

La plupart du temps, les tirets et la justification complète ne sont pas nécessaires.

Particulièrement en ligne, ces techniques peuvent rendre le texte plus difficile à digérer et à comprendre en un coup d'œil. Les tirets interrompent l'expérience de lecture et une justification complète entraîne souvent un espacement étrange difficile à lire.

Si les deux éléments ont leur place dans certains projets, ils doivent le plus souvent être évités.

Ne modifiez pas les polices

Vous ne devez jamais ajuster une police. N'essayez pas de le rendre plus gros, plus grand ou plus mince. Choisissez plutôt une nouvelle police de caractères.

Les concepteurs de types travaillent dur pour créer un ensemble cohérent de caractères pour une police de caractères lisibles et adaptés au style de la police. N'essayez pas de changer l'apparence d'un ensemble de caractères. Vous ne les améliorerez pas et ferez souvent un gâchis du type dans le processus.

Si une police de caractères ne fonctionne pas exactement comme vous en avez besoin, cherchez autre chose. Essayez l'outil de police similaire Identifont, qui identifie les polices d'apparence similaire, pour sélectionner une autre option qui pourrait mieux fonctionner dans votre projet.

Contraste

Conception pour le contraste en utilisant la typographie. Tout comme vous utiliseriez différentes tailles pour créer une hiérarchie, envisagez différents poids, couleurs et styles de police pour fournir un intérêt visuel.

La couleur est l'un des moyens les plus efficaces et les plus simples de créer du contraste. Le contraste idéal est un texte sombre sur fond clair (ou l'inverse). Il existe un nombre presque illimité d'options de couleurs pour vous aider à y parvenir. Lorsque vous jouez avec la couleur et la typographie, sachez que certaines combinaisons de couleurs, comme le rouge vif sur le bleu droit, peuvent être très difficiles à lire. Recherchez des combinaisons différentes en termes de lumière par rapport à l'obscurité, de dynamisme et de saturation.

En matière de contraste, les arrière-plans simples sont souvent les meilleurs pour donner de la place au texte à lire. Mais si l'arrière-plan contient des éléments visuels, tels qu'une image ou un motif, augmentez la taille du lettrage pour créer une séparation entre l'arrière-plan et l'élément de texte de premier plan.

Mesurer, c'est important

Une mesure est la taille du conteneur contenant le texte. Il peut s'agir de la largeur d'un bloc de texte entier ou d'une seule colonne dans un format à plusieurs colonnes.

Mesurer est important car le nombre de caractères (y compris les espaces, les glyphes et la ponctuation) sur l'écran peut avoir un impact sur la lisibilité. La théorie derrière ce concept est que si les lignes sont trop longues ou trop courtes, il peut être fatigant pour l'œil de l'utilisateur de lire en raison d'un mouvement constant de va-et-vient d'une ligne à la suivante.

Extrait des éléments du style typographique: «Tout élément de 45 à 75 caractères est largement considéré comme une longueur de ligne satisfaisante pour une page à une colonne définie dans une face de texte empatté dans une taille de texte. La ligne de 66 caractères (comptant à la fois les lettres et les espaces) est largement considérée comme idéale. Pour un travail sur plusieurs colonnes, une meilleure moyenne est de 40 à 50 caractères. »

C'est un assez bon point de départ pour la plupart des projets, bien que de nombreux projets soient biaisés pour des tailles de caractères un peu plus grandes, ce qui ferait tomber le nombre de caractères dans la plus petite extrémité de cette plage.

Même si la typographie mobile n'était pas un problème lors de la première publication du livre, la ligne directrice pour plusieurs colonnes est un point de départ acceptable. Vous pouvez même opter pour aller un peu plus bas et viser 35 caractères par ligne plus optimaux pour les petits écrans.

Conclusion

Si vous voulez continuer à penser à la théorie de la typographie et au lettrage, il existe de très bons livres en plus du classique mentionné ci-dessus.

Considérer:

  • Penser avec le type par Ellen Lupton
  • Pourquoi les polices comptent par Sarah Hyndman
  • Just My Type: un livre sur les polices par Simon Garfield

© Copyright 2024 | computer06.com