Image resolution and DPI, explained properly

·5 min read

Resolution confuses people because one word gets used for two different things, and a second number — DPI — gets treated as though it describes the image when most of the time it does not.

Sorting this out makes a lot of practical decisions straightforward: what size to export at, whether an image is good enough to print, and why something that looked fine on screen came out blurry on paper.

The only number the file really has

A digital image is a grid of pixels. Its resolution, in the meaningful sense, is how many: 4000 pixels wide by 3000 tall, for example. That is twelve million pixels of actual information, and it is the whole of what the file contains.

This number is fixed at capture. You can throw pixels away by downsizing. You cannot create real ones by upsizing — enlarging invents plausible in-between pixels by interpolation, which produces a bigger, softer image containing no more detail than before.

Everything else about sizing is a consequence of this one number.

Why DPI is meaningless on a screen

DPI — dots per inch, often written PPI for pixels per inch — is not a property of the image data. It is a note stored in the file's metadata saying how densely the pixels should be packed when printed on paper.

Change an image from 72 DPI to 300 DPI without changing its pixel dimensions and you have altered one number in the metadata. Not a single pixel changed. The file size is identical. On screen it will look exactly the same, because a screen displays pixels using its own pixel grid and ignores the DPI note entirely.

This is why "save it at 300 DPI for the web" is meaningless advice, and why "your image is only 72 DPI" is not a real problem if the pixel dimensions are large enough.

The number only becomes real at the moment something is printed. Then it determines physical size: 3000 pixels at 300 DPI is a 10-inch print; the same 3000 pixels at 150 DPI is a 20-inch print at half the detail density.

Working out what you need for print

The arithmetic is simple: pixels needed = print size in inches × DPI.

For good quality printing, 300 DPI is the standard target. So a 6 × 4 inch photo print needs 1800 × 1200 pixels. An 8 × 10 print needs 2400 × 3000. An A4 page at 300 DPI is about 2480 × 3508.

Large-format work is the exception people get wrong in the other direction. A billboard is viewed from thirty metres, and 300 DPI would be absurd — large prints are routinely produced at 100 DPI or less because nobody is standing close enough to tell. Viewing distance, not print size, is what determines the density you need.

Run the calculation before ordering prints. A phone photo at 4000 × 3000 makes an excellent 10 × 13 inch print. The same photo cropped down to a quarter of its area has 2000 × 1500 left and is at its limit around 6 × 5 inches.

Working out what you need for screen

For screens, forget DPI and think about the pixel width of the space the image will occupy.

A full-width image on a desktop site rarely needs more than 1920 pixels across. An image in a content column is typically 800 to 1200. A thumbnail is 300 to 400. Anything beyond that is data the viewer downloads and cannot see.

The complication is high-density displays. Retina and similar screens pack roughly twice the physical pixels into the same space, and to look sharp on them an image needs about twice the pixel dimensions of the layout space it fills. An image displayed in a 600-pixel-wide column wants to be around 1200 pixels wide to stay crisp on those screens.

Doubling is the practical ceiling. Going beyond 2× is invisible on any current display and just costs load time.

Resolution and file size are related, but not simply

Halving both dimensions of an image quarters the pixel count, because you are halving in two directions at once. This is why resizing is such an effective way to shrink a file — going from 4000 pixels wide to 2000 removes 75 percent of the data.

File size does not fall in exact proportion, because compression is involved. A smooth image compresses far better than a detailed one at any resolution. But the relationship is close enough that resizing is almost always the biggest lever available.

This is worth remembering when a file is too large: reach for resize before compress. Compression degrades what is visible; resizing removes pixels nobody was going to see.

Practical rules

Condensed to what you actually need to remember:

  • The pixel dimensions are the image. Everything else is interpretation.
  • DPI matters only for print. On screen it is an inert piece of metadata.
  • For print, multiply the physical size in inches by 300 to get the pixels you need.
  • For screen, use the display width, doubled if you want it sharp on high-density displays.
  • Downsizing is safe and effective. Upsizing produces a larger file and no more detail.
  • Always keep the original. You can make a small version from a large one at any time; the reverse is not possible.

Rendering PDF pages to images

Converting a PDF page to an image is a slightly different situation, because a PDF page is defined in points rather than pixels — the page has a physical size, and the text and vectors on it are resolution-independent instructions rather than pixels.

That means you choose the resolution when you render. A scale factor of 1 produces roughly 72 pixels per inch, which is small and soft. A factor of 2 gives about 144 DPI, which is fine for screen viewing. A factor of 4 or so approaches 300 DPI and is suitable for print.

Because the source is vector, higher scale factors genuinely produce more detail rather than interpolating — up to the resolution of any embedded images, which are fixed and will go soft once you render past their native size. Memory is the practical limit: rendering an A4 page at 4× produces an image of roughly ten megapixels, and doing that for two hundred pages at once will exhaust a browser tab.

Tools mentioned here

All free, all run in your browser, none of them upload your files.