jeudi 27 juin 2013

Un Guide d'utilisation Google Web Fonts

choisir de nouvelles polices
Il n'ya pas si longtemps, les polices à chasse fixe standard étaient la norme dans les ordinateurs. Puis, un jeune Steve Jobs a pris un cours de calligraphie à l'université et ont finalement construit un ordinateur capable de loger des options de police sans fin.
L'Internet a été plus lente à prendre sur la révolution numérique de police. À quand remonte la dernière fois que vous avez pris l'avis d'une police sur un site web? Nous avons les yeux fixés sur les mêmes vieilles polices standard depuis si longtemps que nous négligeons personnaliser la façon dont notre contenu est de la première lettre dactylographiée.
Si vous êtes prêt à prendre la prochaine étape dans la personnalisation de vos polices Web, il ya quelques choses à considérer avant de faire le saut.
Tout d'abord, tout simplement parce que les polices Web peuvent être personnalisés de manière créative ne signifie pas toujours qu'ils le devraient. Votre corps du texte doit être facilement lisible, c'est ce qui rend les polices comme Helvetica ou Arial si populaire. Au lieu de cela, employer des polices créatives et innovantes dans vos titres ou en-têtes d'apporter un peu de personnalité à votre copie.
En utilisant une nouvelle police web nécessite également un peu de codage avant de vous êtes opérationnel. Mais ne laissez pas creuser dans le backend de votre site vous intimider. Un outil comme Google Fonts tient la main tout au long du processus de sélection de la police pour savoir comment insérer le code dans votre site web.
Et le meilleur de tous, il est libre d'utiliser! Voici comment faire pour commencer:

 Back-Up votre site web

Avant de toucher vos polices actuelles, sauvegarde une copie de votre site selon les instructions de votre fournisseur d'hébergement local. Vous ne savez jamais quand vous pourriez frapper un ou une mauvaise touche et le besoin que dernière version.

 2 - Mise en route

Pour choisir la police qui est bon pour votre site, visitez le site Google.com / fonts pour une collection de 629 (et plus) des familles de polices.
Regardez en haut de l'écran et de localiser les pattes lecture "mot, phrase, paragraphe et affiche". Choisissez l'option que vous voulez voir et tapez le vous le "Aperçu texte" champ de texte.
Ensuite, choisissez une taille de police et de commencer à défiler vers le bas pour voir votre texte dans une large variété de polices. Chaque cellule de texte dispose d'une option de police différent allant de Meriweather Sans à Caudex, le rendant facile de comparer et de choisir votre préféré.
google polices 1

 3 - Filtrez vos résultats

Le côté gauche de Google Fonts propose une section «Filtres». Cliquez sur "Toutes les catégories" déroulants et choisir entre serif, sans serif, l'affichage ou l'écriture et cliquez sur "OK" pour voir votre nouvelle preview.
Vous pouvez également sélectionner votre police épaisseur, l'inclinaison, la largeur et script pour personnaliser vos résultats pour trouver le type exact de caractères que vous cherchez.

 4 - Construire votre site Web Google collection de polices

Lorsque vous avez trouvé le style de police parfait, cliquez sur le bouton bleu "Ajouter à la collection". Vous pouvez également personnaliser davantage d'options de police et de constituer une collection d'options différentes qui sont prêtes à l'emploi.
Juste être prudent sur le nombre que vous sélectionnez. Google va finir par prendre toutes les collections de polices que vous choisissez et vous donner un code à insérer dans votre site. S'en tenir à une ou deux polices ou risque faisant baisser la vitesse de votre site.

 5 - Examen

Maintenant, regardez au bas de votre écran. Là, vous verrez votre collection de polices sur le côté inférieur gauche.
Mettez en surbrillance la collection que vous souhaitez voir et cliquez sur "Review" pour voir votre police en action.

 6 - Utilisez votre nouvelle police

Une fois que vous êtes prêt à aller, sélectionnez votre collection de polices et cliquez sur "utilisation" dans le coin en bas à droite de votre écran pour parcourir les options disponibles.
Soyez sûr de vérifier icône pratique de Google qui affiche l'impact estimé de votre nouvelle police sur les temps de chargement des pages et la pointe, «Utilisation de nombreux styles de police peut ralentir votre page Web, de sorte que sélectionner les styles de polices que vous avez réellement besoin sur votre page web."

 7 - Ajouter au Site

Prêt à intégrer votre nouveau Font Web Google dans votre site web? Faites défiler vers le milieu de la page jusqu'à ce que vous voyez l'option "Ajouter ce code à votre site Web."
S'en tenir à l'option standard de copier et coller le code dans l'entête de votre site. Google Fonts vous donnera des instructions pour coller le code que le premier élément de la <head> de votre document HTML. Vous trouverez également des instructions sur la façon d'importer le code dans votre feuille de style ou d'utiliser JavaScript.
google Polices 2

 8 - Intégrer les polices dans votre CSS

Ne vous inquiétez pas de savoir comment les polices vont chercher dans les différents navigateurs. L'API Google Fonts ira de l'avant et de générer spécifique au navigateur CSS à utiliser les nouvelles polices. Cela dit, vous avez toujours besoin d'ajouter le nom de la police à vos styles CSS pour faire fonctionner le tout.
Voici un exemple de style CSS que Google Fonts donne pour vous garder sur la bonne voie:
h1 {font-family: "Metrophobic", Arial, serif; font-weight: 400;}

9 - Testez votre site

Cliquez sur "Enregistrer" et un aperçu de votre site. Si vous ne voyez pas quelque chose de différent, essayez d'ouvrir un autre navigateur ou en désactivant d'abord vos cookies. Vous pourriez regarder une copie en cache de votre site.

10 - Prendre un raccourci

Si vous utilisez un modèle de WordPress pour votre site, pensez à prendre un raccourci rapide et facile. Télécharger le plug-in Google Web Fonts et personnaliser directement vos options de polices à partir de votre tableau de bord WordPress.
Google Fonts ajoute régulièrement de nouvelles options à sa bibliothèque, donc gardez le contrôle en arrière si vous êtes à la recherche d'un style spécifique. Mais ne vous inquiétez pas de manquer si vous utilisez le plugin WordPress. Il vous dira quand une mise à jour est disponible, déclenchant un tout nouveau monde de polices à votre portée.

Aucun commentaire:

Enregistrer un commentaire

Nous vous invitons ici à donner votre point de vue, vos informations, vos arguments. Nous refusons les messages haineux, diffamatoires, racistes ou xénophobes, les menaces, incitations à la violence ou autres injures. Merci de garder un ton respectueux et de penser que de nombreuses personnes vous lisent.
La rédaction

Messages les plus consultés

Inscrivez-vous à notre newsletter pour recevoir les nouveaux articles