Hi.
I have a problem with image quality showing up with different quality for a block and masonry. Go to http://www.theCarIndia.com to see the difference in image quality for the article ‘The future of racing is also electric’ (the site is under construction). I have been in contact with the host, and they refer me back to the template provider. This problem does not appear on the site http://www.theCar.no, which uses the same images as articles.
Best,
Glenn
Hi,
Both elements are displaying the same source image, this one
– http://thecarindia.com/wp-content/uploads/2017/08/formula-e-race-car.jpg
There does not seem to be any CSS on the images that would affect image quality. The difference might come from the implementation of the image.
The Visual composer element is setting the image as a background
– https://www.screencast.com/t/MSMbGyh1Z
While the theme creates thumbnails from the featured image
– https://forum.tagdiv.com/theme-thumbs/
I believe that is why there is a difference between the images, they are implemented differently in the grid versus block.
Thanks
Hi.
Thank you for the feedback.
How come this is not the case for the site thecar.no? The only difference between the two is the host.
Best,
Glenn
Hi,
There is a difference between the sources of the same image used in both the websites.
This is the image used on thecar website
– https://i0.wp.com/www.thecar.no/wp-content/uploads/2017/08/formula-e-race-car.jpg
And this one is used on thecarIndia website
– http://thecarindia.com/wp-content/uploads/2017/08/formula-e-race-car.jpg
From what I can see there is a difference in these images. The thumbnails should look the same in terms of quality. Maybe there are plugins, or image optimization or quality filtering in one of the websites that are causing these differences. The theme simply crops and creates thumbnails from the image.
Thanks
Hi.
Thank you for the feedback. I have looked at the two images through the links, and I cannot see any difference between the two. To me, they both seem equally sharp. I also have an US site – http://www.theCarUSA.com – where your template works well with this image. However, for the site in India – http://www.theCarIndia.com – the image is sharp for the masonry, but not for the blocks.
I have been in contact with the host in India – hostgator – but they argue that it is not a mistake by them. I understand that your template is supposed to only crop the image, but something is disturbing the images for the block on this site – theCarIndia.
I do not use any optimizing plugins for images or videos.
Best,
Glenn
Download the image from both sites, and compare in Photoshop to see what the bit difference is.
Upload an image to both sites named test-a-500×300.jpg and test-b-500×300.jpg or similar, then after live, compare both images ‘on page’ by re-download and compare in Photoshop.
For instance, one server might be using mod_pagespeed and converting images to WEBP format; one size might have higher compression setting set in wp-config.php — one site might be using jetpack or smushit; one site might be using http/2 compressing entire page into one packet.
Lots of possible causes — but you need to compare a fresh image put on both sites, then check the final file versions to see what changes are made to thumbs, to help debug the differential between the two.
Food for thought, anyway.
Hi Chris.
Thank you for the feedback. I will try your suggestions. Your input is more helpful than from hostgator, which I am using for this site, although they are friendly.
Best,
Glenn
