Google Fonts enfreint le RGPD : Cause, Sanctions, Solutions

RGPD : depuis 2020, les propriétaires de sites internet fulminent contre ses lignes directrices très strictes.

Après les cookies, Google Analytics, voici Google Fonts !

Découvrez, sans plus attendre, pourquoi l’utilisation des Web Fonts Google sur votre site internet n’est pas conforme au RGPD, les sanctions encourues et les solutions pour y remédier.

Qu'est-ce que le RGPD ?

Acronyme de Règlement Général sur la Protection des Données, le RGPD, (en anglais, GDPR), est un règlement, entré en vigueur le 25 mai 2018, obligeant toutes les entreprises à protéger les données personnelles et la vie privée de tous les résidents de l’Union européenne (UE).

Ces règles du RGPD s’appliquent, bien entendu, au monde du web :

Les propriétaires des sites internet doivent spécifier le type de données qu’ils collectent, comment ils les utilisent et comment ils les traitent.
Les visiteurs doivent accepter la politique de confidentialité avant d’accéder à tout contenu du site.
Les visiteurs du site peuvent demander la suppression définitive de toutes leurs données, dans le respect du droit à l’oubli.

Partant d’une idée louable, le RGPD est devenu, avec le temps, un véritable casse-tête pour de nombreux propriétaires de sites web.

Dates symboliques du RGPD

Voici quelques dates symboliques du RGPD applicables dans le monde numérique :

16 juillet 2020 : invalidation du Privacy Shield par la Cour de justice de l’Union européenne (accord régissant le transfert de données depuis l’UE vers les Etats-Unis).
1^er octobre 2020 : Recommandation par la CNIL (Commission nationale de l’informatique et des libertés) sur l’usage de cookies et autres traceurs.
1^er avril 2021 : Mise en application de la réglementation de la CNIL sur le consentement aux cookies (la mise en conformité étant réalisée par l’ajout d’un bandeau cookies).
22 décembre 2021 : L’autorité autrichienne de protection des données (DSB) déclare l’utilisation de Google Analytics illégale, car elle constitue une violation des articles 44 et suivants du RGPD.
20 janvier 2022 : Un tribunal de Munich, en Allemagne, a statué que l’utilisation des Google Fonts enfreint le RGPD, et est donc illégale.
10 février 2022 : Première mise en demeure de la CNIL aux sites web utilisant Google Analytics (la mise en conformité nécessite, pour l’instant, une alternative payante, comme Matomo).
23 juin 2022 : Après l’Autriche et la France, l‘Italie, à son tour, considère l’utilisation de Google Analytics comme illégale.

Nous pouvons, désormais, nous poser la question légitime : À quand le tour de Google Search Console ?

Qu'est-ce que les Google Fonts ?

Google Fonts est une bibliothèque de polices mise à disposition gratuitement par le moteur de recherche Google.

Pour le choix des polices Web, vous pouvez choisir parmi 5 catégories :

Serif (avec empattement).
Sans Sérif (sans empattement).
Display (Affichage).
Handwriting (Écriture manuscrite).
Monospace (Écriture style machine à écrire).

En plus d’une large gamme de 1424 familles de polices de caractères qui embelliront votre site, Google propose également de choisir leurs propriétés afin de rendre votre contenu textuel plus agréable à lire :

Nombre de styles.
Épaisseur.
Inclinaison.
Largeur.

La plupart des Web Fonts Google sont compatibles avec WOFF 2.0 (Web Open Font Format), un format de compression qui permet aux navigateurs Web de charger vos pages plus rapidement.

À noter qu’en 2021, Google a ajouté plus de 2500 icônes à son catalogue Google Fonts.

Quelles sont les Web Fonts Google les plus populaires ?

Les polices Web Google les plus populaires sont :

Source Sans Pro.
Poppins.
Montserrat.
Roboto.
Lora.
Lato.
Open Sans.
Oswald.
Playfair Display.
Nunito Sans.
Raleway.
PT Sans.

Pourquoi l'utilisation des Web Google Fonts n'est-elle pas conforme au RGPD ?

Les Google Web Fonts doivent être hébergées localement sur votre site web. À défaut, leur utilisation est considérée comme non conforme au RGPD.

Et c’est là où le bât blesse !

Pour mieux comprendre le problème, voici les différentes étapes lorsqu’un visiteur arrive sur votre site WordPress ou autre CMS (Shopify, Prestashop, Joomla, Wix, etc) :

Un internaute clique sur votre lien dans les résultats de recherche (SERP) et est dirigé vers une page spécifique de votre site internet.
Pour que votre page s’affiche avec les polices web (Web Fonts) que vous avez choisies, au lieu des polices système Web Safe Fonts (Arial, Helvetica, Times new Roman, Verdana, etc) préinstallées dans tous les systèmes d’exploitation (Windows 11, etc), votre feuille de style (CSS) doit être téléchargée par le navigateur utilisé par votre visiteur (Mozilla, Chrome, Edge, etc).
Les Web Fonts de Google font partie de votre CSS, et vous avez deux choix :
– Soit elles sont hébergées localement sur votre serveur, et donc il n’y a aucun souci aux yeux du RGPD.
– Soit elles ne sont pas hébergées localement, et là, il y a problème !
Dans ce dernier cas (le plus courant à ce jour), le navigateur de votre visiteur demandera automatiquement le fichier Web Fonts aux serveurs de Google.
Ceux-ci utiliseront (et stockeront) l’adresse IP de votre visiteur pour lui envoyer le fichier de polices web.
Votre page web s’affichera telle que vous l’avez conçue grâce à la réception de ce fichier (le navigateur de votre visiteur en profitera pour l’enregistrer dans son cache).

Le problème, au regard du RGPD, est que Google recherchera et stockera automatiquement l’adresse IP (Internet Protocol) de votre visiteur sans son consentement préalable.

RGPD - Sanctions financières

En cas de non-respect des règles du RGPD, vous pouvez faire l’objet d’une sanction pécuniaire plus ou moins importante selon l’infraction constatée.

Le montant des sanctions financières peut atteindre (le montant le plus élevé est toujours retenu) :

20 millions d’euros d’amende.
4 % du chiffre d’affaires annuel mondial.

À noter que dans l’affaire précitée de l’entreprise allemande ayant utilisé, en violation des règles du RGPD, les polices de caractères de Google, l’amende financière a été de 100 euros, et à charge pour elle de se mettre rapidement en conformité.

Solutions

Pour être en conformité avec le RGPD concernant les Google Web Fonts, 2 solutions sont possibles :

Demander un consentement préalable.
Héberger localement vos polices Google.

1. Demander un consentement préalable

La première des solutions pour se conformer au RGPD est de demander à votre visiteur son consentement préalable.

Cela se passe en 5 étapes :

Un internaute clique sur votre lien dans la SERP et atterrit sur la page web souhaitée.
Le contenu de votre page s’affiche avec les Web Safe Fonts.
Une demande de consentement est faite à votre visiteur pour recupérer le fichier des Web Fonts sur les serveurs de Google.
Si votre visiteur refuse, alors votre fichier Web Fonts ne pourra être chargé (l’affichage de votre page restera avec les Web Safe Fonts (pas idéal du tout !).
Si votre visiteur accepte, alors les polices Web se chargeront.

Clairement, avec cette solution, vous êtes sûr d’avoir un taux de rebond de 100%. Et bien entendu, je vous la déconseille fortement.

2. Héberger localement vos polices Google

La deuxième et la meilleure solution pour ne pas enfreindre les directives du RGPD consiste à héberger tous vos polices Google en local sur votre serveur web.

Trois méthodes sont possibles pour héberger vos polices Google en local :

Manuellement.
Via un plugin WordPress.
Via votre thème WordPress OceanWP.

1. Manuellement

La première méthode, pour héberger vos Google Web Fonts localement, consiste à le faire manuellement.

Honnêtement, cela est assez technique et fastidieux à mettre en place.

Je ne m’y attarderai pas, car il existe des tutoriels en ligne qui expliqueront la méthodologie bien mieux que je ne pourrais le faire.

Un des meilleurs tutos est celui de speckyboy.

Ce tuto est en anglais, mais avec le traducteur automatique de Google Chrome, son contenu textuel s’affichera en langue française.

2. Plugin WordPress

Autant la première solution est valable quel que soit le CMS utilisé, autant les deux solutions suivantes sont exclusives au CMS WordPress.

Si vous avez développé votre site sous WordPress, l’hébergement local de vos Google Web Font est très simple.

Tout d’abord, vous pouvez utiliser le plugin gratuit OMGF.

En utilisant l’API Google Fonts Helper, ce plugin WordPress va automatiquement :

Rechercher les polices Web Google chaque fois qu’une requête est adressée à fonts.googleapis.com et fonts.gstatic.com.
Les télécharger et les copier localement sur votre serveur.
Générer une feuille de style pour vos polices web.
La mettre en cache pour accélérer le temps de chargement de votre page web.
Minimiser vos requêtes DNS (Domain Name System).
Etc.

À noter qu’il existe une version payante de ce plugin WordPress : OMGF Pro, à 19€ par an, qui ajoute plusieurs fonctionnalités avancées permettant d’en tirer toute sa quintessence :

Préchargement des fichiers de police au-dessus de la ligne de flottaison (pli).
Suppression des polices Google inutilisées.
Ajouter une pile de polices de secours.
Suppression des requêtes vers fonts.googleapis.com ou fonts.gstatic.com.
Etc.

En utilisant OMGF Pro, votre site sera en conformité avec le RGPD tout en améliorant ses performances d’affichage.

3. Thème WordPress OceanWP

Si vous utilisez le thème WordPress OceanWP, c’est encore plus simple !
À noter que je ne suis pas affilié à OceanWP.

Pourquoi choisir le thème OceanWP ?

Créé en 2016, OceanWP est l’un des thèmes WordPress gratuits les plus populaires et les mieux notés (avec Astra, Hello et GeneratePress) :

+ de 700.000 installations actives.
Noté 5/5 étoiles sur wordpress.org.
5132 avis 5 étoiles.

C’est un thème polyvalent gratuit qui offre plusieurs fonctionnalités professionnelles prêtes à l’emploi, telles que :

Installation d’un modèle de sites web (template) en 1 clic.
100% responsive.
100% personnalisable.
100% compatible avec le langage RTL (Right-to-Left).
100% compatible WPML (thème multilingue).
Optimisé pour le SEO (Search Engine Optimization).
Optimisé pour le commerce électronique (WooCommerce).
Optimisation du codage pour être léger et très rapide.
Développé pour être 100% compatible avec les constructeurs de pages (Elementor, Gutenberg, …).
Etc.

Bien entendu, pour tirer la quintessence de ce thème WordPress, il y a une version PRO qui vous permettra d’obtenir :

14 extensions premium.
210 démos professionnelles.
12 mois de mise à jour des produits Premium.
12 mois d’assistance (très rapide) par e-mail.
Etc.

Les prix de cette version Pro vont de 43$ par an pour 3 sites WordPress à 127$ par an pour 50 sites.

Utilisant depuis 3 ans le thème OceanWP pour vous présenter mes services en tant que consultant SEO / SXO freelance, les témoignages de mes clients, les tarifs SEO que je pratique, etc, je ne peux que vous conseiller de choisir ce thème pour votre blog, votre site vitrine ou votre site e-commerce.

Comment héberger les polices Google localement avec OceanWP ?

Si vous utilisez le thème OceanWP, vous n’avez même pas besoin d’installer le plugin OMGF.
En un seul clic, vos polices Google seront hébergées localement sur votre site web.

La procédure est très facile à réaliser, et cela se déroule en 7 étapes :

Ouvrez votre tableau de bord WordPress.
Dans le menu vertical situé à gauche, cliquez sur Apparence.
Un sous-menu va s’afficher, cliquez sur Personnaliser.
Le menu de personnalisation d’OceanWP s’affiche, cliquez sur Typographie.
Le menu de personnalisation de la typographie de votre thème s’affiche, cliquez sur Général.
Un menu apparait, cochez la case Google Fonts From Site.
Cliquez, enfin sur Publié.

Voilà, c’est terminé !

En activant cette fonctionnalité :

Toutes les Google Fonts que vous avez déjà sélectionnées dans votre section Typographie seront téléchargées sur votre site WordPress et hébergées localement.
Il en est de même pour toutes vos futures polices Google que vous aurez sélectionnées dans l’outil de personnalisation.

OceanWP est l’un des tous premiers thèmes WordPress à disposer d’une fonctionnalité de conformité RGPD intégrée, de sorte que ses utilisateurs n’aient pas à s’exposer à des sanctions financières.

Comment supprimer les requêtes API automatiques à Google ?

Quel que soit la solution retenue, vous devrez interdire, de nouveau, les requêtes API pour vos Google Fonts.

En effet, malgré le fait que vous ayez hébergé vos polices web en local, certaines extensions WordPress peuvent les charger automatiquement sur votre site.

Il faudra, de fait, les désactiver de façon automatique, pour que :

Votre site reste toujours conforme au RGPD.
La vitesse de chargement de vos pages web ne soit pas ralentie.

Cette fonctionnalité est incluse dans le plugin WordPress OMGF en version Pro.

Mais si vous utilisez l’excellent plugin d’optimisation WordPress Autoptimize, en concomitance avec OceanWP, vous n’aurez pas besoin d’acheter OMGF Pro.

Cela est d’une facilité déconcertante et se fait en 6 étapes :

Ouvrez votre tableau de bord WordPress.
Dans le menu de gauche, cliquez sur Extensions, puis sur Extensions installées.
Cliquez sur Réglages de votre extension Autoptimize.
Cliquez sur l’onglet Extra.
Cochez la case Retirer les polices Google ?.
Cliquez, enfin, sur Enregistrer les modifications.

Voilà, vous avez définitivement désactivé les requêtes API automatiques pour récupérer vos Google Fonts.

Comment vérifier que les requêtes API Fonts ont bien été désactivées ?

Il est toujours utile de vérifier les manipulations quelles qu’elles soient, surtout lorsque le RGPD est en jeu, et avec toutes les conséquences financières qui peuvent en découler.

Dans le cas qui nous intéresse, il faudra procéder en deux temps :

Vérification de l’existence de requêtes Api Google Fonts.
Vérification de l’hébergement local en concomitance avec l’arrêt des requêtes API Google Fonts.

1. Vérification de l'existence de requêtes Api Google Fonts

Pour vérifier si votre thème effectue des requêtes API pour vos polices Web Google, cela se fait avec Chrome DevTools.

Cela se déroule en 7 étapes :

Ouvrez une nouvelle fenêtre de navigation privée dans Google Chrome.
Videz votre cache avec un plugin de cache WordPress, tel que WP Fastest Cache.
Lancez votre site (peu importe la page web).
Cliquez sur le bouton droit de votre souris.
Un menu déroulant va s’afficher, cliquez sur Inspecter.
Sur la droite, la fenetre d’affichage de Chrome DevTools va s’ouvrir, cliquez sur l’onglet Sources.
Sur la gauche, va s’afficher différents serveurs à partir desquels vos fichiers CSS sont chargés. Parmi eux, il y a ceux de Google Fonts : fonts.googleapis.com et fonts.gstatic.com.

Cela indique bien que votre site web effectue des requêtes API pour aller récupérer les polices Web Google.

2. Vérification de l'hébergement local de vos Google Fonts

On va répéter la même procédure, mais après, bien sûr, avoir mis en œuvre l’une des méthodes proposées précédemment.

Cela se passe toujours avec Chrome DevTools, et se fait en 7 étapes :

Ouvrez une nouvelle fenêtre de navigation privée dans Google Chrome.
Videz votre cache avec un plugin de cache WordPress, tel que WP Fastest Cache.
Lancez votre site (peu importe la page web).
Cliquez sur le bouton droit de votre souris.
Un menu déroulant va s’afficher, cliquez sur Inspecter.
Sur la droite, la fenetre d’affichage de Chrome DevTools va s’ouvrir, cliquez sur l’onglet Sources.
Sur la gauche, va s’afficher différents serveurs à partir desquels vos fichiers CSS sont chargés. Mais là, les serveurs de Google fonts.googleapis.com et fonts.gstatic.com ne sont plus présents.

Cela indique bien que votre site Web ne fait plus de requêtes API pour récupérer Google Web Fonts, et s’il s’affiche correctement, alors vos Google Fonts sont bien hébergés localement.

Quel est l'impact de l'hébergement local des Web Google Fonts sur la vitesse d'affichage ?

Il est intéressant de voir l’impact de l’hébergement local de vos Web Google Fonts.

En effet, l’annonce officielle par Google en 2020 de ses signaux de qualité Core Web Vitals (son véritable déploiement a eu lieu en juin 2021) a rendu la vitesse de chargement des pages Web très importante pour deux raisons :

Au niveau SEO : en devenant un léger critère de positionnement de vos pages sur la SERP de Google.
Au niveau UX (expérience utilisateur) : en étant une véritable cause d’un taux de rebond élevé.

Les Core Web Vitals se composent de trois métriques :

Largest Contentful Paint (LCP).
First Input Delay (FID)
Cumulative Layout Shift (CLS).

La métrique qui nous intéresse, dans le cas présent, est le LCP.

Largest Contentful Paint (en français, la plus grande peinture de contenu) mesure le temps qu’il faut à votre page web pour afficher le contenu le plus grand (image, vidéo ou bloc de texte) à l’écran de votre visiteur.
Google ne prenant en compte que le contenu au-dessus du pli.

Pour offrir une bonne expérience utilisateur, le LCP doit être<2.5 secondes.
Au-delà de 4 secondes, il sera impératif de trouver la cause et de la supprimer.

Temps de chargement de la page web avant l'hébergement local des Google Fonts

Logiquement, vos pages web devraient se charger plus rapidement car les requêtes adressées à fonts.googleapis.com et fonts.gstatic.com pour récupérer vos fichiers CSS seront supprimées.

En choisissant la fonctionnalité d’hébergement local, en 1 clic, d’OceanWP, le thème nous indique que le temps de chargement des polices web dépendra de votre site internet.

Il est donc important d’aller voir, avec GTmetrix, comment cela impacte le temps de chargement de vos pages web.

Pour l’exemple, je vais utiliser mon site internet.
À savoir également qu’il est hébergé chez O2switch, l’excellent hébergeur web français.

Nous pouvons oberver que la page d’accueil de mon site internet a :

Un LCP de 879 ms.
Un temps de chargement complet (Fully Loaded Time) de 1.6 secondes.

C’est un bon résultat, mais sans être excellent non plus.

Temps de chargement de la page web après l'hébergement local des Google Fonts

Voyons maintenant les résultats après avoir héberger Google Fonts localement via OceanWP et Autoptimize.

Nous pouvons constater que la page d’accueil de mon site internet a maintenant :

Un LCP de 1.2 s.
Un temps de chargement complet (Fully Loaded Time) de 1.8 secondes.

Le résultat s’est dégradé, mais pas au point d’être catastrophique.

Je pense qu’avec le plugin OMGF Pro, les résultats auraient été meilleurs, mais bon le principal est d’être, sous réserve d’un avis juridique, en conformité avec le RGPD.

Conclusion

Le RGPD est une législation qui complique la tâche des propriétaires de sites web, car les règles sont complexes.

Cependant, si vous utilisez WordPress, le plugin OMGF Pro ou l’association OceanWP et Autoptimize, le problème de légalité des polices web de Google ne sera plus qu’un lointain souvenir.

Si vous avez aimé cet article sur le RGPD et les Google Web Fonts, laissez-moi un petit commentaire.

Mise à jour

Les créateurs de la célèbre extension WordPress de typographies des polices Google ont développé un outil Google Fonts Checker qui vous permet de savoir en 1 clic si vos polices de caractères sont hébergées localement ou chez Google.

Vous n’avez juste qu’à renseigner votre URL de nom de domaine et cliquez sur Vérifier le Site Web.

Si vos polices Google sont hébergement localement, l’outil vous indiquera « Connexion Google Fonts introuvable ».

À l’inverse, si vos Fonts Google sont hébergées chez Google, vous aurez un message précédé d’une croix rouge « Connexion Google Fonts trouvée », et par conséquent, vous serez en violation du RGPD.