Comment utiliser d’autres fonts sur son site

Fonts disponibles en standard

La majorité des sites internet utilisent les fonts suivantes:

• Arial / Helvetica
• Courier New / Courier
• Times New Roman / Times

Ces fonts ont l’avantage d’être multiplateformes, Windows, Mac et Linux sauront affichés ces sites web sans problème. D’autres fonts de ce type existent mais sont moins utilisées:

• Avant Garde
• Bookman
• Garamond
• Palatino

Windows et Mac proposent d’autre fonts encore qui ne sont pas gérés par Linux:

• Arial Black
• Comic Sans MS
• Impact
• Georgia
• Trebuchet MS
• Verdana

Mais qu’en est il, lorsqu’on veut pouvoir ajouter ses propres polices sur son site web?

Utiliser des fonts non standards

La solution à ce problème se trouver dans l’utilisation de @font-face dans votre fichier CSS, exemple:

@font-face {
	font-family: 'MyFont';
	src: url('MyFont.eot');
}
@font-face {
	font-family: 'MyFont';
	src: url('MyFont.ttf') format('truetype');
}
 
body,html {font-family:"MyFont";}

La partie avec la font :

• « .eot » est pour IE
• « .ttf » est pour les autres navigateurs

Votre site utilise maintenant d’autres fonts que celles disponibles par défaut.

Sites utiles

• http://onlinefontconverter.com/: site permettant de convertir n’importe quelle font dans n’importe quel format,
• http://www.dafont.com/: site regroupant énormément de fonts.

No related posts.