Choisir sa police

Contrairement à un document imprimé, le choix de la police est beaucoup plus limité sur le web. La raison est simple: la navigateur se sert de la fonte installée sur l'ordinateur de l'utilisateur pour l'utiliser dans le navigateur.

Classification

En typographie, il existe une classification des polices. Le W3C a simplifié cette catégorisation pour l'adapter au web et propose 5 grandes familles. Elles doivent être utilisées dans la feuille de style en tout dernier recours. Elles sont dites génériques puisqu'elles définissent un ensemble de critères à respecter.

Empattements

Il existe deux grands groupes de polices: les polices à empattement (serif en anglais), les plus anciennes, et les polices à bâtons (sans serif ou linéales). Les empattements sont des petits traits qui terminent, en haut et en bas, les jambages de certains caractères.

La police à empattements la plus connue est sans doute le Times New Roman (Windows) apparu en 1932 dans le quotidien anglais portant son nom. Microsoft l'a rendu célèbre en l'intégrant rapidement dans son système d'exploitation et en faisant d'elle la police par défaut. Les polices serif conviennent parfaitement pour les textes de petite taille et son usage est principalement réservé à l'impression. Cette règle n'est pas gravée dans le marbre puisque le Georgia a été pensé et créé spécialement pour l'écran.

On ne mélange pas deux caractères trop proche sur un même niveau de lecture. Par exemple, deux polices à empattements Times et Georgia. Par contre, il est de bon ton de combiner deux types de polices sur deux niveaux différents. Par exemple, le Georgia pour le titre et le Verdana pour le corps du texte ou inversement. On joue ainsi sur le contraste visuel dans la forme des écritures. Les possibilités sont plus nombreuses et beaucoup plus percutantes si vous utilisez des images pour les titres.

Polices système

Pour garantir un affichage relativement correct sur tous les ordinateurs, les polices système doivent être privilégiées. Le problème c'est qu'elles ne sont pas nombreuses et peuvent se compter sur les dix doigts de la main. Cela ne laisse guère la place à l'originalité ou la créativité.

Polices systèmes sur Windows
Nom	Famille	Commentaire
Arial	Sans serif	Copie vulgaire de l'Helvetica sur Mac. Adapté à l'écran. Lisible au-dessus de 10 points.
Comic Sans MS	Cursive	Police enfant. Ne convient pas pour des sites professionnels. Peu lisible à l'écran.
Courier New	Monospace	Police à espacement fixe. Utilisée pour reproduire du code.
Georgia	Serif	Meilleure police à empattements. Lisible au-dessus de 10 points.
Impact	Sans serif	Très peu adapté pour du contenu en ligne. Très peu lisible.
Times New Roman	Serif	Peu adapté à l'écran surtout dans des petites tailles.
Trebuchet MS	Sans serif	Moderne et simple. Lisible au-dessus de 10 pts.
Verdana	Sans serif	La plus utilisée sur le web. Lisible même dans de petites tailles.

Il fut un temps où le Comic Sans MS avait la cote sur le web. Aujourd'hui, le public le réserve plutôt dans l'administration. Pour le texte, les webmasters utilisent abondamment les polices modernes conçues spécialement pour l'écran: Verdana et Arial avec une nette préférence pour le Verdana. Le Georgia est la seule fonte à empattement adaptée au web. Dans une moindre mesure, on retrouve le Trebuchet, Lucida Sans mais ils sont souvent réservés aux titres.

Prudence avec Verdana

Le Verdana apparaît plus grande que les autres. Du coup, en cas de substitution par une police sans serif elle risque d'être trop petite pour être lue correctement. C'est le cas par exemple de Linux qui ne gère pas cette police.

Spécifier des polices

Lors de l'écriture d'une page web, il faut préciser la police dans la feuille de style. Dans l'exemple ci-dessous, Verdana est notre premier choix. Si le visiteur ne possède pas cette police, le navigateur choisit alors l'Arial puis l'Helvetica. En fin de compte, si aucune de ces polices n'est présente, le navigateur utilise la police par défaut sans empattement (sans serif dans notre exemple).

Il est important de toujours spécifier son choix typographique. Sinon, l'ordinateur utilise la police système par défaut... Times New Roman. Or cette police à empattement n'est pas du tout adaptée à l'écran et risque de poser des problèmes de lisibilité.

Évitez les mélanges

La sobriété est le maître mot pour garder un tout cohérent. Cela ne sert à rien de mélanger 36 polices sur une même page, vous ne ferez qu'aggraver la lisibilité du texte. Limitez-vous à trois polices de base. Utilisez des polices de famille opposée pour créer un contraste visuel. Par exemple, l'Arial et le Georgia plutôt que l'Arial et le Verdana toutes deux sans empattements.

Faites des essais

Vous avez compris les grandes lignes mais maintenant il faut passer à l'action et ce n'est pas toujours facile de tester ses polices sur son site web. Pour cette raison, je vous conseille d'aller faire un tour sur Typetester. Vous comparez trois fontes en même temps avec une série de réglages: choix de la police, couleur, alignement...