Au moment où nous écrivons cet article, il y a 884 familles de polices Google disponibles gratuitement. Ça fait beaucoup de choix ! C’est pourquoi vous cherchez peut-être quelqu’un pour vous aider à trouver cette aiguille dans une botte de foin avec une liste des meilleures polices Google.

Nous l’avons pour vous, puis nous partagerons également quelques bonnes pratiques pour l’utilisation des polices Google sur WordPress.

Le choix d’une police est plus qu’un simple choix esthétique – il peut avoir un effet réel sur les taux de rebond et les taux de conversion de votre site, surtout si vous choisissez une police qui est difficile à lire pour vos visiteurs.

Fondamentalement, il est préférable de prendre un peu de temps pour choisir la meilleure famille de polices Google pour votre site Web, plutôt que d’afficher la première police que vous voyez !

Les 10 meilleures polices Google pour 2019 – Selon la sagesse de la foule

Alors, comment pouvez-vous dresser une liste des meilleures polices de caractères Google alors qu’une si grande partie de cette liste est subjective ? Nous ne voulons pas que toute cette liste soit subjective, alors nous allons aller aux données pour construire une liste des meilleures polices Google.

Fondamentalement, nous utiliserons l’analyse Google Fonts pour faire confiance à la sagesse des foules. Avec plus de 23 billions de vues de polices de caractères au total, Google a juste un peu de données à extraire. 😉

Ensuite, nous irons un peu plus loin que les chiffres bruts de popularité et choisirons des polices en plein essor qui se développent rapidement. Prêt ? Plongeons dans….

1. Roboto

Police Google Roboto

Police Google Roboto

Roboto est une offre sans empattement de Christian Robertson qui a été développée par Google comme police système pour Android. Elle est maintenant massivement populaire, se décline en 12 styles différents, et fait de multiples apparitions sur les analyses de Google Fonts. Par exemple, Roboto est la police la plus populaire. Mais Roboto Condensed est aussi la sixième police la plus populaire, et Roboto Slab fait également une apparition au numéro 13 !

2. Open Sans

Police Google Open Sans

Police Google Open Sans

Open Sans est une police sans empattement développée par Steve Matteson. Google utilise Open Sans sur certains de ses sites Web, ainsi que dans ses publicités imprimées et Web.

3. Lato

Police Google Lato

Police Google Lato

Lato est une autre offre sans empattement populaire, cette fois de Łukasz Dziedzic.

4. Slabo 27px/13px

Police Google Slabo

Police Google Slabo

Slabo est une police à empattement développée par John Hudson de Tiro Typeworks. La particularité de cette police est qu’elle est spécialement conçue pour être utilisée à une certaine taille – soit 27px ou 13px selon vos besoins.

5. Oswald

Police Google Oswald

Police Google Oswald

Oswald est une police sans empattement développée à l’origine par Vernon Adams.

6. Source Sans Pro

Police Google Source Sans Pro

Police Google Source Sans Pro

Source Sans Pro est une police sans empattement de Paul Hunt qui a été créée pour Adobe et a été la première police open-source d’Adobe.

7. Montserrat

Police Google Montserrat

Police Google Montserrat

Montserrat est une police sans empattement de Julieta Ulanovsky, qui vit dans le quartier éponyme de Montserrat à Buenos Aires. Avec 18 styles différents, vous avez beaucoup de choix.

8. Raleway

Police Google Raleway

Police Google Raleway

Avec 18 styles différents, Raleway est une autre police sans empattement de grande famille, initialement créée par Matt McInerney. Si vous aimez Raleway et recherchez quelque chose d’unique, Raleway Dots offre un style similaire avec une approche pointillée qui peut fonctionner pour les gros titres.

9. PT Sans

Police Google PT Sans

Police Google PT Sans

PT Sans a été développé pour les types publics de la Fédération de Russie et, en tant que tel, comprend à la fois des caractères latins et cyrilliques. Il existe également plusieurs autres polices de caractères dans la famille PT, y compris certaines avec options d’empattement.

10. Lora

Police Google Lora

Police Google Lora

Lora est une police de caractères à empattement populaire qui est conçue pour bien fonctionner à l’écran et à l’impression.

Polices Bonus + Up-And-Comers

Selon les chiffres, les dix polices ci-dessus sont les plus populaires de Google Fonts. Mais le fait de n’afficher que les options les plus populaires ne rend pas service aux polices les plus prometteuses qui n’ont pas eu l’exposition nécessaire pour apparaître dans les analyses.

Voici quelques-unes de nos favorites qui n’ont pas fait leur apparition au sommet de l’analyse.

11. Noto Sans / Serif

Police Google Noto Sans

Police Google Noto Sans

Noto est une police commandée par Google qui existe en version avec ou sans empattement. Elle reçoit régulièrement des mises à jour, et il y a maintenant plus de 100 polices Noto, avec de plus en plus de polices à venir tout le temps !

12. Nunito Sans

Police Google Nunito Sans

Police Google Nunito Sans

Nunito Sans est une option sans empattement qui gagne rapidement en popularité (son utilisation a triplé depuis l’an dernier).

13. Concert One

Police Google Concert One

Police Google Concert One

Concert One est un caractère arrondi et grotesque qui fait une option stellaire pour les gros titres.

14. Prompt

Police Google Prompt

Police Google Prompt

Prompt est une offre sans empattement de la société thaïlandaise Cadson Demak.

15. Work Sans

Police Google Work Sans

Police Google Work Sans

Work Sans est une police sans empattement optimisée pour une utilisation sur écran. Les concepteurs recommandent d’utiliser les modèles à poids moyen pour tout ce qui va de 14px à 48px.

Comment créer les meilleures combinaisons de polices Google

Si vous pensiez qu’il était difficile de choisir une police dans Google Fonts, attendez d’essayer de les jumeler sur votre site ! Heureusement, ce n’est pas un problème que vous devez résoudre vous-même, sauf si vous le voulez. Il y a plusieurs façons de trouver les meilleures combinaisons de polices Google.

Tout d’abord, le site Web Google Fonts lui-même vous proposera des paires populaires si vous faites défiler la page vers le bas :

Où trouver les paires de polices Google

Où trouver les paires de polices Google

Au-delà de cela, vous pouvez également utiliser un site comme Font Pair pour obtenir plus de suggestions.

Meilleures pratiques pour l’utilisation des polices Google sur WordPress

Une fois que vous avez trouvé les polices parfaites de Google Fonts, voici quelques bonnes pratiques pour utiliser les polices Google sur WordPress.

Limiter le nombre de poids de police que vous utilisez

Certaines de ces polices – comme Montserrat et Raleway – sont disponibles avec 18 poids de police différents. Bien que cela soit bon pour vous donner le choix, vous ne voulez pas charger les 18 poids sur votre site WordPress car cela ralentira vos temps de chargement. C’est très important !

Pour la plupart des polices, une bonne règle empirique est d’utiliser 3 poids au maximum :

Vous avez des problèmes de temps d'indisponibilité et de WordPress ? Kinsta est la solution d'hébergement conçue pour vous faire gagner du temps ! Découvrez nos fonctionnalités
  • Regular
  • Italic
  • Bold

Beaucoup de sites WordPress que nous voyons de nos jours sautent même l’italique et se contentent d’aller avec 2 poids de police différents. Si vous intégrez vous-même les polices Google, vous pouvez choisir exactement les poids à inclure dans l’onglet Personnaliser dans Google Fonts :

Comment choisir les styles de polices Google

Comment choisir les styles de polices Google

La plupart des thèmes WordPress d’aujourd’hui incluent des façons simples de choisir les polices et les poids Google que vous souhaitez utiliser. Mais tous les développeurs de thèmes ne se concentrent pas sur la performance. Ainsi, dans certains cas, il peut être préférable de désactiver les polices Google dans votre thème et de les ajouter vous-même.

Les polices variables commencent également à devenir populaires et sont supportées par tous les navigateurs modernes. Celles-ci sont impressionnantes parce qu’elles permettent à un fichier de police de se transformer simplement avec des propriétés différentes. Cependant, il n’y a pas encore beaucoup de polices gratuites à choisir. Cependant, Google a quelques polices variables dans Early Access.

Envisagez d’héberger les polices Google localement

Comme alternative à la mise à disposition de polices à partir du serveur Google, vous pouvez également héberger des polices localement, ce qui peut offrir des avantages en termes de performances. Bien qu’il ne faut pas oublier que la plupart des polices Google sont probablement déjà mises en cache dans les navigateurs des utilisateurs. Nous vous recommandons donc de faire vos propres tests de performance.

Si vous utilisez une police premium autre que les polices Google, comme la police « Brandon » que nous utilisons sur notre site Kinsta, alors bien sûr les héberger localement (et les servir depuis votre CDN) est la meilleure chose à faire.  Pour en savoir plus à ce sujet, consultez nos articles sur la façon d’héberger des polices localement.

Choisissez une police qui recevra des mises à jour

Les polices sont comme les plugins et les thèmes WordPress – avec le temps, elles reçoivent des mises à jour et des améliorations pour les rendre encore meilleures. Et même si les enjeux sont loin d’être aussi importants qu’avec les plugins WordPress, il peut quand même être avantageux de choisir une police qui reçoit des mises à jour régulières. La famille Noto de Google est une famille qui a reçu des mises à jour régulières depuis 2014.

Comme la plupart des polices de cette liste sont populaires, il y a fort à parier que toutes les polices de cette liste seront régulièrement mises à jour et améliorées. Et si vous décidez de sortir de la liste, s’assur que la police que vous choisissez est assez populaire pour attirer l’attention n’est jamais une mauvaise idée.

N’oubliez pas l’accessibilité

Selon l’Organisation mondiale de la santé, en 2017, environ 253 millions de personnes vivaient avec une déficience visuelle : 36 millions sont aveugles et 217 millions ont une déficience visuelle modérée à sévère.

Lorsque vous utilisez les polices Google, vous avez la possibilité de contrôler l’apparence avec le CSS, comme la couleur et la taille. N’oubliez donc pas de suivre les Directives pour l’accessibilité aux contenus Web (WCAG) 2.0. Ainsi, votre contenu sera facilement accessible à tous.

Le respect de ces lignes directrices rendra le contenu accessible à un plus large éventail de personnes handicapées, y compris les personnes aveugles et malvoyantes, les personnes sourdes et malentendantes, les personnes ayant des troubles d’apprentissage, des limitations cognitives, des mouvements limités, des troubles du langage, la photosensibilité et leurs combinaisons.

Une ligne directrice très importante est le contraste des couleurs. Sur une conception plus ancienne du site Web de Kinsta, notre police de caractères était un peu trop légère et les visiteurs ont exprimé leurs inquiétudes car elle rendait la lecture difficile. La dernière chose que vous voulez faire est de publier un contenu incroyable et que cela devienne une contrainte pour les yeux des gens !

Vous pouvez utiliser un outil comme Color Contrast Checker de WebAIM pour voir si les couleurs de vos polices passent les recommandations officielles. Ci-dessous vous pouvez voir que les couleurs de nos articles de blog ont maintenant passé le test. 👍

Outil de contrôle du contraste des couleurs

Outil de contrôle du contraste des couleurs

Quelle est votre police préférée chez Google Fonts ?

Google Font est génial et utilisé par des millions de sites Web sur le Web tous les jours. Suivre les meilleures pratiques telles que limiter le poids des polices, les héberger localement (dans certains cas), et suivre les directives d’accessibilité, vous assurera une meilleure expérience globale pour vos visiteurs.

Passons maintenant à vous tous – quelles sont vos polices et paires de polices préférées de Google Fonts ? Faites-nous le savoir ci-dessous dans les commentaires.

51
Partages