Question about Retina images


#1

From the Stacks 3 announcement:

I can see where Stacks 3 is now creating copies of some images files with the @2x suffix, but they appear to be just double the size of the original, this seems to create images that are a little fuzzy, i.e… they lack the definition that would usually come with a larger original image versus a scaled up image.

Is there a way to turn that off so it does not create these files, or do I have to warehouse every single image file that I use to create my own @2x files ?


(Isaiah Carew) #2

Stacks should only create @2x images when the original image is large enough – it should never up-scale images – and shouldn’t ever create blurry images.

As always, if you drop in an image that you use as-is, without scaling or editing within Stacks, then Stacks 3 (and 2 before it) will leave the image completely untouched and export it as is without modifying the file in any way – even meta data (such as EXIF info) is retained.

Isaiah


(Isaiah Carew) #3

That said, you may want to consider using the Stacks 3 feature of exporting an @2x image. If you do, then users with hi-resolution displays (like most mobile phones) will see a much sharper image – while those with regular displays still see the regular image.

Isaiah


#4

Where can I find the details on the Stacks3 Export @2x image function ?


(Isaiah Carew) #5

In the post right above the question. :wink:

OK, OK. Kidding. Mostly. :stuck_out_tongue:

Joking aside retina, @2x (and @3x!!!) and how they are integrated into the exported HTML is something we intend to keep flexible as the web has not entirely decided on what the best way to go about doing this. I fully expect that it will look significantly different in a year.

For this reason we probably won’t document the specifics of this but keep it as an “implementation detail” – just like the other HTML/CSS/JS structures that stacks exports.

That said, if you want something more/less/different there are myriad options at your fingertips in the RapidWeaver Community to download. Stacks only tries to cover the de facto basic functionality – we leave the interesting stuff in the capable hands of the 3rd party devs.

Isaiah


(Isaiah Carew) #6

BTW: if you have specific questions about the export stuff – i’d be more than willing to answer in great nerdy detail on the Stacks slack board: http://slack.yourhead.com – but i don’t really feel that the forum is the right place for that sort of thing – the forum indefinitely stores those things, google will index them, and novice users will find them for years to come.

it helps novice users a great deal if we can keep the transient implementation details that are likely to change out of the google search results.

isaiah


(Karsten Müller) #7

Hey,

maybe I’m out of date, but I Can’t find any @2x image on my server or something else. Also there is not “srcset” description on my quell code . What do I wrong?

Best regards . . . Karsten


(Isaiah Carew) #8

This is a topic from quite a while back :stuck_out_tongue_closed_eyes: (2015!) And, if I recall correctly was part of a larger discussion on the topic…

But the answer is mostly the same today as then…

Stacks will only add @2x images when it can. It will never scale images up to create them – that wouldn’t even make sense.

In practice what this means is that you have to scale your images (make them smaller) by 50% or smaller before you will see scrset. But once you do that – the rest is automatic.

So just double click the image, and slide the scale slider down to 49% or so. Like this:

And if you view the source you should see the srcset with both image sizes, a little like this:

Pasted_Image_10_2_17__12_51_AM


(Karsten Müller) #9

Hey,

many thanks for your answer.

The note "So just double click the image, and slide the scale slider down to 49% or so. Like this:“ was the important information for me. :slight_smile:

Beste Grüße . . . Karsten