I’m just uploading the images here to reduce access to external resources.
3 Likes
I like the third one.
The third one is the full size cemetery (main layer) with a width of 2358 pixels (with extended background layers to fill the whole width).
The second one is the one I’ve used previously on userstyles, it’s the same image as the full width one but resized to a width of 1920 (“Full HD”).
I had to use a version with reduced colours since there is a size limit on userstyles for images. I’m now referencing this image from here instead, although still not perfect because Discourse converted this image to JPEG (which it hasn’t with the third one).
Btw. the first image uploaded here isn’t actually the one used via userstyles, I’ve added a little Easter egg there 
It looks like one of those 90s magic eye pictures and seems to spell out something…
Oh yeah. I could never get those to work for me!
Me neither. Or… I always got those in reverse. You know, you should focus “behind” the picture, but I actually always crossed my eyes and focus in front of it, so whatever I had to see was engraved instead of embossed, making it basically impossible to recognize.
Me neither at the time they were all the rage (and it made me crazy like Mr Pitt in that one Seinfeld episode). But about 10 years ago I dug about one of the old books and tried it and suddenly it worked somehow. I don´t really know why, though.
I always did that thing and always obtained the reversed version of the stereogram. It was like a superpower.
Must feel like being able to punch holes into everything with your eyes…awesome!
The height of the third one is also smaller, right?
Can you tell me what this limit is?
Could you give me the original image (which I assume was in a non-lossy image compression format)? I would like to experiment with it a bit and see if I can motivate Discourse to keep it in its original format.
Anyway, I have to confess that my interest about changing the top graphics of the forum wasn’t a personal one. I’m OK with the graphics. I was thinking more about a “heading of the month” thing, something that everyone could see.
They all have the same height of 140px which is the default header height with the default forum style here.
Since I use the compact header option I ensure they look good at a height of 82px (vertically centered).
First a clarification: This is a limit about screenshot sizes you are allowed to upload on userstyles.org, it has nothing to do with userstyles in general.
The limit is about 200 KiB. Also you can upload only up to 5 images and they are meant to “demonstrate what your style does”.
I assume it’s either using JPEG or PNG depending on which one results in a smaller file size. The full size image uses the original pixels from Mark while the other one was resized, i.e. having a lot of interpolated pixels making PNG less efficient.
I’ve already tried adding a transparent pixel to prevent JPEG conversion but it didn’t work.
Sweeeeeet, can you do the other directly connected rooms, too. Pretty please?
3 Likes
Can I ask you which resizing/interpolation algorithm did you use?
This is your resized version in PNG format. Discourse shouldn’t convert it to a lossy format:
When you copy-and-paste an image from clipboard to a Discourse window, Discourse will receive “raw” data and it will try to compress it as the CMS wishes. But if you use the “upload” option of Discourse, your image file should be kept as it is, unless it’s really big.
It could be possible to make the resource even smaller working on the interpolation algorithm you used when resizing it.
Also, your fullsize version wasn’t optimized. I was able to remove 17% of its size keeping the pixels identical:
Bicubic
Thanks. Read above to see what I did.
This didn’t work for me: I did go to ‘Add an image’, ‘From my device’, clicked on ‘Upload’ and then it showed me the snipped with .jpg as file extension.
I just did it again and it was the same. Then again and now it’s .png, then again: .jpg, then .png…
There may be some caching issue or maybe there are multiple image conversion workers which behave differently.
e.g. I’ve now uploaded twice the file ‘cemetery resized (v3).png’ and got this as result:
Note the different filenames which actually don’t match the filename I’ve used at this point in time, but were older ones I’ve used previously (files which had the same content).
It would be smaller when using a simpler algorithm (like nearest-neighbour) but for down-scaling that’s not what I want to do. Size issues were a concern for userstyles.org only anyway which I didn’t want to use anyway.
It doesn’t really matter in this case because after uploading to Discourse similar optimisation is applied which results in the file I am referencing in the style.
That’s strange, it never happened to me. I only use one device and I always use the same method to upload an image to the post. The only time when the system changed the image format from PNG to JPEG was when I uploaded very big images.
A cache does probably exist, but I still find it strange that one of the cached versions of the images is a JPEG.
Some CDNs can be configured to automatically transform images, but I don’t think that this is what’s happening here because the CND used for hosting the images shouldn’t have that feature.
That kind of interpolation would lead to significantly smaller sizes but a slightly better compressible image might be achieved also using resampling algorithms alternative to bicubic.
In this specific case the final visual result would be pretty much identical regardless of the used algorithm, because the differences in the interpolated pixels are too subtle to be recognized by the eye. The only important thing that changes is the size of the image.
Just as a proof of concept (I hope you don’t mind talking about this absolutely minuscule aspects, I just like experimenting with graphic algorithms and compression 
) I have taken your original “cemetery fullsize (v2).png” and I have proportionally downscaled it (from w2358 to w1920) using different resampling algorithms and switching on the maximum PNG compression level (value “9” on my software):
| Compression 9 | Compression 9 + lossless optimization with special software | |
|---|---|---|
| B-spline | 174 KB | 168 KB |
| Hermite | 191 KB | 184 KB |
| Lanczos | 227 KB | 219 KB |
| Mitchell | 193 KB | 187 KB |
| Triangle | 186 KB | 180 KB |
…which make us conclude two things:
-
The choice of the resampling algorithm can significantly change the size of the file (the difference between B-Spline and Lanczos is +30% in size).
-
Regardless of the resampling algorithm, further lossless compression is possible with special software.
Size optimization is a concern for every user that has to download files. In this specific case we are talking about a website with a small quantity of traffic, but as a general rule losslessly compressing images (even further) is an activity beneficial to everyone.
“Similar” does not imply the best kind of optimization. Actually, if Discourse observes that they cannot create a smaller file from the manually optimized one that I uploaded, the CMS should just keep my file.
The only way to create an even smaller file would be to send a lossless WebP version of the image to those clients that support this format. But it doesn’t seem to me that this mechanism is in place, on this website.