Mes ressources pour le Web

Les Google Fonts seraient NON conforme RGPD ?


Un tuto pour installer en local, les GoogleFonts dans une feuille de style, et non plus avec un lien direct type href='//fonts.googleapis.com/css?family ....

 Pour rappel, GoogleFonts about est une bibliothèque de polices de Google, permettant aux développeurs d’ajouter des polices simplement en référençant une feuille de style (CSS). 

je vais prendre l’exemple de la démonstration installée par la gestion de contenu CMSMS avec le menu Home ou  Simplex Theme.
- Dans le gabarit "Simplex" il y a un lien < link href='//fonts.googleapis.com/css?family=Noto+Sans:400,700,400italic|Oswald:700' rel='stylesheet' type='text/css' >  qui permet de charger les polices :
- 'Noto Sans'  400(regular) 400-italic et 'Noto Sans' 700
- Oswald 700
(utilisées dans les feuilles de style "Simplex Layout" et "Simplex Slideshow")

Le but est donc d’installer ces fichiers de police en local et de créer un feuille de style "Noto-Sans_Oswald" qui sera ajouter au "Design / Simplex" , puis de supprimer le lien dans le gabarit "Simplex" < link href='//fonts.googleapis.com/css?family=Noto+Sans:400,700,400italic|Oswald:700' rel='stylesheet' type='text/css' >

1- Sélectionner et télécharger les polices
Pour cela utilise le site google-webfonts-helper qui permet de sélectionner les polices, le CSS et de télécharger un zip contenant les polices.

I - Pour la police Noto-Sans
a- sélection de la police, du charset et des styles
font_1-2_r
b- copier le CSS (il est possible de choisir les paramètres de son dossier /fonts)
font_3_r
c-télécharge un fichier ZIP contenant les polices.
font_4_r
II - Pour la police Oswald

a- sélection de la police, du charset et des styles
o-font_1-2_rb- copier le CSS
o-font_3_rc-télécharge un fichier ZIP contenant les polices.
o-font_4_r

2- puis placer les polices dans votre dossier
Il suffit d'ouvrir les zip télécharger et de déplacer les fichiers dans le dossier "/uploads/simplex/fonts/"
dossier_fonts

3- préparer la feuille de style (Nom : Noto-Sans_Oswald + Type de média : screen)

//----code à copier----
[[strip]]
[[* /* assign the images path to a variable */ *]]
[[capture assign='font']][[uploads_url]]/simplex/fonts[[/capture]]
[[* /* oswald-700 - latin */ *]]
@font-face {
  font-family: 'Oswald';
  font-style: normal;
  font-weight: 700;
  src: local(''),
       /* url('[[$font]]/oswald-v40-latin-700.woff') format('woff'), */
       url('[[$font]]/oswald-v40-latin-700.woff2') format('woff2');
}
[[* /* 'Noto Sans';  regular +italic+700 */ *]]
 
/* noto-sans-regular - latin */
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 400;
  src: local(''),
       url('[[$font]]/noto-sans-v25-latin-regular.woff2') format('woff2');  
}
/* noto-sans-italic - latin */
@font-face {
  font-family: 'Noto Sans';
  font-style: italic;
  font-weight: 400;
  src: local(''),
       url('[[$font]]/noto-sans-v25-latin-italic.woff2') format('woff2');  
}
/* noto-sans-700 - latin */
@font-face {
  font-family: 'Noto Sans';
  font-style: normal;
  font-weight: 700;
  src: local(''),
      url('[[$font]]/noto-sans-v25-latin-700.woff2') format('woff2');
}
[[/strip]]
----fin code à copier----//

4- ajouter au "Design / Simplex"
f-style_desing_r

5- supprimer le lien " href='//fonts...."
ou le commenter dans le gabarit "Simplex" {* <link href='//fonts.googleapis.com/css?family=Noto+Sans:400,700,400italic|Oswald:700' rel='stylesheet' type='text/css'> *}

6- tester
Vos pages et vérifier dans la source que dans la feuille de style
.../cache/stylesheet_combined_bxxxxxxxxx1.css" media="screen" />
contient bien la feuille "...cmsms stylesheet: Noto-Sans_Oswald ..."

Questions ou retours me contacter


Télécharger la page fonts-google au format PDF


Crédits
Un tribunal allemand condamne l’intégration de Google Fonts dans un site  (31/01/2022)
Google Fonts viole le RGPD (29/05/2021)
Auto-héberger les polices GoogleFonts ...
google-webfonts-helper
Nota Plus
Utilisation de Google Analytics et transferts de données vers les États-Unis : la CNIL met en demeure un gestionnaire de site web
Questions-réponses sur les mises en demeure de la CNIL concernant l’utilisation de Google Analytics

Original du 03/02/20022
 Document http://jc.etiemble.free.fr/abc/ JCE - version 08/06/2022-0 CC_licence

...