Until now, all my image thumbnails were 150px x 84px in landscape orientation. It didn’t matter whether the image was portrait or landscape: whenever it was even remotely possible, I turned a portrait image into a landscape one, and quite often even that didn’t work out, so only part of the original image was captured, which frequently left out the main subject, usually located in the middle of the image.
I was called out on this and asked to do something about it, so first I wrote a new unified class where I simply specify attributes describing what should happen to the uploaded files, so I don’t have to deal with the same thing over and over. Then I doubled the size of the thumbnails to 300px x 168px, so they should still be in the 16:9 format. And that is already pretty big, considering that the maximum width of an image on sunamo.cz (height is unlimited) is 600px, so a thumbnail is half of that. However, a thumbnail has very little chance of actually reaching the full 300px, because now that I’ve enlarged the thumbnails, I always include the whole image in them.
This means that images originally in portrait orientation will have large empty space on their left and right sides. Landscape images fare better, although if they are much wider than they are tall, there will be empty space at the top and bottom. In most places I display images at their normal resolution, so I had no trouble with this, and the size shrank automatically almost everywhere.
And where I have it specified in CSS, it now looks unnatural; take a look, for example, at the page 👻 The website closed up shop and took the sign down too. So I’m off to write a script that will scale those images up for me :). EDIT: It’s done, you can take a look, for example, at 👻 This page has gone to the internet’s happy hunting grounds.. If it looks different for you than at https://cl.ly/ZGkL , clear your browser cache or use a different browser