0

I am developing a fluid website. To achieve maximum image quality and minimum image load times I use different sprites for different resolutions (e.g. 1680+, 1440+, 1280+, 1024+, 800+, 1680@2x (for retina), 1440@2x,..) selected via @media queries.

I end up having 10 different sprites. Simply scaling down the high-resolution images via CSS (background-size or max-width) leads to a loss of quality (especially for icons) and a not needed overhead in image file sizes.

Scaling down images 10 times with Photoshop and fine-tuning them cannot be a good practice (Imagemagick won´t work for me here). How to do it right?

Riebel
  • 789
  • 2
  • 10
  • 22

1 Answers1

0

If you need to fine-tune every downscaled image, you need to do it for each one.... If not, I suggest two sizes, one for "high resolution" and one for "low resolution".

zen
  • 122
  • 10