Police personnalisée tous navigateurs

Nous allons ici utiliser la règle CSS @font-face.
Comment afficher une police de caractères de notre choix (c'est à dire qui n'est pas dans les polices systèmes comme la Arial, Helvetica...)?
Comme rien est simple, voici le tableau de correspondance navigateur / format de police (en bas d'article):
http://typographisme.net/post/Les-formats-de-polices-typographiques-pour-le-Web
Pour résumer, il nous faudra au total les formats SVG (Vectoriel), TTF (TrueType) et EOT (pour Internet Explorer).
Afin de convertir votre police d'un format à l'autre, vous pouvez utiliser ce site:
Free Online Font Converter
Pour convertir en EOT, utilisez le freeware EOTFast
Enfin, niveau CSS, cela marche en une étape (l'exemple ici utilise la police Legion Slab):
1. Déclaration du CSS, séparée pour IE (EOT) et les autres navigateurs (SVG et TTF):

@font-face {
    font-family: "Legion_Slab";
    src: url('Legion_Slab.eot'); /*IE*/
    src: url('Legion_Slab.ttf') format("truetype"), /*Firefox, Chrome, Safari, Opera*/
	url('Legion_Slab.svg') format("svg"); /*iOS*/
}
body {
	font-family: "Legion_Slab";
}

h1 {
	font-size: 72px;
	font-family: "Legion_Slab";
}