Choisir une police de caractères pour le HTML
Avec ou sans empattements ?
Les polices sans serif (sans empattements, ou polices bâtons) comme Arial, Helvetica, ou Verdana ont un "dessin" plus simple que celui des polices à empattement. Elles paraissent donc plus lisibles à l'écran et fatiguent moins le lecteur.
EXEMPLE
Utiliser des polices bâtons (sans empattements), Arial ou Verdana
Taille des caractères
Alors que les petits corps (corps 9 par exemple) restent lisibles sur papier, ils sont déconseillés pour l'écran, car la faible résolution supprime de l'information, des détails, et ils deviennent de moins en moins lisibles. On évite de descendre en-dessous de 10.
Le corps 12 est une bonne moyenne pour du texte courant.
Utilisation des styles, des variantes et des effets
Certaines polices de caractère supportent plus ou moins bien le recours aux styles. Il faut donc les tester, en fonction de la police choisie et de la quantité de texte à gérer.
- Bold
Dans les caractères gras et les petits corps, certaines lettres peuvent donner l'impression d'être attachées, ce qui gêne cruellement la lisibilité du texte.
- Italique
La caractéristique de l'italique réside dans l'inclinaison de la police, et c'est précisément cela qui le rend difficile à lire, car les lignes diagonales sont représentées par des marches d'escalier à l'écran. Ces marches, conséquences de la pixellisation, rendent le "dessin" du texte très confus. La qualité de l'italique s'améliore lorsque le corps est augmenté, car le nombres de pixels dans la diagonale l'est aussi.
- Souligné
Dans l'univers du Web, le souligné signifie un lien. Il est déconseillé pour une autre fonction. Pour mettre en valeur un mot, il est préférable d'avoir recours au changement de couleur ou d'utiliser le Bold par exemple.
Le style "souligné" représente un lien. Il est déconseillé de l'employer pour un autre usage.
EXEMPLES :
texte avec empattements, changement de corps et de styles
EXEMPLES :
texte sans empattements, changement de corps et de styles
La casse : minuscules ou majuscules ?
- Un texte en majuscules est lu moins vite que ce même texte en minuscules.
- On privilégie les majuscules pour les textes très courts et les mots isolés comme : les accroches et les intitulés de navigation.
- Plus la quantité de texte est importante, plus l'emploi des majuscules complique la lecture.
exemple : www.unog.ch

Lors de la réalisation d'une maquette graphique sous Photoshop, il est d'usage de choisir l'option texte "non lissé" pour simuler ce qui sera du texte html.
COMPARATEUR DE TYPOS
http://typetester.maratz.com