How to choose image dimensions for each use
A “large” image may have many pixels, a large file size or a large display area. Start by identifying which kind of size you need to change.
Three kinds of size
Pixel dimensions are the number of pixels across the width and height. Reducing a 4000×3000px image removes detail, and enlarging it later does not restore that information.
File size is the result of encoding those pixels. The same dimensions can produce very different sizes depending on the format and quality setting.
Display size is the space an image occupies in a website or app. An image much larger than its display size can add unnecessary transfer weight.
Blogs and web pages
Check the maximum displayed width first. Preparing up to roughly twice that width is common for high-density screens, and 1200–1600px can be a useful starting point for a typical article image.
There is no universal file-size target. Reduce the file until it is reasonably small without visible damage, and use a tighter budget when a page contains many images.
- Article photo — Base it on display width · JPG or WebP
- Full-width banner — Check the layout’s maximum display width first
- Screenshot — Check text at actual size · PNG recommended
Images for print
DPI describes how densely dots are placed within an inch when printing. Changing only a file’s DPI value does not add pixels or detail.
For example, printing a 10×15cm photo at 300dpi needs roughly 1200×1800px. Calculate the required pixels from the print dimensions and the printer’s recommended DPI.
Enlarging a web-sized copy does not restore print detail. Keep the original and make separate copies for each use.
Resize for your intended use
Lock the aspect ratio and enter a width or height. Set the crop ratio first, then resize to the required pixel dimensions.
Open the editor