Take the 2-minute tour ×
Webmasters Stack Exchange is a question and answer site for pro webmasters. It's 100% free, no registration required.

I am going to have a website which will deal with a lot of images. What is the best way to optimise them for Retina display without having much of an impact on website loading times?

There seems to be a lot of mixed signals about how to optimise for Retina display too. Do you need 2 instances of the same image, then load one or the other depending on if the device the site is running on has a Retina display?

Any help on this topic and specifics about optimisation would be appreciated.

Jack

share|improve this question
    
On my website, I have a stock of images that I use quite a bit and I put them all into a font and use that font to serve images. Its light and always looks sharp! –  karancan Apr 7 '13 at 1:44
    
When you say images, do you mean photos or icons? –  Ivar Apr 7 '13 at 12:32
    
Sorry for not specifying. I have a lot of unique photos that need optimising on the same page. –  Jack Griffiths Apr 8 '13 at 16:42
add comment

1 Answer 1

up vote 1 down vote accepted

Everything is a compromise:

  • To preserve bandwidth, simply ignore the Retina display and serve normal images as usual.

  • To maximize image details, you have to serve the higher resolution images to those with a Retina display. You can see how it can be done here or here.

Regardless of which you choose, always optimize your images, compress them to your liking but no more and strip metadata. You can save a good chunk, depending on the image. Some include thumbnails, ICC profiles, etc. It may be wise to keep only copyright information though which takes a few bytes.

The point to know if that Retina images will always take more space than regular ones which equal compression because they are more detailed. So the best thing to do is decide when the extra resolution helps your visitors and when it does not.

share|improve this answer
add comment

Your Answer

 
discard

By posting your answer, you agree to the privacy policy and terms of service.

Not the answer you're looking for? Browse other questions tagged or ask your own question.