Typographie

La typographie est essentielle dans la perception d’un site web.

Comment choisir la police d’un site web ?

Le style de la typographie place naturellement dans l’univers de l’activité exercée : classique pour le corporate, élégant pour l’artistique, décalé pour les sites plus ludiques.

La taille de la police est déterminée pour permettre la bonne lecture, sur les grands écrans ainsi que les mobiles.

La forme propre des caractères détermine la lisibilité de la police, essentielle, à privilégier toujours au regard de son originalité.

La graisse de la police, c’est à dire son épaisseur, joue également sur sa lisibilité. Généralement moyenne sur les caractères standards, elle est grasse sur les caractères en gras et quelquefois plus maigre sur les titres s’ils sont de taille plus importante.

Les mesures caractéristiques d’une police de caractères

Le choix des différentes tailles de caractères varie selon l’usage : texte simple, paragraphe, lien, citation, et surtout les titres. L’ensemble des tailles doit être homogène pour garder une cohérence globale.

La couleur des textes conditionne le contraste par rapport aux fonds de couleurs, et participe également à la lisibilité globale, facteur par ailleurs pris en compte dans le référencement sur les moteurs de recherche.

Exemples de différents styles de fontes de caractères

Pour le web, les polices de caractères sont adaptées : certaines polices qui rendent bien en print ne sont pas adaptées au web. L’écart se réduit néanmoins avec l’augmentation de la définition des écrans, y compris sur les mobiles.

Les sources principales pour les polices web sont Google fonts et Adobe fonts :

• Google fonts ( gratuit, 950 polices disponibles )
• Adobe fonts ( payant, plus de 1000 polices )

Quelles sont les meilleures polices actuelles ?
On pourra citer Open sans, Montserrat, Inter, Baskeville, Raleway, Roboto, Lato, Merriweather, Source Sans Pro…

Il est à noter que chaque système (Windows, Mac OS, Ubuntu…) intègre des polices par défaut qui n’ont pas besoin d’être chargées en plus du contenu proppre de la page. Dans ce cas la page se charge plus vite. Et bien souvent ces polices suffisent. La liste standard est apple-system, system-ui, BlinkMacSystemFont, « Segoe UI », Roboto, « Helvetica Neue », Arial, sans-serif, avec une liste de polices choisies par le système s’il les supporte.

En conclusion

Pour bien choisir une typographie adaptée au site web, la première idée est de se conformer aux codes de l’univers de l’activité exercée. Ensuite de vérifier la bonne lisibilité de la police sur tous les écrans, de choisir sa taille pour les textes et les titres, et enfin de définir les couleurs assurant le meilleur contraste.

Pour en savoir + :
Article Typographie / Wikipedia