conventional sites: retina or not?

[hoja]

While with my next project I would like to deliver Retina content I am hesitant. In the past with
Supersites I had to learn the hard way that any user had to download the whole site, including
all high res imagery, whether the device could handle it or not.

Can anyone confirm from practical experience that if one outputs as Retina (using the traditional
website format) only suitable devices download the Hi Res content?

[gwpriester]

I am not sure. But you can publish a test page or site to Xara.Hosting which is the default publish option and then try it out.

Add a simple name in the Optional Sub-folder window.

Then try it out on various devices. Images that have retina resolution will be named with a 2x. So, image-name.jpg and image-name@2x.jpg

[Egg Bramhill]

In the past with
Supersites I had to learn the hard way that any user had to download the whole site, including
all high res imagery, whether the device could handle it or not.

Don't know where you got that from hoja. The thing with supersites is they do have to download all the 'pages' in one go, so this can be a downside on a large site. However, it's my belief they only download the images to suit the device that's viewing the site.

I've tried it on my desktop & my iPad and both only download the required image that's best for that device.

Here is a supersite which servers up either 96ppi images or 192ppi retina images.

Supersite

In FF you can right click an image and select 'view image info'. On my destop it shows only 96ppi images loaded.
Apart from the menu buttons it loads 'mountain-shower.jpg', 'swimming.jpg' and 'drone.jpg'. No retina images.



And a conventional site again both with 96ppi & 192ppi retina images

Conventional Site

Again in firefox do the same 'view image info'. On my destop it shows only 96ppi images loaded.
Apart from the menu buttons it loads EITHER 'mountain-shower.jpg', 'swimming.jpg' and 'drone.jpg' dependant on the page you view. No retina images.

[gwpriester]

Egg - A few years ago when I was doing my First Look review for WD 11, I did a Supersite and it took about 20 seconds for the home page to load. It was a nightmare. Of course I was trying to cover all of the new features and that created a tremendous download.

In retrospect, a conventional website is best for content heavy sites.

[hoja]

Egg,
thank you very much for setting up these samples – I would have trusted your words too :o) !

My bad Supersite experiences were based on the (the pretty obvious wish) to have properly named imagery. Hence I used
the (filename="xyz.jpg"...) method, with the effect that I indeed got names but by that also forced Xara to skip resizing and
downsampling of all my source content. This would already have been enough to end up with > 30mb, but I believe I even
saw all 2x...jpg when checking the download folder.

As I have no retina devices in the house I thought it was better to ask this time.

[hoja]

I did a Supersite and it took about 20 seconds for the home page to load. It was a nightmare

Yeah, I have optimized content in the meantime but load times are still considerable.

[siran]

Hi hoja,

there is some code in the Xara javascript that looks like this (I refer to version 365 here):

if ((window.devicePixelRatio && window.devicePixelRatio > 1) || xr_autoscale) {

And in the following block of code the hi-res images are activated.
To me that means that the hi-res images are only used if a retina display is detected or you created a presentation or a supersite with the scale to fit option.

I think this supports Egg's answer.

[hoja]

Thank you Siran,
and this detail you mention here...

To me that means that the hi-res images are only used if a retina display is detected or you created a presentation or a supersite with the scale to fit option.

...supports that my previously mentioned Supersite observations were correct :o). By naming objects and by using the (nice looking) Scale to Fit Option
I unwillingly made sure that all my input files were uploaded at uncropped and uncompressed size and that every little Smartphone downloads all files at 192dpi.

All of this is of course entirely undocumented...

[pauland]

it's my belief they only download the images to suit the device that's viewing the site.

Both sites viewed on a retina device..