-
Posts
-
Hi,
I am currently in a spat with my server host as the backups seem to take much longer than running on my laptop. Since I believe their server to be slow, I wanted to assist the load times of my pages so I have been looking at Google Page Insights reports and would appreciate some help in fixing some of the issues found.I was using WP Total Cache to do some caching but I noticed in some Enfold forum posts that BWP Minify was suggested. I deactivated WPTC and activated BWP Minify instead. When I checked my site, the LayerSlider on the home page stopped working. Deactivating BWP, the LayerSlider works again.
Can you provide advice on ‘Eliminate render-blocking JavaScript and CSS in above-the-fold content’ problem as I haven’t seen anything about fixing this.
Additionally it complains about optimizing images. I download the optimized images from Page Insights but these messed up my masonry gallery. The files are titled 705×705 but Google images were only 183×183 px which left large gaps in the masonry. How can I optimize my images correctly – do I need to use something like Firebug to check the exact size of the images )it reports 232x232px) and then create an entry in a file somewhere? Why does the gallery use a 705×705 image and not something like a 300×300 image? The masonry gallery is set to flexible, 5 columns.
Hey AlanGRutter,
You won’t be able to get the render blocking message to disappear since it reports that on all site which loading scripts/css in the header, almost all sites to that. You can try to minimise your resources with this plugin though: https://wordpress.org/plugins/bwp-minify/
As for images you can try this plugin: https://wordpress.org/plugins/wp-smushit/
If you want to see exactly what is being loaded on your site and for how long I can recommend you run your site through this Pingdom tool: tools.pingdom.com/fpt/
Best regards,
RikardHi Rikard,
I tried using BWP Minify but I was getting strange results. On my dev machine all was working fine, however when I tried it on the live site I found that the LayerSlider did not work as there were some javascript errors in the console. I compared the file order in the Enqueue Files tab and where they were being loaded and both dev and live were the same. I have removed BWP Minify from the live site at the moment and will be looking at using Cloudfare.
With regards to the images, I have been using Imagify on the live site but Google still complains. Google thinks the images in the masonry are 183x183px but on my dev machine, Firebug reports a different size. I guess the size varies depending upon the width of the screen. I don’t see how I can always serve a perfectly image when using masonry.
Regards
AlanHi Alan,
Thanks for the feedback and sorry for the late reply. I’m no expert in this area unfortunately so I’m not sure I can give you any direct answers, but in my experience you shouldn’t take Google’s errors all that serious, though I understand your consern since they more or less have a monopoly position in the search engine world. Where exactly are you seeing the image problem though?
Best regards,
RikardHi Rikard,
The problem appears to be with portfolio entries that use flexible masonry. As you change the window size on the browser, the image gets resized to fit (same if you zoom). On my laptop, at normal screen resolution (Ctrl-0), Firebug tells me the image size is about 232x232px – Google Page Insights reports 183x183px probably because their virtual browser has a different screen resolution.The other thing that bothers me is that the image thumbnail being loaded is 705x705px – why not choose a thumbnail a little closer to the actual render size.
Regards
AlanHi,
this thread is quite confusing to me. However WordPress is cropping images by default when uploading them and if you want to control this behavior you can use a plugin like this: https://wordpress.org/plugins/simple-image-sizes
I hope this will help :).Best regards,
AndyHi,
I’ve installed Simple Image Sizes plugin and used this to create some custom thumbnail sizes for my home page and a gallery on one of my blogs. This works fine and Google, GTMetrix, Pingdom etc are all happy.I am unsure though how I employ this tactic with the Portfolio page which shows a Masonry Gallery and also individual portfolio items which use masonry to show images. The number of columns varies. The default image size for masonry is 705×705 but this size would be different based upon number of columns and the type of masonry layout. I am currently using flexible masonry. Is there another way I should be doing this – I would rather serve an image closer to the actual layout size rather than a 705x705px image.
Regards
AlanHi,
check out this post to find out about the individual image sizes in Enfold: https://kriesi.at/support/topic/enfold-image-sizes/#post-336176
Hope this helps!
Best regards,
Andy
- You must be logged in to reply to this topic.