Size a stack of images to the same dimensions
A stack of images with a random height and width that all need to go to the same dimensions. And you cannot use CSS cover option. Get out the digital scissors and maginifying glass.
I had to bring 45 images with random dimensions all back to the same dimensions. Some nice digital production work but it sounds easier said than done. Even if only because you don't do it every day. I've written all the steps out and maybe you can use it too one day.
The images I wanted to edit were all on a web page. That page worked in Squarespace with a CSS setting that is really wonderful. It's called "cover" and it automatically brings all the images to the same size.
The new site in Leadpages didn't have this so I had to work with the digital scissors and magnifying glass. I had to start with a one size goal. The target dimensions were:
Width: 724 pixels
Height: 483 pixels
This is an aesthetically pleasing ratio between width and height. And with these sizes, the image in the web page is scaled back in a way that benefits the sharpness of HD screens. In this way, the extra pixels are used for more detailed display.
The stack of 45 images now contained images that were too high or too wide. But also images that were smaller than the intended height. In three steps I brought all the images to the same dimensions.
1. Make the same width
The first thing I did was to make everything the same width. The images were big enough so it came down to making them all smaller. I did that with a program called PhotoBulk. It was just too much work otherwise but you could also do it manually.
2. Vertical crop
Now I had to vertically crop the images that were too high to 483 pixels. I did that with Apple Preview. All done manually so I could make the right selection with composition in mind.
3. Expand and horizontally crop
Then there remained the images that were not high enough. I enlarged them to the desired height and then cropped them horizontally. Not sure I put it into clear words so I made this short video clip:
After that I was able to load them into the program again and all in all the page with the 45 images has become better. It loads much faster because the images are now optimal. Nothing is loaded anymore that isn't shown and the images have the proper resolution.
You can see them in action here:
Read more
Comments ()