Un guide de l'API de polices Google

Les concepteurs de sites Web se réjouissent alors que le Web devient plus esthétique en raison des récents progrès de la technologie des polices.

Tout cela grâce à ce qu'on appelle les polices Web, qui sont un ensemble d'outils pouvant être utilisés pour intégrer des polices sur des pages Web. Ils sont un outil important pour les développeurs, car ils leur permettent de créer des sites Web uniques et attrayants. Nous ne sommes plus obligés d'utiliser Ariel ou Times New Roman pour chaque projet Web !

Le guide suivant vous expliquera en détail comment utiliser l'API Google Font pour implémenter des polices Web. La ressource est gratuite et facile pour toute personne ayant accès à Internet, cela vaut donc la peine de profiter de cet excellent outil !

Un guide de l'API Google Font

L'API Google Font est un ensemble d'outils qui peuvent être utilisés pour intégrer des polices sur des pages Web. C'est un outil important pour les développeurs, car il leur permet de créer des sites Web uniques et attrayants. Les polices Google sont un moyen rapide et facile d'ajouter des polices à votre site sans avoir à effectuer de programmation compliquée. Saisissez simplement une chaîne de texte et choisissez la police que vous souhaitez utiliser, puis – le tour est joué ! Instantanément, votre site Web est mis à jour avec une belle typographie.

Avantages de l'utilisation de l'API Google Font

Si vous souhaitez utiliser l'API Font de Google, elle possède un certain nombre de fonctionnalités très utiles.

Continuez à utiliser du texte HTML

La typographie Web est une entreprise sérieuse, et il devient de plus en plus difficile d'atteindre l'équilibre parfait entre l'esthétique et l'optimisation des moteurs de recherche. Heureusement, @font-face peut vous aider ! Contrairement à l'utilisation d'images ou de remplacement d'image d'arrière-plan CSS comme solutions pour une typographie Web plus jolie, cette méthode a été prouvée par les chercheurs de Google comme étant conviviale pour le référencement.

Accessible sur le Web

Contrairement aux images CSS, le texte HTML peut être lu par les lecteurs d'écran, il n'affectera donc pas les personnes qui les utilisent.

Rapide et facile

Tout ce que vous aurez à faire est de référencer la police de votre contenu, puis d'ajouter des paramètres CSS pour déterminer comment elle doit apparaître à l'écran. Une fois configurés, ces codes sont également faciles à modifier ! L'API Google Font gère les bizarreries des navigateurs Web, gère plusieurs types de fichiers et facilite la compréhension de @font-face.

Utilisation gratuite

Les polices Google sont gratuites et ont été sauvegardées par Google. Cela signifie que vous pouvez concevoir votre site Web en toute confiance sans aucun risque d'avoir des problèmes pour utiliser une police que vous ne devriez pas.

C'est bien car cela réduira le coût total de votre site Web. Si vous êtes curieux de savoir combien peut coûter un site Web typique, consultez notre article de blog Combien coûtera mon site Web pour voir quel genre de budget vous devrez vous constituer pour avoir votre site Web parfait !

Rapide et fiable

Lorsque votre navigateur charge une page Web, il vérifie le cache de l'utilisateur pour voir s'il contient des polices utilisées sur d'autres sites. Si tel est le cas, cela accélère les temps de chargement des pages, car la police sera déjà disponible dans leur cache Web et n'aura pas besoin d'être rechargée à partir du serveur.

Un choix énorme

Avec plus de 850 polices différentes à portée de main, vous serez en mesure de trouver la police parfaite pour votre dernier projet. Vous pouvez utiliser le répertoire de polices Google pour rendre la recherche rapide et sans tracas.

L'utilisation de l'API Google Fonts peut être un énorme indicateur d'un site Web bien pensé ! Au-delà de cela, nous avons une liste de 10 autres caractéristiques de la conception Web haut de gamme que vous voudrez peut-être imiter sur votre site Web.

Comment utiliser l'API de polices Google ?

Pour utiliser les polices Google dans votre document HTML, vous devez d'abord référencer la feuille de style CSS en l'ajoutant à l'intérieur des balises <head>. Assurez-vous que cette référence est incluse sur chaque page sur laquelle vous souhaitez que la police apparaisse. Avec WordPress, vous pouvez le faire en ajoutant la référence au modèle de thème.

 <title>Home Page</title> <link rel="stylesheet" type="text/css" href="http://fonts.googleapis.com/css?family=FontName"> </head>

Il est maintenant temps d'utiliser CSS pour spécifier comment vous souhaitez utiliser votre nouvelle police. Vous utiliseriez le code suivant si vous souhaitez que tous vos H1 aient la police Google :

 h1 { font-family: 'FontName', serif; font-size: 12px; }

Avez-vous remarqué que j'ai également inclus la police serif? J'ai fait cela car il est conseillé d'avoir une police de secours. Fondamentalement, cela signifie que le navigateur utilisera automatiquement la police serif en cas de problème avec la police Google.

Outils de police Google

La plate-forme de polices de Google a créé de nombreux outils pour vous faciliter la tâche. Vous pouvez utiliser Font Directory, Previewer et Web Font Loader qui sont tous contrôlés par l'API Google. Ci-dessous, nous donnerons un aperçu de chaque outil en détail afin que toute personne passionnée par les polices puisse se lancer !

Répertoire de polices Google

Avec autant de polices parmi lesquelles choisir, il peut être difficile de trouver celle qui convient le mieux à votre projet. Heureusement, Google a compilé une liste de toutes leurs polices dans un répertoire facilement accessible où vous pouvez commencer à choisir la police qui vous convient ! Lorsque vous cliquez sur l'onglet "Obtenir le code", il vous montrera une liste de codes qui peuvent être copiés et collés pour faire fonctionner cette police.

Aperçu des polices Google

Avec Google Font Previewer, vous pouvez voir à quoi ressemble chaque police et la modifier à votre guise. Vous avez une variété d'options avec la taille, le style (variante) et l'espacement !

Chargeur de polices Web

Les développeurs Web peuvent désormais avoir plus de contrôle sur leurs polices Google à l'aide d'une bibliothèque JavaScript. Le développeur peut lier un écouteur d'événement à n'importe quelle étape de la séquence de chargement des polices et ajouter des fonctionnalités en fonction de ce qui se passe à chaque phase.

Qui crée les polices ?

Google Fonts est un projet open source qui donne aux gens la possibilité d'utiliser ces polices gratuitement. La variété des types de polices disponibles aujourd'hui est due à la communauté mondiale de designers et de fondeurs.

Qu'y a-t-il pour Google ?

Google aime les données ! Les liens de l'API Google Fonts peuvent être trouvés sur de nombreux sites Web et chacun d'eux représente une chance pour Google d'exploiter plus de données. Mais nous pouvons être reconnaissants que leur travail ait résolu un autre problème pour les internautes.

Conclusion

En conclusion, Google Font API est un outil puissant pour les développeurs et les concepteurs qui peut aider à créer des sites Web uniques et attrayants. Il est également facile à utiliser - donc si vous cherchez à ajouter de la variété à la conception de votre site Web ou à expérimenter des polices dans votre dernier projet, nous vous recommandons fortement de l'essayer !