Stacks Image 530


Alternate loading images for high resolution (retina) devices

This is a live side-by-side that will only display on retina devices

Stacks Image 707
Stacks Image 705
Stacks Image 709
  • Create 2 images with one twice the size (or larger if preferred) in the Resources section to the left. The larger one should have a name ending in the suffix along with the file type extension. Example: image1.png and image1_2x.png. Note that only the image1.png would be entered into the field in Retina Ready's customization options, but both images must be located in the resources sections.
  • For organization you can create a folder in the Resources section (right click Resources) in which case the folder name would come before the image name followed by a forward slash and then the image name. Example: folder/image1.png
  • Retina ready will not load the larger image unless the device calls for it. This will save on load time and provide the visitor with the best intended quality for their device.
Stacks Image 265