romy.tetue.net

Conception web et développement front
X-HTML, CSS, SPIP, sémantique et accessibilité


Différence de lissage des caractères


11 juin 2007,
par Romy Duhem-Verdière

Le rendu typographique d’une même page web diffère sensiblement selon l’ordinateur utilisé.

En affichant la même page web sur l’écran d’un Mac et sur celui d’un PC, on constate en général que la typo est plus douce, que les textes sont plus petits et que les couleurs sont plus claires et plus nuancées, sur le premier que sur le second. Vous l’ignorez souvent, mais la plate-forme utilisée pour surfer joue un rôle non négligeable dans l’affichage de la typographie d’une page web.

Une image vaut mieux qu’un long discours. Voyez donc comme les différences de rendu typographiques sont flagrantes sur ces deux captures d’écran d’un extrait de la même page affichée sur Mac puis sur PC :

Sur Mac :
doucement
lissé
Sur PC :
nettement
crénelé

Explication ? Le système d’exploitation du Mac comporte un utilitaire de lissage des caractères (anti-aliasing), qui affiche des textes doucement lissés (au risque du flou dans les très petites tailles) [1]. Par contre le système d’exploitation du PC ne sait pas lisser les caractères en dessous d’une certaine taille, ce qui affiche des caractères nets mais crénelés [2].

Et on n’y peut pas grand chose. Le seul moyen d’éviter ces différences d’affichage et d’utiliser une image et non du texte. C’est le cas dans l’exemple ci-dessus, où seul le cartouche « nouveauté » s’affiche identiquement sur les deux systèmes, puisqu’il s’agit d’une image.

Rappelons d’ailleurs qu’il est utopique de souhaiter contrôler l’affichage typographique précisement, de façon à ce qu’il soit partout identique, puisqu’il est fonction non seulement du système utilisé mais aussi de l’outil de navigation, de la résolution de l’écran et même des paramétrages... de chaque utilisateur.

[1] Ne regardez surtout pas votre site dans Safari, le navigateur de Mac OS X : il vous semblera si magnifiquement beau que vous auriez peine à retourner à votre navigateur habituel. C’est très sérieusement pour cette raison que je boycotte Safari : trop performant, il n’est pas représentatif des conditions réelles de navigation de la majorité des internautes et induit le graphiste Web en erreur.

[2] « Il y a ceux qui savent, et ceux qui ne savent pas. Sous Windows XP le lissage des polices à l’écran n’est pas configuré par défaut. Il faut suivre les conseils que donne joyeusement Microsoft pour régler votre système d’exploitation. Ça a l’air facile, faut-t-il encore que vous passiez le Rubicon. » Lisez attentivement les instructions dispensées sur le site de Microsoft.
Lu sur le blog design et typo de Peter Gabor : « Polices lissées sous Windows XP », septembre 2006.

Voter pour cet artice sur hellocoton.fr

Vos commentaires

  • Le 11 juin 2007 à 14:26, par Pieropaolo

    Et ce site est bien plus beau vu d’un Mac aussi... Mais il n’y a pas que le lissage qui joue, il y a ausssi le choix parmis les polices installées par défaut avec les systèmes : OS X offre des familles de polices plus variées (variété qui exige sans doute un bon lissage aussi). Ainsi, ce site dispose d’une très élégante police de titraille qui n’est, hélàs, pas visible sous Win XP. Par ailleurs, j’en profite pour souligner que le lissage sous Win XP est moins fin et produit un leger effet de bavures, c’est sans doute pour cela qu’il est désactivé par défaut.

  • Le 23 février 2009 à 20:27, par Chez Tine

    et bien ! mazette, c’est compliqué ... sur pc ... va falloir que j’imprime les explications pour les suivre convenablement ; j’espère juste ne pas me tromper ; ah ! comme le mac me manque ... merci pour cette information précieuse Tine

Un message, un commentaire ?


Qui êtes-vous ? (optionnel)

Pour afficher votre trombine avec votre message, enregistrez-la d'abord sur gravatar.com (gratuit et indolore) et n'oubliez pas d'indiquer votre adresse e-mail ici.

Ajoutez votre commentaire ici
  • Ce formulaire accepte les raccourcis SPIP et le code HTML.

Suivre les commentaires : RSS 2.0 | Atom



© 2000-2010 Romy Duhem-Verdière | Certains droits réservés | Qui suis-je ? | Contact | Aide | Top ↑
Vérifiez vous-même la qualité du code de cette page en la soumettant aux validateurs XHTML et CSS.