Performance

Fonts auto-hébergées : moins de requêtes, plus de maîtrise

Appeler Google Fonts depuis le navigateur, c'est une requête tierce, une conformité RGPD discutable, un FOIT (texte invisible le temps que la police charge) possible. Auto-héberger les fichiers sur votre domaine : je le fais par défaut.

Les polices auto-hébergées (fichiers `woff2` sur votre site) évitent un aller-retour vers `fonts.googleapis.com`, réduisent les surprises RGPD, et permettent un `font-display` tenu. Trop de thèmes WordPress injectent trois familles, six graisses, depuis Google. Cet article dit comment je les sors, combien de graisses garder, le lien avec le LCP / CLS, et pourquoi « le thème le fait tout seul » n'est pas un argument.

🔤 Pourquoi je les sors de Google

Les fichiers de police vivent avec le site
Les fichiers de police vivent avec le site

Une connexion tierce, un cache moins prévisible, un débat RGPD (un tribunal de Munich a sanctionné un site pour Google Fonts en janvier 2022). Même si le juridique bouge, la perf suffit : moins de DNS, fichiers que je contrôle, subset possible.

Un site statique (Nuxt generate) auto-héberge naturellement si on ne triche pas. WordPress : le thème et les builders réinjectent. On chasse les `googleapis`.

📐 font-display et CLS

`swap` évite le texte invisible, peut faire un saut. On choisit des fallbacks métriquement proches, ou on accepte un léger FOIT contrôlé. On réserve l'espace (line-height).

Les builders qui chargent une font par titre « créatif » : on coupe.

  • woff2 uniquement
  • preload de la font du H1 si besoin
  • Plus d'appel googleapis
  • Licence : on a le droit de les héberger

🛠️ WordPress

Moins de familles, plus de calme visuel
Moins de familles, plus de calme visuel

Retirer le chargement (dequeue) du thème, poser les fichiers dans le thème enfant, `@font-face`. Ou un plugin unique d'auto-host, puis je le fige. Pas un plugin plus Elementor plus le thème.

Après : audit des requêtes (onglet réseau). Zéro fonts.gstatic.

✂️ Alléger les fichiers

Une police complète contient le cyrillique, le grec, des centaines de symboles. Un site en français n'en utilise qu'une partie. Le sous-ensemble latin divise souvent le poids du fichier par trois ou quatre.

Les polices variables regroupent toutes les graisses dans un seul fichier : utile si le site en emploie trois ou plus, inutile pour une seule. Je compare le poids total avant de choisir, pas le nombre de fichiers.

✅ Vérification

Home mobile, CLS, texte lisible vite. Les fonts auto-hébergées sont un geste d'une heure sur un thème sain, un chantier si le builder en injecte 8.

Je le mets dans le socle de TMA / de livraison. Ce n'est plus optionnel.

✅ Étapes pour sortir de Google Fonts

On relève les polices réellement utilisées (familles, graisses), on les télécharge en format moderne, on les sert depuis votre domaine, puis on supprime les appels externes.

Sauvegarde restaurable, accès au thème, liste des polices notée. Puis 24 à 72 h de suivi : affichage mobile, vitesse, aucune requête externe restante. Sans ce contrôle, un second appel caché peut subsister.

  • Familles et graisses utilisées relevées
  • Test sur une copie avant la production
  • Une police remplacée à la fois
  • Contrôle humain puis 24 h de suivi de l'affichage

📌 Ce que je refuse sur ce sujet

Feuille de style CSS à l'écran
Feuille de style CSS à l'écran

Je refuse de laisser un thème charger trois fois la même police. Je refuse de supprimer des polices sans vérifier les icônes. Je refuse de tout migrer en production sans copie de test.

Je refuse aussi de me taire : si le vrai sujet est un thème trop lourd, je le dis. Ce texte n'est pas un prétexte pour vendre un plugin de plus.

Une fonte Google tierce, c'est une requête de plus et un consentement de trop.

🧭 Questions fréquentes

Faut-il le faire tout de suite ? Oui si votre site charge encore des polices Google alors que vous visez la conformité RGPD. Sinon, intégrez-le au prochain passage de maintenance.

Peut-on le faire sans copie de test ? Sur un site simple, c'est faisable avec une sauvegarde. Sur une boutique, je passe par une copie pour vérifier que le texte ne saute pas et que les icônes restent affichées.

Combien de temps ? Une à deux heures par thème, davantage si plusieurs extensions chargent leurs propres polices. Un tutoriel « en cinq minutes » oublie les doublons.

← Tous les articles

Témoignages

Avis clients : Fonts auto-hébergées

Retours de clients en lien avec ce sujet et cette stack.

Votre thème charge encore Google Fonts ?

On les pose en local, on retire des graisses, on mesure le CLS.