-
Posts
-
When my page uploads – http://www.onrushdigital.com/seo-company-ny-nj/ – the image seems to be resized to be very large and then back to normal size. It just takes a second or two to show up correctly. But when i try to render with Googlebot it just displays the oversized image, which basically takes over the entire screenshot. This happens on other pages too. I already resized and optimized the image before loading it into wordpress and I’m using the image on my page as “full size”. What’s going on and how can I fix it?
Hey asinger777,
Are you referring to the image in the Private Content or the 3 images in Recent SEO Articles?
Best regards,
NikkoThe homepage – http://www.onrushdigital.com or http://www.onrushdigital.com/website-design-company-nj/ or any of the other service pages.
Hi,
Sorry I missed this however I can’t really see any issues on my end. I hope you can give us steps on how we can see the issue, and give us some info like browser and os used.
Best regards,
NikkoI’m on a macbook air using chrome. As an example, when I go to onrushdigital.com, the header image size is distorted for the first second or 2 before it is properly resized and rendered. It’s much clearer to see this when I try and render it in Google Console. I tried to take a screenshot of this resizing as it happens, but it was too quick.
Hi asinger777,
I was able to reproduce the scenario you’re describing. What I did was set the network speed in Chrome DevTools console in Network tab to Good 2g and disabled cache. So the load speed got slow and the browser was trying to show the image as it could, with progressive loading. The image is 187KB which is bigger than anything else you have on the website. It is highly recommended to optimize the image for slower network speeds if you don’t want to have this kind of effect.
You can play with this even more, you can select different network speeds and record a frame by frame video of your page loading. There is a button for recording videos and making screenshots with timestamps on the Network tab in Chrome DevTools console.
Best regards,
VictoriaI’ve already optimized the image — it’s pretty light already. How do you think i can make it smaller? How do i optimize it for slower speeds? I’ve never had this problem before with any of the other sites i use with the enfold theme. Something seems fishy…
By the way, the same “resizing” is happening to the heading fonts. It will show the original styling and then display the modified style (like the bolding). Is that effected by the image size too? It’s happening on other sites I’m running on enfold too.
Hi asinger777,
Here are a few articles on progressive loading:
https://optimus.keycdn.com/support/progressive-jpeg/
https://css-tricks.com/the-blur-up-technique-for-loading-background-images/It could also be that the fonts size are adjusted by javascript, which does on document ready, but this can be reproduced on way lower connection speeds, which we cannot do much about.
There is a js error in console, it might also adding to js slowing down or stopping execution at all.
This _inbound.add_action should also be within document.ready.
Let us know if you have any more questions.
Best regards,
Victoria
- You must be logged in to reply to this topic.