Je ne suis pas un expert en typographie, mais utiliser les mêmes polices standard pour votre site Web devient ennuyeux. Google Web Fonts possède une bibliothèque complète de polices hébergées que vous pourrez utiliser dans votre prochain projet Web. Ce didacticiel de recettes techniques explique comment configurer les polices Web de Google sur votre site.
1 Navigateur sur http://www.google.com/webfonts/
2 Parcourez toutes les polices et trouvez celle que vous souhaitez utiliser. Vous avez la possibilité d'utiliser une seule famille de polices ou d'en utiliser plusieurs. Tout d’abord, voyons comment utiliser une famille de polices seule. Commencez par sélectionner le lien «Utilisation rapide».
3 Vous verrez des informations telles que le temps de chargement de la page en utilisant cette police Web. N'oubliez pas que le navigateur devra vérifier le serveur de Google pour récupérer la police et l'afficher aux visiteurs. A l'étape 3, nous avons 3 options pour utiliser ces polices. Nous pouvons utiliser un lien standard, @import ou Javascript. Cela dépend des préférences personnelles, mais j'utilise simplement l'attribut de lien standard.
4 Maintenant, copiez et collez le code dans l'en-tête de votre site Web, comme vous le feriez avec un lien vers une feuille de style CSS.
5 Nous avons maintenant la police liée à notre site Web. Nous devons définir l'un de nos attributs de style pour pouvoir utiliser la police. C'est aussi simple que de déclarer la famille de polices, mais en utilisant le nom de votre nouvelle police. N'oubliez pas d'utiliser une police de secours Web sécurisée.
6 Le voici en action.
7 Pour lier plusieurs familles de polices, sélectionnez “Ajouter à la collection” sur les polices souhaitées, au lieu de l'option Utilisation rapide.
8 Vous pouvez le faire pour autant de polices que vous le souhaitez. Cependant, rappelez-vous que cela peut augmenter votre temps de chargement de page. Lorsque vous avez toutes les polices souhaitées, sélectionnez Utilisation en bas à droite du site.
9 Le code vous sera à nouveau attribué, sauf que cette fois, toutes les polices seront combinées en une seule instruction de lien. Mettez le code dans votre en-tête et appelez votre contenu de la même manière qu'à l'étape 4.
