-
Hello,
I’m having troubles with my Core Web Vitals. They fail for marginally due to the CLS. What is strange thay not all pages my block are affected. However, those that are the main contributing factor is class=”inside-navigation”. It fells like fixing that will greatly improve CLS. However, I’m not sure how to approach this…
Any help is appreciated. thank you
-
Hi there,
the various testing tools that identify CLS rarely identify the cause , just the main HTML elements that are affected by the Layout Shift.
The issue I can see is font related ( FOUT ).
The Source San Pro font has its Font Display property set to Swap.
So on initial load the browser renders the text using its system font, until the Source Sans pro loads and the page is re-rendered. The difference between those fonts is slight but can result in text reflow that results in a layout shift.I suggest setting the font display property to auto to avoid that issue.
-
Hi David,
thank you for your response. I vaguely understand your reply as this is not my strong suit. Can you provide future guidance regarding your suggestion.
I still do not understand why not all posts are affected. Some have no CLS issue at all.
Would preloading the Source San Pro font with some plugin like WP Rocket help?
Can you provide some hints on how to set the font display property to auto?your help is much appreciated..
thank you
-
Alvind
Hi there,
How did you add the font to your site? That will determine where you need to change the font display property.
- You must be logged in to reply to this topic.