[RÉGLÉ] Google font API Key ???

[GraphiqueDesign]

Bonjour à tous,
Je ne suis pas trop dans Joomla en ce moment mais je prends toujours quelques bonnes minutes pour vous suivre ici. Je regrette de n'avoir pas plus de temps à consacrer au forum mais je suis vraiment trop coincé par certaines difficultés.

Lors d'une mise à jour du framework helix Ultimate, je constate qu'il y a maintenant moyen de saisir une API Key tout comme pour Google Map. On peut obtenir cette clé sur cette page : https://developers.google.com/fonts/docs/developer_api

Je n'ai pour le moment saisi aucune clé sans que cela ait une incidence sur l'affichage du site. Du coup, je me demande à quoi sert cette clé. Allons nous nous retrouver dans le même cas qu'avec Google Map ? Les fonts, vont-elles commencer à ne plus s'afficher sans la clé ? Pour finir, faudra t-il là aussi filer un numéro de carte bancaire pour profiter du service ?

De façon générale, n'est il pas mieux d'importer les fonts directement sur le serveur qui héberge le site, déjà pour régler ce problème de clé, ensuite pour être conforme avec le RGPD et enfin, pour accélérer le chargement des pages ?

Mon anglais est un peu laborieux mais j'essai quand même de comprendre. Si vous avez des infos voire des opinions ou envie qu'on échange sur le sujet de ce post, je suis vraiment preneur. Vous remerciant d'avance.

[Eddy.vh]

Salut GD.
Pour les google webfont, j'ai, sur un site en cours de construction, hébergé les fonte nécessaires. Je pense que ça aide question RGPD.

Pour le reste je n'utilise pas de clé API que pour Analytics et je pense prochainement ne plus l'utiliser...

[GraphiqueDesign]

Bonjour Eddy, super content de te lire !

Je vais tout bientôt m'intéresser très sérieusement à héberger les fontes sur le serveur de mon site.
D'autant plus que je n'en utilise qu'une seule famille par site Internet.
C'est encore un peu flou pour moi niveau intégration css mais je devrais trouver assez facilement de la doc là dessus, enfin je l'espère.

Comment vous faites, les autres ?
Merci Eddy !

[Eddy.vh]

Je suis un peu overbooke pour la fin d'année mais ce sera avec plaisir que je t'indiquerai comment on fait.

[Eddy.vh]

Bonjour GD.

• Voici la méthode pour autohéberger les fontes Google.
• Se rendre sur fonts.google.com et rechercher la police convoitée.
• Une fois trouvée, il faut la sélectionner afin de la placer dans le "panier".
• Ouvrir l'onglet en bas de page où se trouve la ou les polices choisies et sélectionner le lien vers son fichier css. fig_1
• Coller le lien dans la barre d'adresse de votre navigateur et valider pour arriver sur le fichier css de la fonte choisie.
• Sélectionner / copier / coller le lien vers la fonte dans le navigateur et valider afin de pouvoir la télécharger et la placer dans un répertoire du site. fig_2
• Copier le contenu du fichier css affiché et le coller dans votre fichier css.
• Finir par modifier dans votre fichier css le lien vers la fonte pour indiquer celui vers vos polices hébergées.
• Et voilà…

PS admins : Le fichiers png ne peuvent plus être uploadé mais les jpeg non plus

[GraphiqueDesign]

Bonjour Eddy,
Je viens de voir une notification arriver (c'est assez aléatoire) et je te remercie chaleureusement pour cette méthode qui, j'en suis certain, profitera à beaucoup de monde. Je vais tenter de l'expérimenter dans la foulée. Je suppose qu'il faut modifier les réglages de typographie du template une fois cela mis en place ?

EDIT ===============================================

J'ai suivi tes instruction à la lettre, tout s'est bien passé sauf que la police n'est pas prise en compte dans l'affichage du site.

J'ai donc téléchargé un fichier nommé : va9E4kDNxMZdWfMOD5VvmYjLazX3dGTP.woff2 que j'ai placé dans le dossier fonts du dossier de mon template (helix Ultimate), j'ai désactivé les polices sélectionnées dans la section réglages Typographie du template puis j'ai ajouté en tête de mon fichier custom.css les éléments suivants :

/* ===== Polices ===== */
@font-face {
font-family: 'Fira Sans';
font-style: normal;
font-weight: 400;
src: local('Fira Sans Regular'), local('FiraSans-Regular'), url(../fonts/va9E4kDNxMZdWfMOD5VvmYjLazX3dGTP.woff2) format('woff2');
unicode-range: U+0100-024F, U+0259, U+1E00-1EFF, U+2020, U+20A0-20AB, U+20AD-20CF, U+2113, U+2C60-2C7F, U+A720-A7FF;
}

Malheureusement, ça ne fonctionne pas.
Faut-il que je fasse d'autres modifications ?
Merci Eddy,

[daneel]

Je n'ai pour le moment saisi aucune clé sans que cela ait une incidence sur l'affichage du site. Du coup, je me demande à quoi sert cette clé. Allons nous nous retrouver dans le même cas qu'avec Google Map ? Les fonts, vont-elles commencer à ne plus s'afficher sans la clé ? Pour finir, faudra t-il là aussi filer un numéro de carte bancaire pour profiter du service ?

...

Mon anglais est un peu laborieux mais j'essai quand même de comprendre. Si vous avez des infos voire des opinions ou envie qu'on échange sur le sujet de ce post, je suis vraiment preneur. Vous remerciant d'avance.

Bonjour,

D'après ce que je sais, la plupart des fontes sont sous licence type SIL Open Font, c'est une forme de licence qui indique que l'auteur concède l'utilisation des caractères à condition que personne ne fasse du profit. Donc Si Google devait faire payer un jour ce service de distribution, ce serait pas pour tout de suite ou tout au moins avec l'usage de ces polices.

De plus, il est tout à fait possible de stocker localement voir de développer un système pour choisir et stocker directement la police choisi à la place du système actuel dans votre template. C'est même conseillé pour éviter le tracking de Google ou devoir déclarer l'usage des services de google font dans votre RGPD.

Je ne sais pas si les concepteurs d'helix ou de d'astroid envisagent cette option mais d'autres travaillent déjà dans ce sens depuis un moment (la liste via google est automatiquement mis à jour, la police s'installe localement et la css est compilé avec les nouveaux paramètres).

Sauf erreur, la clé API de google font sert uniquement pour télécharger et mettre à jour la liste des polices de caractères ( You need a Google Fonts API Key to enable automatic fonts update ).

L'autre option sera l'accès aux "variables fonts", ce qui sera certainement le plus grand changement dans ce domaine en 2019. ( tous les navigateurs seront bientôt compatible : demo : https://www.axis-praxis.org ).

[Eddy.vh]

Faut-il que je fasse d'autres modifications ?
Merci Eddy,

Normalement c'est suffisant. As-tu examiné si la fonte est bien appelée et attribuée ?

[GraphiqueDesign]

Normalement c'est suffisant. As-tu examiné si la fonte est bien appelée et attribuée ?

Bon, en fait, j'avais oublié de déclarer les balises (hx) dans le fichier css !
Ces réglages était fait via les options du template initialement, en les désactivant, bien entendu, cela ne pouvait plus fonctionner sans ajouter une ligne dans le css !
Voilà ce qui marche chez moi :

@font-face {
font-family: 'fira_sansbold';
src: url('../fonts/firasans-bold-webfont.woff2') format('woff2'),
url('../fonts/firasans-bold-webfont.woff') format('woff');
font-weight: normal;
font-style: normal;
}

h1, h2, h3, h4, h5 {font-family: fira_sansbold;}

[Eddy.vh]

Ah oui bien entendu, il faut déclarer la fonte pour les textes...

[GraphiqueDesign]

D'après ce que je sais, la plupart des fontes sont sous licence type SIL Open Font, c'est une forme de licence qui indique que l'auteur concède l'utilisation des caractères à condition que personne ne fasse du profit. Donc Si Google devait faire payer un jour ce service de distribution, ce serait pas pour tout de suite ou tout au moins avec l'usage de ces polices.

Bonjour Daneel,

Ravi de te croiser à nouveau.
En fait, je trouve que Google devient un peu lourd avec toutes ces clés et tous ces liens avec nos sites.
De plus, ça faisait un moment que je voulais tenter de comprendre comment intégrer les fonts directement sur le serveur du site, voilà qui est fait.

Merci pour tes explications fournies, cela dédramatise un peu l'idée que je me faisais de Google qui nous envahit de plus en plus.
Je passe le topic à "Réglé".
Merci encore à tous.