So you got a new iPad and realized your images do not look as good as they do on your computer, right? Don’t worry, there is a very simple way to achieve good looking images on this device:

If you want to create a 500 x 500 px on a Retina display, create an image at 1000 x 1000 and then use CSS to control the image size down to 500 x 500:

img {
  width: 500px;
  height: auto;
}

Now the interesting part of this is to prevent your non-iPad visitors from unnecessarily downloading the larger images.

Tip: Try also playing around with your images resolution. iPad with Retina display native resolution is 264 dpi’s.