Serendipity icon indicating copy to clipboard operation
Serendipity copied to clipboard

Respect thumbnail usage for responsive images

Open onli opened this issue 5 years ago • 1 comments

Related to https://github.com/s9y/Serendipity/issues/474 and https://github.com/s9y/Serendipity/issues/682

Have a look at https://www.onli-blogging.de/1929/Knives-Out.html and look at what image gets downloaded. The scrset is this:

/uploads/knives_out.jpg 1920w,
/uploads/knives_out.1200W.serendipityThumb.jpg 1600w,
/uploads/knives_out.800W.serendipityThumb.jpg 1200w,
/uploads/knives_out.400W.serendipityThumb.jpg 600w

And correctly, in a big window uploads/knives_out.jpg gets downloaded. Correctly? Not really, because that image is set with the "use the thumbnail" option, which in my blog has a width of 800. And that is indeed set as width="800".

@yellowled, is it correct that browser (in this case FF) do not consider the image width here? I might be missing something.

If the browsers do not handle that situation we should do it in the core and limit the srcset to the image thumbnail width. But what about high dpi displays, do we need (and can we) detect them and give them bigger images as well?

onli avatar May 28 '20 16:05 onli

Okay, I got it: The browser does not now how big the thumbnail is, it can't decide intelligently which thumbnail to use. So we really have to handle that on our end and adapt the srcset.

onli avatar May 29 '20 08:05 onli