La palette des 216 couleurs web-safe représente les couleurs que l’on est assuré de retrouver telles quelles sur toutes les plates-formes. À l’instar de ce qui se fait sur les couleurs, je vais ici traiter des polices de caractères.
Le transport des polices d’une plate-forme à l’autre est bien connu comme délicat ; il est d’autant plus étonnant de ne pas avoir encore de vraie réponse (nous verrons plus bas les multiples propositions existantes). Les divers obstacles rencontrés lorsque l’on veut résoudre ce problème sont de plusieurs ordres :
"web-safe fonts". "browser-safe fonts" a donné aussi de bons résultats. En revanche, cross-platform et "font palette"donnent des résultats très mitigés.Comme expliqué plus haut, il n’y a pas de solution miracle. Ce que je propose tiens en peu de choses.
Avant tout, être raisonnable. c’est-à-dire ne pas vouloir reproduire des schémas « papier » sur la Toile. La Toile a ses imperfections, ses avantages (universalité), ses limitations (notamment en bande passante). Concrètement, cela veut dire qu’il faut éviter les images pour les polices. On peut faire pas mal de choses avec des balises, et plus encore avec des CSS. Quant à ce qu’on ne peut faire ni avec l’un, ni avec l’autre, il faut se demander si c’est vraiment nécessaire en regard des problèmes que ça pose (pas de sémantique et encore moins d’accessibilité, alourdissement de la page et de la mise à jour…). En dernier recours, vous pouvez utiliser les images, mais ce n’est pas de ça que je parlerai ici.
Ensuite, inventorier les plates-formes que l’ont veut voir supportées. Les plus évidentes (et celles que nous choisirons) sont : Windows, Macintosh et Unix (ce qui comprend aussi Linux et *BSD ; à ce propos, nous considérerons Mac OS X comme un Macintosh, pas comme un *BSD). Je laisse volontairement de côté les architectures plus rares comme Amiga (QNX et Atheos se comportent comme des Unix), si vous avez des informations à ajouter sur les architectures exotiques (ainsi que les produits nomades), dites-le moi.
En troisième lieu, il faut choisir la bonne nomenclature. Il en existe plusieurs, de rigueur variable, mais seules sont acceptées de manière internationale la Vox-AtypI et la W3C. Comme on ne peut creuser avec un balai, on ne peut travailler sur les polices Web avec une nomenclature associée à la typographie classique (du moins en l’état actuel, CSS3 étant prometteuse sur ce point). Nous prendrons donc la nomenclature du W3C, certes moins détaillée, mais plus adaptée au Web d’aujourd’hui.
Si vous vous demandez d’où vient ce « Lorem Ipsum », la réponse mérite bien un site web.
Notez que l’apparence de ces cinq polices peut varier d’un ordinateur à l’autre (particulièrement d’un système d’exploitation à l’autre). La raison en est simple : ce ne sont pas de vraies polices, juste des indications pour choisir (automatiquement) quelle police afficher.
On peut désormais s’attaquer au corps de l’ouvrage, la collecte d’information sur la fréquence d’installation des polices sur les systèmes. C’est le domaine où j’ai le plus besoin d’aide, n’ayant qu’un Windows virtuel (Virtual PC) et aucune machine Unix à ma disposition (enfin, pas facilement).
D’une manière générale, considérez que les polices Windows fréquentes se trouvent aussi sur Mac et inversement, Unix en étant dépourvu.
Voici un début de tri :
| (Windows|Mac OS X) + Office | |
|---|---|
| Andale Mono | |
| Arial | |
| Arial Black | |
| Arial Narrow | |
| Book Antiqua | |
| Bookman Old Style | |
| Century Gothic | |
| Comic Sans MS | |
| Courier New | |
| Garamond | |
| Georgia | |
| Haettenschweiler | |
| Impact | |
| Lucida Handwriting | |
| Modern | |
| Monotype Corsiva | |
| Symbol (préférer une police Unicode sérif) | |
| Tahoma | |
| Times New Roman | |
| Trebuchet MS (pas sûr) | |
| Verdana | |
| WebDings (WebDings) | |
| WingDings (WingDings) | |
Commencez toujours par la préférée. Il y a peu de chance que quelqu’un l’ait (à moins qu’elle soit fréquente) mais c’est quand même l’objectif de votre travail, d’afficher celle que vous aimer (et puis, si l’utilisateur télécharge une police, ce sera celle-là.
L’ordre des polices par système n’est pas anodin : d’abord, je travaille sur Mac, c’est donc les polices Mac que je connais le mieux. Ensuite, le Mac est la machine préférée des graphistes et par là-même à l’une des meilleures fonthotèque par défaut. Windows est moyen, quant à Unix, il est notoirement peu doté.
Addendum par Thomas Linard
Toutes les polices d’une taille (corps : 9, 12, 14…) donnée ont la même taille, puisque la « taille », ou force de corps, mesure la hauteur de la ligne (pour simplifier). Quand on crie sur la « taille » de Verdana, on parle en fait de :
Ces valeurs varient beaucoup, mais on ne les mesure habituellement pas.
Sur Verdana, la police triche un peu, puisqu’elle mord sur l’espace normalment réservé au talus supérieur et effectivement les oeils de la famille Nina-Tahoma-Verdana1 sont gros.
Le problème vient aussi de l’absence de support de la propriété CSS font-size-adjust.
Quand vous choisissez une police, les trois critères qui me semblent les plus importants (outre ce dont j’ai parlé dans la section précédente) sont :
font-style:75%, mais on peut inclure toutes les polices qui, pour des raisons parfois tout à fait compréhensibles, ont un œil (et non une taille, comme me le signale Thomas Linard) taille non standard. Verdana, Zapfino, Edwardian Script ITC…Addendum par Thomas Linard
Unicode est la norme qui devait remplacer toutes les autres (ASCII, 8859-15 mais aussi CKJ, arabe, cherokee…) et du coup, Unicode inclut dans son codage des caractères qui ne sont en fait que des glyphes, mais c'est parce qu'un codage de caractères les avait inclus précédemment (par exemple, les romains pleine longueur du CKJ).
times, ’times new roman’, serif et helvetica, arial, sans-serif sont des valeurs terminales : en effet, ces polices bien que (presque) omniprésentes, ne sont vraiment pas belles (dans les deux couples, les polices sont très similaires, ce qui du point de vue de la sécurité est une bonne chose). Malheureusement, dans les deux cas, je ne connais pas de police Unix pour compléter la chaîne.:first-letter).Contact • Mise à jour : 23-oct-04 Optimisé pour tous les navigateurs • XHTML 1.1 & CSS 2 valides