[Webdesign] 21 fontes « sûres » pour le web

Les termes « Web Safe Fonts » ou en français « fontes sûres pour le web » désignent les fontes pour lesquelles il y a de grandes chances qu’elles soient installées sur une majorité de machines.

Autrement dit, en utilisant une « Web Safe Font » pour votre site, vous êtes quasiment sûr qu’elle sera affichée telle que définie, sur le navigateur d’une majorité d’internautes.

Car il faut savoir que toutes les fontes ne sont pas installées sur tous les OS. Il en existe des spécifiques sur les Mac, Linux et autres Windows. Si vous les utilisez, vous prenez le risque qu’elles ne puissent être affichées, et donc qu’elles soient remplacées par une autre.

 
Les feuilles de styles CSS définissent les types de fontes et leurs priorités dans l’utilisation :

font-family: Arial, Helvetica, Verdana, sans-serif;

Ici, la police Arial sera utilisée en priorité, puis si elle n’existe pas, Helvetica sera essayée, et enfin Verdana. En cas d’échec, une police sans-serif sera utilisée.

 
Voici une sélection de 21 fontes dites sûres pour le web.
 

Serif

Les fontes avec « sérifs » sont des polices dont les caractères présentent des empattements, de petites terminaisons pointues.

 

font-family:’Georgia’, serif;
 

 

font-family: ‘Palatino Linotype’, ‘Book Antiqua’, Palatino, serif;
 

 

font-family: ‘Times New Roman’, Times, serif;
 

 

font-family: ‘MS Serif’, ‘New York’, sans-serif;
 

 

font-family: Garamond, serif;
 

 

font-family: ‘Bookman Old Style’, serif;
 

Sans-Serif

Les fontes sans sérifs comportent des caractères lisses et droits, sans empattements.

 

font-family: Verdana, Geneva, sans-serif;
 

 

font-family: Arial, Helvetica, sans-serif;
 

 

font-family: ‘Arial Black’, Gadget, sans-serif;
 

 

font-family: ‘Arial Narrow’, sans-serif;
 

 

font-family: Symbol, sans-serif;
 

 

font-family: Impact, Charcoal, sans-serif;
 

 

font-family: Tahoma, Geneva, sans-serif;
 

 

font-family: Century Gothic, sans-serif;
 

 

font-family: ‘Lucida Sans Unicode’, ‘Lucida Grande’, sans-serif;
 

 

font-family: ‘Trebuchet MS’, Helvetica, sans-serif;
 

 

font-family: ‘MS Sans Serif’, Geneva, sans-serif;
 

Monospace

Les fontes monospaces proposent des caractères dont la largeur est la même, quel que soit le caractère. très pratique pour maitriser l’espace.

 

font-family: ‘Courier New’, Courier, monospace;
 

 

font-family: Courier, monospace;
 

 

font-family: ‘Lucida Console’, Monaco, monospace;
 

Cursive

Les fontes cursives désignent les polices qui reproduisent l’écriture manuscrite.

 

font-family: ‘Comic Sans MS’, cursive;
 
 
 
En utilisant l’une de ces fontes, vous avez 9 chances sur 10 (à la louche) que votre site s’affiche de la même manière, quel que soit l’OS.

Sinon, vous pouvez utiliser CSS3 et son fameux @font-face. Là plus de problème puisque la fonte est téléchargée directement sur votre ordinateur si vous ne l’avez pas. Pas contre, pour en profiter, il faut un navigateur compatible CSS3.

crédits : webhostingsearch