Fix WordPress “Ensure text remain visible during webfont load”

Do you want fix page speed insight recommendation shows “ensure text remains visible during Webfont load” in WordPress website?

Fonts are often large files that take a while to load. Some browsers hide text until the font loads causing the “flash of invisible text”. You need to ensure that text remains visible during Webfont loads. Google Page Speed insight reports in the Diagnostics section any font URLs that may flash invisible text.

ensure text remain visible during webfont load

 

How To Fix Ensure Text Remain Visible in WordPress?

To avoid the issue “ensure text remain visible during Webfont load” you have to insert given code manually by finding the font files of your theme or plugins in WordPress directory.

font-display: swap  in your @font-face style.

For Example

@font-face {
  font-family: 'Pacifico';
  font-style: normal;
  font-weight: 400;
  src: local('Pacifico Regular'), local('Pacifico-Regular'), url(https://fonts.gstatic.com/s/pacifico/v12/FwZY7-Qmy14u9lezJ-6H6MmBp0u-.woff2) format('woff2');
  font-display: swap;
}

It doesn’t make a big impact on desktop speed score on page speed insight. Till now there no speed optimization plugins that help you by just installing and activating it. Hope it will come in the future.

A top class theme called ‘Avada’ already comes up the font face rendering option.

Avada font swap

Check it out WordPress speed optimization service wordpress speed optimization service  If you need any help for your WordPress websites. let us know via live chat.