This week I have been trying to get my head around image size resolution and quality for a responsive design,

In my Google searching I have found many articles on the use of media queries, all of the articles talk about solutions that down size the image by cropping or re-sizing, so for example if you have a 1000 PX wide image it will be 700 for tablet, and 450 for Mobile ( very general)

My problem with this is that a new 7 inch tablet has a resolution of 1024px and a top mobile in landscape is not much smaller, so I still want a 1000 PX slideshow to show my images to the full on a mobile in landscape,

So I have been playing with image quality
I had always saved my images at 85%, but after playing I can get away with much smaller,
Desktop at 50%
Tablet at 20%
Mobile at 5%
And the images still looked excellent,

I have not found a solution yet that uses quality as a reducing factor, do you know of one?



Sent from my Nexus 7 using Tapatalk 2