Home › Forums › Support › Issues with low CLS score on Google PageSpeed Insights due to fonts loading
- This topic has 11 replies, 3 voices, and was last updated 7 months, 2 weeks ago by
Tom.
-
AuthorPosts
-
June 4, 2020 at 11:10 pm #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!
June 5, 2020 at 6:48 am #1315479David
StaffCustomer SupportHi 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.Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/June 6, 2020 at 12:35 am #1316464Grega
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!
June 6, 2020 at 10:06 am #1317085Tom
Lead DeveloperLead DeveloperHi 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.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentJune 6, 2020 at 10:32 am #1317113Grega
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
June 6, 2020 at 4:51 pm #1317365Tom
Lead DeveloperLead DeveloperPerhaps 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
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentJune 6, 2020 at 11:33 pm #1317541Grega
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!
June 7, 2020 at 5:50 am #1317824David
StaffCustomer SupportHi 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
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/June 7, 2020 at 9:48 am #1318181Grega
Done! π
June 7, 2020 at 5:36 pm #1318497Tom
Lead DeveloperLead DeveloperOnly 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.
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-developmentJune 7, 2020 at 10:29 pm #1318646Grega
Thanks for checking, Tom. I’ll see how I can optimize this. I appreciate your support!
June 8, 2020 at 9:36 am #1319514Tom
Lead DeveloperLead DeveloperNo problem! π
Documentation: http://docs.generatepress.com/
Adding CSS: http://docs.generatepress.com/article/adding-css/
Ongoing Development: https://generatepress.com/ongoing-development -
AuthorPosts
- You must be logged in to reply to this topic.