Reply To: Images are blurry when site is loaded and browser is below 775px width

[Beverleyh]

Your website is using srcset to load in different sized images depending on browser width;
https://zxndesignco.com/wp-content/uploads/2017/02/BannerCSTop-300×80.jpg
https://zxndesignco.com/wp-content/uploads/2017/02/BannerCSTop-768×204.jpg
https://zxndesignco.com/wp-content/uploads/2017/02/BannerCSTop-1000×266.jpg
https://zxndesignco.com/wp-content/uploads/2017/02/BannerCSTop-1024×272.jpg
https://zxndesignco.com/wp-content/uploads/2017/02/BannerCSTop.jpg

You can see that the smaller images are not as crisp as the higher resolutions, in particular the 300 x 80 one.

I expect that the images are being auto-generated somewhere in your CMS? You might be able to change quality settings for smaller image/thumbnail generation in the admin panel (sorry, I’m not that familiar with WordPress so can’t offer any suggestions as to where) or disable them altogether (to the detriment of mobile users who’ll then be loading in heavier images meant for desktop), or just disable the very smallest? That’s something for you to investigate at your side – maybe via an installed plugin.

Alternatively, you might be able to manually create and upload the different sized images after manipulating the quality yourself, although this will impact upon your workload considerably if you have a lots of images on your site.