Vous avez comme moi toujours été bridé par les limitation des polices de caractères possibles sur le web, du coup , tout vos site finisse en Arial, Verdana ou Georgia ... Comme je vous comprend !
Je viens de découvrir une API de Google qui n'est pas si récente mais qui vaux le détour Google Font Directory. J'ai répertorié 69 polices différentes, dont 58 en Latin (celles qui nous intéresses vraiment).
Google vous propose de choisir et de tester les police avec un utilitaire pour tester vos rédaction... Mais il n'est reste pas moins un peu fastidieux de choisir une a une les polices à tester ...
C'est ici que Font-comparer.com intervient en proposant de tester 24 polices a la fois et vous offre en clic les 2 lignes de codes a utiliser pour les mettre en place ....
Je me devais de vous les expliquer rapidement.
Dans votre balise <head> ... </head> , vous allez faire appel a l'API de Google en lui spécifiant quel police vous souhaitez importer ...
<link href='http://fonts.googleapis.com/css?family=NOM+DE+LA+POLICE&subset=TYPE' rel='stylesheet' type='text/css'>
Le nom de la police et son type se trouve sur l'API de google exemple pour la police Yanone Kaffeesatz dont l'url est :
http://code.google.com/webfonts/family?family=Yanone+Kaffeesatz&subset=latin
Remplacer simplement le début de l'url : http://code.google.com/webfonts/familly? Par http://fonts.googleapis.com/css?
En claire récupérez uniquement les paramètres de l'URL.
Dernière étape placez dans vos CSS le code suivant ( à adapter!)
.VOTRE_CLASSE { font-family:LE NOM DE LA POLICE EN CLAIRE; }
Soit pour notre exemple
.VOTRE_CLASSE { font-family: 'Yanone Kaffeesatz',serif; }
Il s'agit du nom sans les signe "+" mais avec des espaces. Pour être certain de ne pas vous tromper utilisez le site Font-comparer.com en cliquant sur "Get font" qui apparait au passage de la souris sur un police.
Merci presse-citron pour la découverte
Jeu de briques
Snake
Pacman
Bubble
LES COMMENTAIRES (1)
posté le 03 janvier à 17:39
Merci pour l'astuce !