Google Fonts RGPD : stopper la fuite d'adresses IP

Chaque fois qu'un internaute visite votre site web, son navigateur télécharge les polices que votre site utilise. Si ces polices proviennent des serveurs de Google, l'adresse IP de votre visiteur est envoyée à Google aux États-Unis.

Un tribunal allemand a jugé en janvier 2022 que cette pratique viole le RGPD. Le propriétaire du site a été condamné à verser 100 euros et a reçu l'ordre de cesser.

L'amende était modeste. Le précédent ne l'était pas.

Ce qui s'est passé devant le tribunal allemand

Le 20 janvier 2022, le Landgericht München, le tribunal régional de Munich, a jugé dans l'affaire Az. 3 O 17493/20 qu'un exploitant de site web violait le RGPD en utilisant Google Fonts chargé depuis le CDN de Google sur fonts.googleapis.com.

Les faits étaient simples. Un visiteur a ouvert le site web. Le site a récupéré les polices depuis les serveurs de Google. Google a reçu l'adresse IP du visiteur. Le visiteur n'avait pas donné son consentement à ce transfert de données.

Le tribunal a constaté deux violations :

Premièrement, l'adresse IP du visiteur est une donnée à caractère personnel au sens de l'article 4 du RGPD. Ce n'est pas nouveau. La CJUE l'a établi dès 2016 dans l'arrêt Breyer C-582/14.

Deuxièmement, transférer cette donnée personnelle vers les serveurs américains de Google sans le consentement du visiteur viole l'article 6 du RGPD. Le tribunal a explicitement rejeté l'argument selon lequel le chargement de Google Fonts servirait un « intérêt légitime ». Des conclusions similaires ont été tirées par l'APD belge (Autorité de protection des données) au sujet des transferts de données vers des tiers. L'exploitant aurait pu héberger les polices lui-même. Ne pas le faire était un choix de confort, pas une nécessité.

L'amende s'élevait à 100 euros de dommages et intérêts versés au plaignant, et l'exploitant du site a dû en plus payer les frais de procédure. Des montants modestes. Mais cette affaire a ouvert la porte aux réclamations de masse, et des milliers de lettres similaires ont depuis été envoyées à des propriétaires de sites web en Allemagne, en Autriche et en Belgique.

Comment fonctionne Google Fonts et pourquoi c'est un problème

Quand vous ajoutez Google Fonts à votre site web de la manière standard, vous insérez une balise link comme celle-ci dans votre HTML :

<link href="https://fonts.googleapis.com/css2?family=Inter:wght@400;700" rel="stylesheet">

Voici ce qui se passe quand un visiteur charge votre page :

1. Le navigateur voit cette balise et envoie une requête à fonts.googleapis.com
2. Le serveur de Google reçoit la requête, y compris l'adresse IP du visiteur, le type de navigateur et l'URL de provenance
3. Google renvoie le fichier CSS, qui indique au navigateur de télécharger les fichiers de polices proprement dits depuis fonts.gstatic.com
4. Une autre requête part vers Google, à nouveau avec l'adresse IP du visiteur

Deux requêtes vers les serveurs de Google. Deux transferts de données personnelles. Aucun consentement demandé.

Tout cela se produit avant que le visiteur ne fasse quoi que ce soit sur votre site. Avant qu'il ne clique sur un bouton, remplisse un formulaire ou accepte une bannière cookies. Le transfert de données a lieu dès le chargement de la page.

Combien de sites web sont concernés

Beaucoup. Google Fonts est utilisé sur environ 50 millions de sites web dans le monde. C'est de loin le service de polices web le plus populaire. La plupart des thèmes WordPress chargent Google Fonts par défaut. De nombreux constructeurs de sites comme Wix, Squarespace et Webflow le font aussi.

Si vous n'avez jamais vérifié ce point précis, votre site web charge probablement Google Fonts en externe. Le thème choisi par votre web designer les incluait sans doute d'origine.

Comment vérifier si votre site charge Google Fonts en externe

Méthode 1 : les outils de développement du navigateur

1. Ouvrez votre site web dans Chrome
2. Appuyez sur F12 pour ouvrir les outils de développement
3. Cliquez sur l'onglet « Network » (Réseau)
4. Rechargez la page
5. Dans la barre de filtre, tapez « fonts.googleapis » ou « fonts.gstatic »

Si vous voyez des requêtes vers ces domaines, votre site charge Google Fonts depuis les serveurs de Google.

Méthode 2 : afficher le code source de la page

1. Faites un clic droit sur votre site web et sélectionnez « Afficher le code source de la page »
2. Appuyez sur Ctrl+F et recherchez « fonts.googleapis.com »

Si vous le trouvez, les polices sont chargées en externe.

Méthode 3 : lancer un scan

Un scan de conformité gratuit vérifie automatiquement les connexions externes à Google Fonts, ainsi que des dizaines d'autres problèmes de confidentialité et de conformité.

La solution : hébergez vos Google Fonts vous-même

La correction est simple. Au lieu de charger les polices depuis les serveurs de Google, vous téléchargez les fichiers de polices et vous les hébergez sur votre propre serveur. Plus aucune requête vers Google. Plus aucun transfert d'adresse IP. Problème résolu.

Étape 1 : téléchargez les polices

Rendez-vous sur google-webfonts-helper, un outil gratuit créé par Mario Ranftl. Recherchez la police que vous utilisez. Sélectionnez les graisses et les styles dont vous avez besoin. Téléchargez le fichier zip.

Étape 2 : envoyez les fichiers de polices sur votre serveur

Décompressez le téléchargement et placez les fichiers de polices, généralement au format .woff2, dans un dossier de votre serveur web. Un dossier comme /fonts/ convient très bien.

Étape 3 : ajoutez le CSS @font-face

L'outil google-webfonts-helper génère aussi le CSS dont vous avez besoin. Il ressemble à ceci :

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('/fonts/inter-v12-latin-regular.woff2') format('woff2');
}

@font-face {
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('/fonts/inter-v12-latin-700.woff2') format('woff2');
}

Ajoutez-le à votre feuille de style.

Étape 4 : supprimez la balise link de Google Fonts

Trouvez et supprimez la balise <link> qui référence fonts.googleapis.com dans votre HTML. Si elle est ajoutée par un thème ou un plugin WordPress, vérifiez si les réglages du thème proposent une option « disable Google Fonts ». Beaucoup de thèmes modernes en ont une.

Étape 5 : vérifiez que cela fonctionne

Rechargez votre site et ouvrez à nouveau les outils de développement. Allez dans l'onglet Network et filtrez sur « googleapis ». Aucune requête ne doit apparaître.

Instructions spécifiques pour WordPress

La plupart des thèmes WordPress chargent Google Fonts via le fichier functions.php du thème ou via le Customizer de WordPress. Voici comment corriger selon votre configuration :

Si votre thème dispose d'une option intégrée : vérifiez Apparence > Personnaliser ou le panneau de réglages de votre thème. Cherchez les réglages « Typographie » ou « Google Fonts ». Des thèmes comme Astra, GeneratePress et Kadence permettent de passer aux polices hébergées localement en un clic.

Si vous utilisez un plugin : le plugin « OMGF (Optimize My Google Fonts) » télécharge automatiquement les Google Fonts, les héberge localement et supprime les références externes. Installez-le, lancez-le une fois et c'est terminé.

Si vous devez le faire manuellement : ajoutez ceci au fichier functions.php de votre thème pour retirer Google Fonts de la file de chargement :

function remove_google_fonts() {
    wp_deregister_style('google-fonts');
    wp_dequeue_style('google-fonts');
}
add_action('wp_enqueue_scripts', 'remove_google_fonts', 100);

Ajoutez ensuite les déclarations @font-face auto-hébergées à la feuille de style de votre thème.

Et les autres services de polices externes ?

Google Fonts attire le plus d'attention, mais la même logique RGPD s'applique à tout service de polices externe qui transfère les adresses IP des visiteurs vers des serveurs tiers. Adobe Fonts, anciennement connu sous le nom de Typekit, et la version CDN de Font Awesome posent le même problème.

La correction est identique dans tous les cas : téléchargez les fichiers et hébergez-les vous-même.

Font Awesome propose une version auto-hébergée à télécharger directement. Adobe Fonts est plus délicat, car sa licence impose souvent un chargement depuis les serveurs d'Adobe. Si vous utilisez Adobe Fonts, envisagez de passer à une alternative auto-hébergeable ou intégrez ce service à votre flux de consentement aux cookies.

L'amende de 100 euros mérite-t-elle vraiment votre attention ?

L'affaire de Munich concernait un seul plaignant et une amende de 100 euros. Cela semble dérisoire. Voici pourtant pourquoi vous devriez vous en soucier :

Les réclamations de masse existent déjà. Après le jugement de Munich, des groupes organisés ont commencé à envoyer des centaines de mises en demeure à des exploitants de sites web en Allemagne et en Autriche. Les montants vont de 100 à 170 euros par réclamation. Certains propriétaires de sites ont reçu plusieurs réclamations de personnes différentes.

La tendance s'étend. Les défenseurs de la vie privée néerlandais et belges en ont pris note. Des réclamations similaires fondées sur le même raisonnement juridique apparaissent en Belgique.

La correction est facile. Auto-héberger ses polices prend 15 à 30 minutes. Payer ne serait-ce qu'une seule réclamation de 100 euros coûte davantage en temps et en stress.

Il ne s'agit pas que des polices. Si une autorité de protection des données examine votre usage de Google Fonts et découvre d'autres problèmes RGPD, comme une absence de consentement aux cookies, un Google Analytics mal configuré ou une politique de confidentialité manquante, la plainte sur les polices devient la partie émergée d'un problème bien plus vaste. Notre liste de contrôle RGPD couvre l'ensemble des points à vérifier au-delà des seules polices.

Questions fréquentes

Cela s'applique-t-il aux sites web en dehors de l'Allemagne ?

Le jugement de Munich est une décision d'un tribunal allemand, il ne lie donc pas directement les autres pays de l'UE. Mais il applique les mêmes règles du RGPD qui existent partout dans l'UE. Les régulateurs néerlandais, autrichiens et belges ont signalé leur accord avec le raisonnement du tribunal. Traitez ce sujet comme un enjeu à l'échelle de l'UE.

Mon constructeur de site charge Google Fonts automatiquement. Que faire ?

Vérifiez si les réglages de votre plateforme proposent une option de polices locales. Wix a ajouté l'hébergement local des polices en 2023. Squarespace et Webflow prennent tous deux en charge les polices personnalisées. Si votre constructeur ne le propose pas, contactez son support. En attendant, vous pouvez utiliser un en-tête Content Security Policy pour bloquer les requêtes vers fonts.googleapis.com, même si cela peut casser l'affichage de vos polices tant que vous n'avez pas ajouté d'alternatives locales.

Puis-je simplement ajouter Google Fonts à ma bannière de consentement aux cookies ?

Techniquement, oui. Vous pourriez bloquer le chargement de Google Fonts jusqu'au consentement du visiteur, comme votre bannière cookies le fait déjà pour les traceurs. Mais votre site s'afficherait alors sans ses polices prévues jusqu'au consentement, ce qui donne une impression de site cassé. L'auto-hébergement est une bien meilleure solution, car vos polices se chargent immédiatement et aucun consentement n'est nécessaire.

L'auto-hébergement des polices va-t-il ralentir mon site ?

C'est généralement l'inverse. Google Fonts nécessite deux connexions HTTP supplémentaires vers googleapis.com et gstatic.com. Les polices auto-hébergées se chargent depuis votre propre serveur, auquel le navigateur est déjà connecté. La plupart des sites constatent des performances égales ou meilleures après le passage aux polices auto-hébergées, surtout avec des en-têtes de cache bien configurés.

J'utilise un CDN comme Cloudflare. Cela règle-t-il le problème Google Fonts ?

Non. Un CDN placé devant votre propre site ne change rien au fait que votre HTML demande aux navigateurs d'aller chercher les polices sur les serveurs de Google. Les requêtes partent toujours vers Google. Vous devez réellement remplacer les références de polices externes par des références locales.

---

Vous vous demandez quelles autres données votre site web pourrait laisser fuiter ? Lancez un scan gratuit sur trustyourwebsite.com pour détecter Google Fonts, les traceurs externes et plus de 30 autres problèmes de conformité.

Sources

• Règlement (UE) 2016/679, règlement général sur la protection des données (eur-lex.europa.eu)
• Article 4 du RGPD, définitions, dont les données personnelles et les adresses IP (eur-lex.europa.eu)
• Article 6 du RGPD, licéité du traitement (eur-lex.europa.eu)
• CJUE, affaire C-582/14 Breyer, les adresses IP comme données personnelles (curia.europa.eu)
• Autorité de protection des données, autorité belge de protection des données (autoriteprotectiondonnees.be)
• Loi du 30 juillet 2018 relative à la protection des personnes physiques à l'égard des traitements de données à caractère personnel (ejustice.just.fgov.be)

---

Ceci est une analyse technique, pas un avis juridique. Consultez un avocat pour un conseil juridique spécifique.