Matching image size to device

I have been watching Joe Workman’s video about Foundation 6.

At about 35 minutes in he talks very briefly about supplying differently optimized images for different size devices. He said that you would, for example want to supply a different size image for a mobile device than you would for a retina display.

This seems like a lot of work for an image intensive website. I imagine the resolution needs to be controlled in post processing for the photo. Is there some kind of switch inside RapidWeaver that corrects for device resolution?

Can anybody elaborate why this is necessary? Does it just affect image resolution on the device or does it somehow affect load speed etc? Is the result just something you can only empirically measure or does it actually affect user experience?

It’s more about page size/speed and screen size. F6 gives you the ability to load small image for a small screen mobile device another for a tablet, computer, Retina display. Etc. it’s not required, to use multiple images each optimized for a a device. But, if you want the best possible speed and image quality for each device, F6 gives you that ability.

Thanks for the explanation Scott.

After I made that post I watched that part of the video again. I saw where there was an option in the dialog box to select for Retina devices.

I assume from this that when you browse for image selection RapidWeaver uploads whatever resolution level is inherent to the image you select.

Does not selecting for Retina device just optimize automatically for iPads vs smart phones, or is there additional selections that need to be made to parse this further?

When warehouse is the source. In the picture stack it’s self, you can add additional images. if you want.

This topic was automatically closed 30 days after the last reply. New replies are no longer allowed.