For a non-pixel-monkey, adjusting a high-resolution stock image for use in a website at a specific pixel size/aspect ratio and to a limited filesize is trickier than it sounds…
Three separate functions are required
- cropping something compositionally decent to the correct proportions
- resizing the image pixel data down (never up!) to the required size
- compressing for web delivery
This process is second-nature to me and my weapon of choice, Photoshop, makes it a breeze. Finding another cheap/simple tool to crop and resize on macOS for a client was not a happy search.
I researched then downloaded a handful of options: Fotor, PhotoPad, Gimp, even macOS’s built-in Preview app. None of these options made it an easy job. For example, Fotor and Preview won’t allow you to change the crop-box and maintain proportions. PhotoPad I’ve put out of my mind, Gimp is too much for a normal person to grasp.
In the end, the easiest thing is to use an online tool.
Go to https://resizeimage.net/
- Upload your image
- Crop. Use Fixed Aspect Ratio: apply the dimensions of the final image you want, ie 1200 x 480. Drag over the image preview to set the crop/composition
- Rotate (ignored)
- Resize: enter the same number you had before. Now this will actually resize (shrink) the image. Ignore the “%” field
- Make background transparent (ignored)
- Select JPEG output
- Set Normal Compression and choose Compression level.
Click Resize Image.
Check your image for quality/size. If too big or too many JPEG compression artefacts adjust step 7…
Last Updated on 11th February 2020 by Gabriel de Kadt