How to Resize and Compress Images for the Web
Last updated
Image dimensions and file size are related but different. Resizing changes the pixel width and height; compression changes how the image is encoded. Combining the two can make a photo faster to upload or share.
Steps
- Keep a copy of the original image.
- Use Image Resize to set the pixel width and height. Keep the aspect ratio locked unless you intend to stretch the image.
- Use Image Compress to compare a smaller quality setting with the original.
- Choose the output format supported by the place where you will use the image, then inspect the result at its intended size.
Choose dimensions for the destination
A 4000-pixel photo is often larger than a web page needs. Start from the displayed size of the image in the destination, then leave a little extra for high-density screens. Pixel dimensions describe the image grid; DPI alone does not add pixels or make a web image sharper.
Avoid enlarging a small image unless you accept softness. If the tool offers a keep-ratio option, use it to prevent faces and objects from looking squashed.
Balance quality and file size
JPEG and WebP can produce smaller photo files, but stronger compression may create visible blocks or blur. PNG is usually better for transparency, screenshots and crisp text, though it can be larger for photographs.
Check the compressed result at normal viewing size. If fine text, edges or gradients look damaged, raise the quality or use a less aggressive format.
Common questions
Should I resize or compress first?
Resize to the dimensions you actually need, then compress and compare the result.
Does compression always make a file smaller?
Not always. Some files are already optimized, and PNG can be larger than the source in certain cases.
Will resizing change the original?
No. The tool creates a downloadable result and leaves your source file unchanged.