Retina Display

[marlis]

Hi All,

My customer loves the website created with WD8 Pro. However, IMHO, the photos and graphics images look horrible on the latest retina display devices - iPad 3 and iPhone4. What can be done to improve the resolution of the images? Some are merely dragged and dropped onto the page or into a photo frame or into a photo gallery widget. They start out as high resolution images but are somehow being automatically downsampled. How do I control this whether for a gallery widget or static image and what are the optimum settings? The website is www.spacecoastcrew.org .

[Cloud]

The first thing and best thing to do is to select the image and go to web properties > image and from web image type select JPEG and move the slider to 100%, this will keep the image at or near the resolution you imported it into xara, beware though that this will increase the size of the image, generally keep all photos as jpegs and graphics as png as it gives better images on larger areas of a solid colour such as reds, but if the image has a transparency of some sort then it has to be a png.

[gwpriester]

Marlis

The photos on your home page (if these are the photos to which you are referring), look soft and not crisp on my PC browser. Plus the colors look abnormally bright as if you cranked up the saturation.

If you modified the saturation on your computer to make the images look better, then there may be a calibration problem with your monitor.

[marlis]

Thank you Skech,

Is there a way to make the default 100%? Also is there a general rule of thumb or recommendation regarding resolution that trades off good enough imagery for retina display with time to load a page? What compromise is generally done in practice?

[marlis]

Thanks Gary,

Yes, the photos were taken in "vivid" mode resulting in high saturation. That is a matter of taste. The softness is a problem. I am reluctant to move all the image sliders to 100% due to concern over page load time. Although I expect the best way to know for sure is to try it. And most likely I don't need 100% on all the images - just whatever it takes to get to 264 ppi.

[gwpriester]

When we did our iPad (non-retina display) of our stereogram apps several years ago, I used PNG, but this was for publishing directly to the iPad and the images were razor sharp. But 24-bit PNG is a lot larger in file size than JPEG, so not surprisingly, the image quality for the PNG images is sharper.

But even so, if the image sharpness is not all that sharp on my monitor, then the images in retina display are not going to be any better.

Xara automatically exports all images for website publishing at 96dpi and I am not sure if there is anything you can do about this.

85% quality (15% compression) generally produces a good balance of image quality to file size. I will occasionally export a JPEG at 90 or 95 if there are areas of solid color, reds especially. But 85% as a rule works fine for me.

Can you post two examples of one of your vivid photos at 100% image and the same image at 85% image quality so we can compare them here?