The practical answer: keep the aspect ratio locked, resize from the best available master, and normally downscale to the largest pixel dimensions the final placement needs. Avoid enlarging a small source; resampling can create more pixels, but it cannot recreate missing detail.
Pixel dimensions are not the same as file size
Dimensions describe width and height in pixels, such as 1600 × 900. File size describes stored data, such as 240KB. A resize changes the pixel grid; compression changes how efficiently that grid is encoded. Either can reduce file weight, but they solve different problems.
Example: two 1200 × 800 images can have very different file sizes because one is a simple graphic and the other is a detailed photograph, or because they use different formats and encoder settings.
The guide to compressing images without losing visible quality explains how dimensions and encoding work together.
Preserve aspect ratio to prevent stretching
Aspect ratio is the relationship between width and height. A 1600 × 900 image is 16:9. If its width becomes 800px, its proportional height is 450px. Setting it to 800 × 600 instead forces it into 4:3 and distorts the subject.
| Original | New width | Proportional height | Result |
|---|---|---|---|
| 2400 × 1600 (3:2) | 1200 | 800 | Correct proportions |
| 1920 × 1080 (16:9) | 960 | 540 | Correct proportions |
| 1000 × 1000 (1:1) | 600 | 600 | Correct proportions |
If a fixed container needs a different ratio, crop intentionally instead of stretching.
Percentage resizing versus maximum pixel dimensions
A percentage applies the same scale to every image: 50% turns 2400 × 1600 into 1200 × 800. A maximum-width or maximum-height rule is more useful for mixed batches because only oversized images need to shrink.
Use percentage resizing
Choose it when a consistent relative scale matters, such as producing half-size review copies from similarly sized originals.
Use maximum dimensions
Choose it for web publishing, where every image must fit within a 1600px content width without enlarging smaller sources.
Downscaling is safer than upscaling
Downscaling combines source pixels into a smaller grid and can preserve a clean appearance when the resampling method is suitable. Upscaling estimates new pixels between existing ones. It may smooth jagged edges, but it cannot restore eyelashes, product texture or lettering that the original never captured.
Start from the highest-quality master available. Resize once to the final requirement, then apply suitable output compression. Repeated resize-and-save cycles can progressively soften lossy images.
Resampling, sharpness and format considerations
- Review fine text, diagonal edges and faces after resizing.
- Apply sharpening cautiously after a substantial downscale; too much creates halos.
- Use JPG or WebP for most photos and PNG where transparent or crisp graphic pixels matter.
- Keep SVG artwork as vector when possible; changing width and height attributes is not the same as raster resampling.
- Check colour, transparency and orientation in the final exported file.
If format choice is unclear, compare the trade-offs in JPG vs PNG vs WebP vs SVG.
Practical website, email and social-media examples
| Placement | Source | Practical output |
|---|---|---|
| Website article image | 5000 × 3333 photo | 1600 × 1067 for a 1600px maximum content width |
| 600px email banner at 2x | 3000 × 1500 artwork | 1200 × 600, displayed at 600 × 300 |
| Square social post | 2400 × 1600 landscape | Crop to square first, then resize to the platform requirement |
Common mistakes include typing width and height independently, enlarging a thumbnail for a hero placement, confusing DPI metadata with real pixels, resizing before cropping, and uploading the full camera source when the display is much smaller.
For fixed social placements, the Social Media Image Resizer provides platform presets. For email densities and layouts, see the Email Image Optimizer.
Frequently asked questions
How do I resize an image without stretching it?
Lock or preserve its aspect ratio and change only one dimension, allowing the other to be calculated proportionally. Crop if the destination requires a different shape.
Does making an image smaller reduce quality?
Downscaling discards pixels, but a good resampling method can produce a clean result for the smaller intended display. Keep the original master for future larger uses.
Can I enlarge a small image without losing quality?
No method can recreate detail that was never captured. Upscaling can estimate pixels and improve presentation, but the output does not gain genuine source detail.
Does changing DPI resize an image?
Not necessarily. DPI or PPI metadata can change print interpretation without changing the actual pixel width and height used on screens.