Thread

I have a client who is a photographer who wants a relatively complex portfolio website.

They’ve requested that the site serve up ‘retina’ images for higher resolution displays.

After some pretty extensive searching I feel none the wiser on how to approach this. The simplest method seems to be use Retina.js to display ‘@2x’ versions of images when required, but I don’t know how to go about generating the images.

I’ve looked at a few different plugins and Channel Images is the only one that mentions the ability to create a retina image on upload. This seems overkill though, as the client will only have one image per entry along with some information about the image.

I’ve also looked at CE Image and Assets, but really don’t know the best way to go.

Has anyone managed to create a workable solution?

Have a look at EE’s Image manipulations - http://ellislab.com/expressionengine/user-guide/cp/content/files/file_upload_preferences.html

You can specify any number of image sizes here (based on the original image file), and EE will create those for you on upload so yuou only need the one original image.

Typically I use this in image galleries to produce various sizes as required, eg:

small (image thumbnail)
medium ( for display on a “detail” page)
large ( for lightbox etc)

Then use the original as an option for “download original” if needed.

Anyone found a good solution here? 😊

Check out this apple page for some good info on retina targeting: https://developer.apple.com/library/safari…..
It’s webkit specific but helpful.