25 mai 2008

# Typographie

typographie

La typographie désigne entre autres l’art de composer un ensemble harmonieux et équilibré à l’aide de caractères d’impression : choix des caractères, choix de l’interlignage, mise en page, proportions, marges sont parmi les paramètres pris en compte. La typographie est tout autour de nous : livres, panneaux, publicités, sites internet…
La plupart d’entre nous y porte généralement peu d’attention car on l’associe à quelque chose de fonctionnel : les règles typographiques régissent notre façon d’écrire (ponctuation, utilisation des majuscules, hiérarchisation des informations…) et lorsque l’on doit choisir une police de caractère cela tourne en général autour de Arial, Times New Roman et Comic Sans MS …

J’ai commencé à m’intéresser à la typographie en même temps qu’au graphisme. La typographie avait alors pour moi une fonction décorative et je piochais au gré de mes goûts parmi les fonts de dafont.com (un des sites de référence pour les polices gratuites) lorsque je devais réaliser une petite composition graphique. Puis est venue avec le blog la question de la lisibilité et de l’ergonomie, des possibilités d’affichage en fonction des différents navigateurs etc…

C’est I love Typography, le blog d’un graphiste passionné de typographie qui m’a donné envie d’en savoir un peu plus sur cet technique / art méconnu en dehors des designers et des graphistes.

L’aspect technique
La fonction principale d’une police de caractère est d’être lue. La lisibilité est donc extrêmement importante et de multiples règles régissent la construction des caractères : proportions, espacement, ouverture des lettres, équilibre etc… Plutôt que de faire ici un cours (dans lequel je serais peu légitime), voici quelques exemples illustrant certaines contraintes ou règles dans le design de caractères qui m’ont interpelé.

exemples-typo

Exemple 1 : A hauteur égale, le triangle et le cercle paraissent plus petits que les carrés. Pour rétablir l’alignement optique, il faut faire dépasser les pointes et les arrondis.

Exemple 2 : L’oeil a surtout besoin de la partie supérieure de la lettre pour lire un mot. L’ouverture des formes de la police Frutiger (en haut) permet une meilleure identification de la lettre que le cas de l’Helvetica en bas.

Exemple 3 : Ces lettres montrent les proportions relatives des formes fondamentales de l’alphabet romain. Les capitales correspondent aux proportions d’un carré dont elles occupent soit la totalité, soit 8/10e soit la moitié de la surface.1

Anecdotes typographiques
Serif, sans serif : une police sans sérif est une police sans empattements (petites extensions qui terminent les caractères)

tee-beatles-helveticaHelvetica : la police Helvetica (première image de cet article) est une des polices les plus populaires, voire culte. Elle est réputée pour son harmonie, son équilibre et sa polyvalence d’utilisation. Elle est aussi bien utilisée pour des logos, que des compositions graphiques ou simplement pour du texte .

La haine de comic sans ms : Pour certains, la police comic sans MS (à la base utilisée pour les comics et cartoons) est ce qui est arrivé de pire à la typographie. Utilisée pour les affichettes d’annonces, les sujets d’examens et sur toutes les mauvaises présentations power point, la police Comic Sans MS est utilisée abusivement et sans discernement. Ban Comic sans MS prône l’éradication de cette fonte.

Helvetica vs Arial : Helvetica est une police commercialisée par Linotype. Pour réduire ses coûts, Microsoft a développé une police très (très très) proche de l’Helvetica et l’a implanté dans son système d’exploitation : Arial. Malgré les qualités de l’Helvetica, c’est l’arial qui est la police la plus répandue. L’ironie est que le logo de Microsoft est en police…Helevetica.

L’aspect artistique

Si la typographie est régie par des règles strictes, elle est cependant un moyen d’expression artistique offrant énormément de liberté. Les graphistes peuvent en effet jouer avec le lettrage et la composition sans limites. A y réfléchir graffiti et typographie ne sont pas si éloignés que ça.

croquis

Principales Sources / Ressources :

1 Les 3 exemples du paragraphe sur la technique sont issus du site lily
exemples de compositionsissues de l’excellentissime Smashing Magazine
I love typography

frenchhugetechnicaltunnelhelvetica-neuesterkwater

Join the conversation! 2 Comments

  1. très intéressant ton article.
    Je te conseil aussi http://www.typeneu.com/ (si tu ne connais déjà  bien entendu).

  2. […] tout ce qu’il y a de plus efficace ; « less is more » comme dirait l’autre. Police helvetica noire, pour les titres et le texte. Un onglet rouge indiquant la rubrique vient rehausser un peu le […]

Comments are closed.

Category

Culture

Tags

,