[Support request] Issues with low CLS score on Google PageSpeed Insights due to fonts loading

Home Forums Support Issues with low CLS score on Google PageSpeed Insights due to fonts loading

Viewing 12 posts - 1 through 12 (of 12 total)
  • Author
    Posts
  • #1315049
    Grega

    Hi there,

    I have many errors in Google Search Console due to the low CLS score, which can be seen when conducting PageSpeed Insight tests on the mobile version.

    After my manual check, I believe the main issue is in the fonts > the site loads some old fonts by default before converting them to new ones. When this happens, the whole content moves a bit to the right, which causes the low CLS score and the errors in Search Console.

    Do you have any ideas how to fix that? How to change the default fonts or whatever? And which are the default fonts? No idea where could I find that.

    Thanks a lot for your support!

    #1315479
    David
    Staff
    Customer Support

    Hi there,

    You have some fonts being loaded by the Theme and some being loaded by Elementor.
    Looking at your sites page speed report the CLS value is 0 – which is fine.

    Looking at the Avoid large layout shifts there are 3 elements:

    2 are from Elementors markup which.
    The 1 that is theme related is the Search Icon – you can elimiate that by Customizer > General and switching the Icon Type to SVG.

    #1316464
    Grega

    Hi David, thanks for your feedback.

    I changed the search icon to SVG, thanks.

    Regarding the CLS > it is 0 in the section of “Lab Data”, but above that, you can see CLS value in the “field data”, which shows 0.33 for the homepage right now (and similar results for other sites), which is causing so many errors in search console.

    Regarding the different fonts being loaded by Theme and others by Elementor > do you have any tips on how to optimize that?

    Also, all posts have been written using your theme only (there is no Elementor on it), and they have the same CLS of 0.33 (+-) like this post for example: https://www.yourinception.com/neuriva-review/

    Do you have any other solutions to avoid getting the errors from Search Console?

    Thanks!

    #1317085
    Tom
    Lead Developer
    Lead Developer

    Hi there,

    Tough one to debug as your HTML source is all minified. Any chance you can disable your caching/minifying plugin so we can take a closer look?

    One thing to test is using the System Stack font over a Google font – might be worth comparing the results between the two.

    #1317113
    Grega

    Hi Tom,

    I changed all the fonts to inherit (with the body font being System Stack) and when physically reloading the site on my phone (for example on mydomain.com/best-nootropic-stack), it doesn’t move at all > so the CLS should be 0, but the score is pretty much the same.

    I can totally disable caching plugin if you want, just let me know when do you plan on checking the site? So I can enable it as soon as you finish, not losing too many people in between.

    Thanks

    #1317365
    Tom
    Lead Developer
    Lead Developer

    Perhaps a staging site would help?

    I can’t promise I’ll be able to offer much insight, but it’s worth a look at your source.

    Insights are saying there’s 175kb of CSS, which is a bit high. Might be worth looking into.

    The actual core of the theme shouldn’t be the issue: https://developers.google.com/speed/pagespeed/insights/?url=http%3A%2F%2Fspeedtest.generatepress.com%2F

    #1317541
    Grega

    Great idea, I just created the staging site.

    I really appreciate your support with this issue!

    How/where can I send you the login data?

    Thanks a lot!

    #1317824
    David
    Staff
    Customer Support

    Hi there,

    you can send the Login details via the Account Issue form:

    https://generatepress.com/contact/

    Please include the URL to this topic so we can track

    #1318181
    Grega

    Done! 🙂

    #1318497
    Tom
    Lead Developer
    Lead Developer

    Only thing I can see really is your CSS size and Font Awesome (from Elementor) causing issues.

    If you run a single article through insights (Nootropics review), you get a 94 score.

    #1318646
    Grega

    Thanks for checking, Tom. I’ll see how I can optimize this. I appreciate your support!

    #1319514
    Tom
    Lead Developer
    Lead Developer
Viewing 12 posts - 1 through 12 (of 12 total)
  • You must be logged in to reply to this topic.