CLS ISSUES On Every Page "Says Google"
Autore: Giulio V.
Visite 3456,
Followers 1,
Condiviso 0
Dear Supporters,
I have issues claimed by Google as CLS this is for both our Mobile and Desktop versions.
On Mobile it says 124 pages need improvement. CLS issue: more than 0.1 (mobile)
For Desktop it says 124 pages are Poor. CLS issue: more than 0.25 (desktop)
When I view my site on Desktop or Mobile I do not see any shifting and pages seen to
load at a good speed.
I hope someone can figure this out, I have seen other posts and it appears this is not an easy
problem to address at this time.
Here is my website address. https://prolinesystems.net
I hope someone can soon shed some light on this issue because it will be a bigger problem in the new year 2021.
Thank you for your help, Giulio Valle
Postato il
Giulio, I do not see a shift on your pages at first site, but I did note that frequently your header content and sticky content are too wide for the nominated resolution and this may be interferring with your cls score.
On my (android) mobile the sticky bar menu is noteable to the right (almost off screen), you should be able to resolve this by added a resolution of 320 to the responsive layout options.
At tablet resolution there appears to be space allocated on the left which results in an offset of the page with respect to the sticky menu. Perhaps an overlooked setting in template structure?
You also have an odd bit of code appearing top left of every page (perhaps a left over from some misplaced code?)
Hello.
"When I view my site on Desktop or Mobile I do not see any shifting and pages seen to
load at a good speed." - This may be due to your browser cache and your excellent internet connection.
As far as I can see (https://developers.google.com/speed/pagespeed/insights/?hl=EN&url=https%3A%2F%2Fprolinesystems.net%2F&tab=mobile) there are many tasks to be done.
Perhaps my experience will be useful to you https://magazin.aleksius.com/en/blog/31-website-x5-speed-optimization
Autore
Hi Esach,
Thank you for your response, I wonder what that > symbol at the top of the pages is and how to get rid of it?
I believe I may have resolved the tablet view being off to the right of the page.
Also I already had a 320 responsive layout but that one shows the gray bar at the bottom with a white space I don't know how to address this or what is causing it.
If you don't mind could you please revisit my site and check it again if what I have done has made a difference?
https://prolinesystems.net
I really appreciate your help I don't know what I would do without kind and intellegent folks like you.
Best Regards, Giulio
Hi Aleksej,
Thank you for your response and the link showing details of things that need improvement. You mention there are many tasks to bed done, but where and how do I start to take care of these issues when my experience with code is quite minimal?
Any suggeestions you can provide will be greatly appreciated.
Thank you so much, Giulio
Giulio,
Well done! No horizontal scroll bar problem at any resolution that I can identify, unless 3rd party code is causing issues I believe you will get a good report from google re: cls
"but where and how do I start to take care of these issues when my experience with code is quite minimal?" - here is a list of what you need to do (https://developers.google.com/speed/pagespeed/insights/?hl=EN&url=https%3A%2F%2Fprolinesystems.net%2F&tab=mobile).
And here are my tips on how to do it (no programming) https://magazin.aleksius.com/en/blog/31-website-x5-speed-optimization#speed-optimization
Autore
Dear supporters
I have tried several things to clear up my Google issue - CLS issue: more than 0.25 (desktop) POOR for all pages.
My moblie says needs improvement for all pages.
As I try to explore this issue I found one article that says LASY Loading could be the problem.
Also the Size attributes for images cuold be adding to the problem. Dosen't X5 automatically set this for us?
here is the website that sheds light on this issue https://css-tricks.com/preventing-content-reflow-from-lazy-loaded-images/
This is what was posted on thier site
Update! Times changed fast here, and to avoid lazy-load jank, all you have to do is put the correct natural width and height attributes on images and they will load nicely, even if CSS makes the image fluid with. So do it like: <img src="image.jpg" width="800" height="600">
Can someone shed some light on this?
Thank you, Giulio Valle
@ Giulio
You are correct - if you put an exact dimension of an image - browser will know how what space to reserve and the site will load faster.
I do not know if WSX5 do this in the code... I have not inspect the code regarding this issue.
The rule of the thumb:
resize and optimize every image on you website OUTSIDE WSX5 (I do this in Fireworks, 800x600 is the usual image size I use).
Autore
Hi Sinisa,
Thank you for your reply I normally use paint.net to resize the images for optimization and even put the size of the image at the end of the file name - like 600x800.
Some time I will insert aphoto in a text box and when I grab a handle to resize it it shows X5 has changed the dimensions.
This is so frustrating I see no shifting issues when I access my web pages on destop or mobile.
But this is what Google is showing me on all 123 pages. Thank you for any suggestions, this is horrible...
Hello Giulio
I've notified the developers of this. They're currently investigating the situation in order to decide exactly how to proceed in order to address these warnings given by Google.
As of now though, these warnings should have no impact on the website's ranking yet. They might do in an early future though.
I will be sure to keep you posted on the situation as soon as news on this becomes available
Thank you
Stefano
Autore
Hi Stephano,
I am so glad to hear that you are aware of this issue and took the time to let me know you are working on a solution with the developers.
I believe this will have an SEO impact in 2021 so thank you for bringing this to the attention of the developers to start early on a fix. Thank you for your continued support.
Giulio
Autore
Hi Stefano,
Google says I still have the CLS issue on all pages. This is showing up on many web sites and will soon be a ranking issue early next year. I have asked some people in the industry about this and they say I shoud convert to a WordPress web site.
I really like X5 and do not want to switch so I need to ask if there are any updates that can address this issue? Have you heard from the developers regarding this problem?
Please keep me informed.Thank you, Giulio
Hello Giulio
As mentioned before, the developers have currently been notified of this. They're currently investigating the situation in order to decide exactly how to proceed in order to address these warnings given by Google.
As of now though, these warnings should have no impact on the website's ranking yet. They might do in an early future though and this is why they're currently looking into this. For the moment though, I am afraid there's still no news on this available
I will be sure to keep you posted on the situation as soon as news on this becomes available
Thank you
Stefano
Autore
Dear supporters
I have tried several things to clear up my Google issue - CLS issue: more than 0.25 (desktop) POOR for all pages.
My moblie says needs improvement for all pages.
As I try to explore this issue I found one article that says LASY Loading could be the problem.
Also the Size attributes for images cuold be adding to the problem. Dosen't X5 automatically set this for us?
here is the website that sheds light on this issue https://css-tricks.com/preventing-content-reflow-from-lazy-loaded-images/
This is what was posted on thier site
Update! Times changed fast here, and to avoid lazy-load jank, all you have to do is put the correct natural width and height attributes on images and they will load nicely, even if CSS makes the image fluid with. So do it like: <img src="image.jpg" width="800" height="600">
Can someone shed some light on this?
Thank you, Giulio Valle
Autore
I wish to thank John W on another post relating to the CLS Issue.
Thanking him For his tenacity in possibly finding the problem of CLS, It appears he is on to something.
I have been suffering the same CLS issues on every page on my website and belive the footer issue he discovered may very well be causing this.
When John W. mentioned the footer issue I immediately went to my footer and noticed the footer background was not the same height / size as the footer, it was higher, so I lowered it to match the footer height on all view ports. Also took away the Footer backgrounds on lower resolutions.
I then went to this website that checks for CLS on web pages and it now shows "0"
When it comes to Google it takes 28 days to monitor the website before they send a new report. Too bad we have to wait so long to hear back from Google to know for sure.
This is the website to check for CLS problems.https://layoutstability.rocks/
I am now showing "0" on the above link, I hope this is the end of this and if so thank you John W. for your hard work in determining what has been the probable cause of Poor CLS issues.
Thanks to all that provide great support. Giulio