De la police

(voir visualisation)

Lorsque le navigateur de votre visiteur accède à vos pages Web, il ne peut afficher que les polices qui se trouvent sur son propre système.

Lorsque la police que vous avez choisie n'est pas disponible sur la machine du visiteur, la page s'affiche avec la police par défaut du navigateur (généralement le Times New Roman sur les systèmes Windows et le Times sur les systèmes MacOS).

Deux solutions à ce problème :

  • Utiliser pour vos pages Web des polices dont vous êtes (à peu près) certain qu'elles seront disponibles chez tous les visiteurs.
  • Utiliser des images à la place du texte.

Sur certaines pages Web, vous verrez un message du type "Téléchargez et installez la police xxx pour que la page s'affiche correctement". Cette solution est à éviter pour deux raisons :

  • Peu de visiteurs prennent la peine de télécharger et d'installer de nouvelles polices
  • Les polices ne sont presque jamais du "freeware", il est donc illégal de les proposer en téléchargement.

 

Les polices les plus répandues

Choisissez des polices qu'on trouve à coup sûr sur la plupart des systèmes, à savoir :

  • Sous Windows : Times New Roman, Arial et Courier New
  • Sous Mac OS : Times, Helvetica et Courier

Choix restreint permettant cependant de choisir entre trois types de polices :

  • Times et Times New Roman sont des polices à empattements (serif en anglais), d'une lecture agréable pour les documents imprimés, mais plus difficiles à déchiffrer sur un écran d'ordinateur.
  • Arial et Helvetica sont des polices sans empattements ou polices bâtons (sans serif en anglais), plus faciles à lire sur un moniteur .
  • Courier et Courier New sont des polices à chasse fixe (tous les caractères ont la même largeur, comme ceux des machines à écrire), utilisé principalement pour des listings informatiques, ou pour des effets artistiques.

 

Un choix de polices fonction du visiteur

Vous pouvez spécifier une liste de polices. Si le navigateur de l'utilisateur ne trouve pas la première police de votre liste, il essaiera de trouver la deuxième, puis la troisième, etc.

La bonne stratégie consiste donc à définir une liste de polices comme suit :

  • Choisissez une police qui correspond à votre cahier des charges, en veillant tout de même à choisir une police relativement répandue.
  • Choisissez ensuite, dans la liste des polices disponibles sur la quasi-totalié des systèmes (pour Windows comme pour Mac), un police se rapprochant de celle qui conviendrait le mieux.

Exemple :

1. Futura
2. Arial (Windows) ou Helvetica (Mac)

 

Définir des polices pour ses pages Web

Avec un éditeur HTML

La plupart des éditeurs HTML WYSIWYG (Dreamweaver, GoLive, etc.) permettent de choisir la police parmi une liste.
Mais, la plupart des éditeurs HTML simples ne permettent pas de définir une police de substitution. Dans ce cas, sélectionnez la police de votre choix, puis modifiez le code HTML de votre page.

Dans le code HTML

La balise <FONT> concerne la police de caractères, elle intègre plusieurs attributs telles que le nom ou la taille. Utilisez l'attribut face pour préciser une liste de polices. Voici par exemple comment attribuer les polices Futura, Arial et Helvetica :

<FONT face = "Futura, Arial, Helvetica, sans serif">Essai de typo</FONT>

 

Images en tant que texte

Si vous souhaitez utiliser une police "exotique" pour un titre ou une lettrine, vous ne pouvez faire appel au HTML. La solution consiste à créer une image GIF de votre texte dans un logiciel de dessin (Photoshop, Paint Shop Pro), puis à l'insérer en tant qu'image dans votre document.

Veillez à ce que la couleur d'arrière-plan de votre texte soit la même que celui de votre page, n'abusez pas de cette technique : n'oubliez pas que les fichiers image sont toujours plus volumineux que le texte, augmentant ainsi le temps de téléchargement de votre page.

Pour insérer une lettrine dans un paragraphe, utilisez l'attribut align="left" de la balise <IMG> et placez la ligne de code correspondante devant le paragraphe de texte. Si votre image s'appelle lettrine.gif, la ligne HTML correspondante ressemblera à ceci :

<img src="lettrine.gif" width="20" height="24" align="left">

 

Autres possibilités et ressources sur le Web

Il existe deux systèmes permettant d'afficher n'importe quelle police dans le navigateur de l'utilisateur, si celui-ci est assez récent (version 3 ou ultérieure) : TrueDoc, de Bitstream, et OpenType, de Microsoft. Cependant, aucun des deux systèmes n'est entièrement au point.