Optimiser les Google Fonts

🚀 Depuis WP Rocket 3.7, cette fonctionnalitĂ© est automatiquement activĂ©e sur les nouvelles installations !

Dans cet article

À propos de cette optimisation

Lorsque vous utilisez les Google Fonts sur votre site web, voilĂ  ce qui se passe :

  1. Il y a une premiĂšre requĂȘte HTTP vers la feuille de style des polices de Google, hĂ©bergĂ©e sur fonts.googleapis.com. Il y a gĂ©nĂ©ralement une requĂȘte par fonte choisie.
  2. Ensuite, Ă  l'intĂ©rieur de cette feuille de style, la fonte elle-mĂȘme est rĂ©fĂ©rencĂ©e et doit ĂȘtre tĂ©lĂ©chargĂ©e, Ă  partir de fonts.gstatic.com

L'option Optimiser les Google Fonts fait trois choses pour optimiser ces requĂȘtes :

  1. Si la page comporte plusieurs requĂȘtes Ă  Google Fonts, elles seront combinĂ©es en une seule. Cela permettra de rĂ©duire lĂ©gĂšrement le nombre total de requĂȘtes HTTP. 
  2. Ajoute le paramĂštre display=swap Ă  la requĂȘte, pour satisfaire Ă  la recommandation de PageSpeed de s'assurer que le texte reste visible pendant le chargement des polices. Cette optimisation sera appliquĂ©e mĂȘme s'il n'y a qu'une seule requĂȘte de police sur votre page. 
  3. Ajoute l'indication preconnect Ă  la requĂȘte pour amĂ©liorer le temps de chargement des polices :
  4. <link href="https://fonts.gstatic.com" crossorigin rel="preconnect" />

Attention ! Au final, chaque police que vous utilisez sur votre site doit ĂȘtre tĂ©lĂ©chargĂ©e par le navigateur du visiteur. Plus vous utilisez de polices, plus cela prend du temps. Cette option ne change rien Ă  cela. Elle permet simplement une petite optimisation des demandes. Vous devez tout de mĂȘme faire attention Ă  ne pas ajouter trop de polices Ă  votre site :)

RequĂȘtes de font non optimisĂ©es

Dans la capture d'Ă©cran ci-dessous, il y a deux requĂȘtes distinctes pour les polices Google (cliquez pour agrandir l'image).

RequĂȘte de font optimisĂ©e

Vous pouvez voir ici que les deux requĂȘtes ont Ă©tĂ© combinĂ©es en une seule avec le paramĂštre ajoutĂ© display=swap (cliquez pour agrandir l'image).

L'indicateur de prĂ©connexion est Ă©galement ajoutĂ© : 

Mise à jour depuis les versions précédentes

Si vous ĂȘtes passĂ© Ă  la version 3.7 et que l'option n'Ă©tait pas activĂ©e auparavant, elle ne sera pas activĂ©e aprĂšs la mise Ă  jour. 

Si vous souhaitez l'activer aprÚs la mise à jour, veuillez visiter l'onglet Outils et utiliser le bouton prévu à cet effet:

DĂ©sactiver cette option

Si vous souhaitez désactiver cette option, vous pouvez le faire avec le plugin d'aide ci-dessous.

đŸ“„   TĂ©lecharger (.zip):  WP Rocket | Disable Google Font Optimization

DĂ©veloppeurs : vous trouverez le code de ce plugin sur GitHub.

Cela a-t-il rĂ©pondu Ă  votre question ? Merci pour votre retour :) Une erreur est survenue lors de l’envoi de votre retour. Veuillez rĂ©essayer plus tard.