problemes avec PageSpeed Insights et mes polices font

[flexi2202]

Bonjour à tous,

J'essaie d'atteindre ou de me rapprocher le plus possible des 100% dans PageSpeed Insights.

Cependant, je bloque sur plusieurs points. Le premier concerne les polices, et je vous présente une capture d'écran. Bien sûr, j'ai effectué de nombreux essais dans le CSS additionnel de mon thème colormag dans WordPress, mais rien ne fonctionne.

Voici ma dernière version :

@font-face {
  font-family: 'OpenSans';
  src: url('https://pecheperle.be/wp-content/themes/colormag/assets/library/fontawesome/fonts/fontawesome-webfont.woff2') format('woff2'),
       url('https://pecheperle.be/wp-content/plugins/wp-security-hardening/modules/inc/fa/fonts/fontawesome-webfont.woff') format('woff');
  font-display: auto;
}

mais j'ai aussi essayé entre autre

@font-face {
  font-family: 'OpenSans';
  font-style: normal;
  font-weight: 400;
  src: local('OpenSans Regular'), local('OpenSans-Regular'),
    url('https://pecheperle.be/wp-content/themes/colormag/assets/library/fontawesome/fonts/fontawesome-webfont.woff2') format('woff2');
  font-display: swap;
}

Mais rien ne change dans google Insights, pourtant je vide mon cache et je purge le site

Merci de l'aide

 

[Dr DLP]

Ca devrait, il demande juste un font-display: swap;. D'ailleurs je n'ai pas cette recommandation quand je teste le site.

Pour être sûr que cela ne soit pas un problème de cache, le plus simple est d'utiliser la console (clic droit sur le site, "Inspecter") puis de lancer Lighthouse.

Sinon je m'assurerai plutôt de régler en priorité les problèmes d'accessibilité, les 100% de performances, ça reste mythique ou pour les pages blanches

 

[rick38]

Moi je reste sur un chargement à partir de Google (peut-être pas le mieux mais les fonts étants chargées de manière asynchrone ça ne devrait pas ralentir la page), mais j'ai dû ajouter une petite bidouille avec l'attribut onload pour que Lighthouse ne mette pas de warning :

<link href="https://fonts.googleapis.com/css2?family=Roboto:wght@400;500&display=swap" rel="preload" as="style" onload="this.rel='stylesheet'">

 

[flexi2202]

Merci pour les reponses , le probleme vient d'etre resolu avec litle speed cache , il y avait une option pour le swap
donc ce premier soucis est regle