Google Fonts : c'est quoi ?

Google Fonts est une bibliothèque libre de plus de 1 000 polices d'écriture que les web designers et les propriétaires de sites Web utilisent pour personnaliser leur site.

Il convient de rajouter ici que le sujet est tout aussi valable pour d'autres bibliothèques tel que Font Awesome

Pourquoi Google Fonts (et autre "font awesome") contreviennent à la règlementation RGPD

L'outil, bien qu'utile, donne lieu à une collecte de données personnelles, notamment les adresses IP des visiteurs de votre site. Cette collecte, effectuée sans le consentement explicite de l'utilisateur, est en violation avec le RGPD qui stipule que le consentement doit être obtenu avant de collecter des données personnelles.

Des entreprises en Allemagne, France et Italie ont déjà été confrontées à des procédures juridiques pour avoir utilisé Google Fonts sans respecter ces règles. Cela démontre que le sujet est à la fois pertinent et sérieux.

Importation de polices : la bonne pratique

L'utilisation de Google Fonts et autre Font Awesome en conformité avec le RGPD est possible grâce à l'hébergement local des polices. L'hébergement local implique de stocker les polices directement sur le serveur de votre site web. Ainsi, l'adresse IP de l'utilisateur n'est pas partagée avec un tiers externe, les polices étant chargées directement depuis votre serveur.

Pour cela, il faut d'abord télécharger les fichiers de polices. Il est ensuite nécessaire de convertir ces fichiers au format WOFF ou WOFF2, qui sont des formats optimisés pour le web. Il existe plusieurs outils en ligne gratuits pour réaliser cette conversion, comme FontSquirrel ou Transfonter.

Une fois les fichiers de polices convertis, vous pouvez les transférer dans le répertoire de votre site web. Ensuite, vous devez mettre à jour votre code CSS pour spécifier l'emplacement local des fichiers de polices. Voici un exemple de code CSS pour intégrer une police locale et l'attribuer au H1 :

    /* Définir la police locale */
    @font-face {
        font-family: 'MaSuperPolice';
        src: url('/chemin/vers/MaSuperPolice.woff2') format('woff2'),
             url('/chemin/vers/MaSuperPolice.woff') format('woff');
        font-weight: 400; 
        font-style: normal;
    }

    /* Utiliser la police pour le H1 */
    h1 {
        font-family: 'MaSuperPolice', sans-serif;
    }

En suivant ces étapes, vous pouvez utiliser Google Fonts et Font Awesome de manière conforme au RGPD, garantissant ainsi une expérience utilisateur optimale sans compromettre la protection des données personnelles. De plus, l'hébergement local des polices améliore le temps de chargement de votre site en évitant une latence due au chargement distant, ce qui en fait également une bonne pratique SEO.