Typographe 101: Serif vs Sans-Serif

Au stade de la sélection des polices, un designer se demande souvent, "à Serif ou Sans-Serif"? Choisir le type de police à utiliser dans un design est d'une importance capitale car il affecte grandement la lisibilité, l'expérience de l'utilisateur et l'esthétique globale de la conception.

Bien que, quelle que soit l'expérience que vous avez de la typographie, vous pouvez toujours rester coincé dans le dilemme serif vs sans-serif . Personnellement, je pense qu'un bon moyen de s'en sortir est de comprendre les bases mêmes des empattements et des empattements, et c'est exactement ce que cet article vise à faire.

Jetons un coup d'oeil à l'article suivant qui met en évidence les différences majeures entre les polices serif et sans-serif pour une meilleure compréhension des deux.

D'où venaient les empattements?

Les serifs sont de petites lignes fines attachées à la fin des traits dans les caractères . Ils sont censés provenir de l'alphabet latin que les Romains utilisaient pour graver leurs écrits dans la pierre.

Bien qu'il n'y ait aucune origine universellement acceptée à cette pièce décorative dans la typographie, on croit que les Romains avaient l'habitude de peindre des lettres avec des contours sur la pierre, ainsi quand les sculpteurs de pierre ont suivi les marques de brosse qui ont flambé de serifs .

Qu'en est-il de sans-serif?

Au contraire, Sans-serif signifie littéralement «sans empattement» . Toute police qui est absente de ces traits pendants à la fin de chaque coin, peut être considérée comme une police sans empattement.

Sachant cela, comment le choix d'aller avec des empattements ou sans empattement peut-il affecter votre design? Voici quelques points à considérer:

Lisibilité

La lisibilité est souvent mesurée en fonction de la facilité avec laquelle un lecteur peut digérer le contenu . Bien sûr, comme la vision est généralement subjective, il y a beaucoup de facteurs qui entrent en jeu, y compris le niveau d'intérêt ou le lecteur, et comment le contenu est organisé dans le bloc ou l'espace qui lui a été donné.

La méthode "old school" de présentation de texte utilise des empattements pour une raison. Avez-vous déjà pensé pourquoi la plupart des journaux utilisent des polices de caractères serif pour leur contenu? Parce que les empattements sont plus faciles à lire. Ces petites lignes décoratives dans chaque personnage guident vos yeux de manière fluide lorsque vous vous déplacez d'une ligne à l'autre et reliez les lettres ensemble, ce qui rend la lecture de textes plus longs moins pénible pour vos yeux .

Les espaces entre les lettres (puisque vous devez tenir compte des empattements en ce qui concerne l'espacement) donnent également plus de place au lecteur pour identifier facilement les lettres les unes des autres .

Regardez l'exemple ci-dessous et vous remarquerez que les polices serif créent une expérience de lecture plus facile à l'œil car elle crée des espaces entre les lettres et les mots. Cela facilite le déplacement de vos yeux d'un mot à l'autre.

D'autre part, la police serif devient plus difficile à lire en utilisant le même espacement. C'est parce que la séparation de chaque lettre est plus petite, car vous n'avez pas à tenir compte des empattements lorsque vous les espacer .

Lisibilité

La lisibilité est la qualité et la clarté du lettrage . Cela concerne les détails fins de la police de caractères et est essentiel car cela aide le lecteur à différencier un caractère d'un autre. Cela diffère de la lisibilité car ce dernier est surtout concerné par l'approche du contenu dans son ensemble .

Dans le cas de l'image ci-dessus, les lettres minuscules L et I pour sans serif dans Arial se ressemblent beaucoup . Imaginez-vous en train de taper le mot "Illinois".

Voici pour souligner mon point.

Cependant, il est important de noter que si votre police est illisible, elle ne peut jamais être lisible. Mais il existe de nombreux cas de types lisibles qui peuvent sembler illisibles en raison de la façon dont ils sont espacés ou mis à l' échelle par rapport à leur objectif de conception.

Alex Poole a écrit un article bien expliqué comparant les polices serif et sans-serif dans le but de découvrir lequel était le plus lisible.

Selon lui, il y a cinq caractéristiques à noter quand il s'agit de la lisibilité:

• Serif ou Sans-serif
• Taille de point
• X-Hauteur
• Compteurs
• Ascendeurs et descendeurs

Poole a conclu, en se basant sur des arguments qui soutiennent les deux côtés, qu'il n'y avait vraiment aucune différence dans la lisibilité quand il s'agit de la sélection des caractères . Il a également noté qu'il y a une possibilité que les empattements ou l'absence d'empattements puissent affecter la lisibilité mais la différence n'est même pas mesurable .

Cependant, il a dit que:

Une plus grande différence de lisibilité peut facilement être trouvée au sein des membres de la même famille de caractères qu'entre une police de caractères serif et une police sans empattement . Il y a aussi d'autres facteurs tels que la hauteur x, la taille du compteur, l'espacement des lettres et la largeur de trait qui sont plus importants pour la lisibilité que la présence ou l'absence de empattements .

Mise à l'échelle et résolution

Le texte dans la conception Web n'est pas statique. Il peut différer d'un écran à l'autre et devrait être évolutif. Ceci est fait pour que le texte soit toujours lisible malgré la taille de l'écran.

Dans ce domaine, il est sûr de dire que sans-serif gagne la bataille car il est plus flexible à l'échelle . Les polices sans empattement sont beaucoup plus faciles à mettre en valeur et à lire dans des résolutions plus petites, car elles survivent au maculage en raison du manque de détails .

Voici un excellent exemple de la mauvaise utilisation du serif . Jetez un oeil au paragraphe du bas sur la couverture de Time Magazine ci-dessus et vous remarquerez facilement à quel point il est relativement difficile à lire, car il ne circule pas facilement, surtout avec cette petite taille. Mais remarquez à quel point l'effet est parfait car il est passé à sans serif pour "Jonathan Franzen".

La même chose est vraie quand une police sans-serif est explosée. L'échelle de la police garde sa forme générale et la rend plus reconnaissable . Donc, quand il s'agit de mise à l'échelle, les sans empattements ont tendance à être facilement adaptés à de meilleures tailles, car ils s'adaptent bien aux tâches de petite taille et aux déchirures de plus grande taille .

Pour serif, ou sans-serif?

Alors, quelle est la réponse à la question?

Eh bien, on peut dire que c'est un lien évident. Le choix entre les polices sans serif et serif se résume à votre intention d'utiliser le texte . Si le texte que vous dessinez est censé rester presque de la même taille? Ensuite, vous voudriez une meilleure lisibilité, ce qui en ferait un meilleur choix .

D'un autre côté, si vous voulez que le texte fasse partie d'un site web responsive, alors choisir une police sans-serif pourrait être plus sage puisque vous ne voulez pas que votre texte apparaisse trop petit pour être lu.

Jetez un oeil à ces couvertures de magazines GQ qui utilisent les polices serif et sans serif . Le consensus général est que les polices serif sont utilisées sur les documents formels et imprimés, tandis que les polices sans empattement sont principalement utilisées sur le Web . Mais dans ce cas, les deux ont été utilisés, et si vous remarquerez que c'est toujours le nom du modèle de couverture qui est en empattement, soulignant ainsi.

Quelques mots de conclusion

Rappelez-vous juste que la cohérence est la clé . Votre choix de police doit aller avec l'esthétique globale du design que vous créez. Vous pouvez mélanger et faire correspondre des polices de caractères qui sont similaires, essayez de les redimensionner afin de savoir lequel fonctionne. Cependant, souvenez-vous que vous faites cela pour que l' utilisateur comprenne le message et que votre design soit esthétique.