Deciphering Image Resolution—Part 1:
Nuts and Bolts

Some of the most common questions we receive from clients revolve around image resolution. Often, our clients will supply photographs, logos, or other assets to be incorporated into the materials we create. Sometimes these materials are supplied in sizes and resolutions that are inappropriate for the end product or solution, so we felt that some brief commentary on image resolution might help.

In preparing this essay, we ran across an excellent explanation of the different units of measure for resolution by Neil Keller, which is provided in Part 2. Although informative, Neil's explanation may provide too much information for some. Thus, our nuts-and-bolts explanation comprises Part 1, below.

Resolution, in a nutshell, describes the amount of pixel data contained in a raster (pixel-based) graphic or image. There are two basic things to remember:

  • Scale down to final size, not up
  • It's always better to have too much resolution than too little

Scale down to final size, not up.
We will be discussing two aspects of an image's dimensions: its size on the printed page—its printed dimensions, measured in inches, for example, and its true size—it's pixel dimensions.

There are two basic ways to resize an image: scaling and resampling.

Scaling: Printed image dimensions and image resolution (measured in pixels per inch, or PPI) are inversely proportional. As an image is scaled down in printed dimension, the image resolution increases. As it is scaled up in printed dimension, the resolution decreases.

As an example, a 2x2-inch image, at a resolution of 300 PPI measures 600x600 pixels. If we want to have this image print at double the size, 4x4 inches, the resolution would be cut in half to 150 PPI and may be unsuitable for printing without pixelation (visible pixels which result in a blocky appearance with jagged edges). The important thing to note here is that the number of pixels in the image has not changed; it's still 600x600 pixels. No data has been created or removed with the scaling of the image. All that has happened is the size of the pixels has been increased on the printed page.

Resampling: If we were to go back and transform this image again, this time resampling it up or upsampling (scaling the size up independently of its resolution), we effectively double both the image's printed dimensions and its pixel dimensions. The printed size is now the expected 4x4 inches and the new image's dimensions are doubled to 1200x1200 pixels. The resolution has remained constant: 300 PPI. The important question to ask here is where did those extra pixels come from? They weren't there to begin with. We only started with a 600x600 pixel image. In upsampling the image, we've left it up to the application being used to process the image to interpolate, or "make up" the extra pixel data. This typically yields images that look softer than the original and also introduces pixelation. Both of these methods used to increase printed image size should be used with caution as the results are usually not ideal.

So, what's the solution to an undersized image? Begin with a larger source image.

It's always better to have too much resolution than too little.
Since scaling up without resampling decreases resolution, and upsampling an image can often result in softer images and unsightly pixelation, it's always advisable to begin with a source image that is larger than you can foresee needing. Scaling down or downsampling are both appropriate methods to decrease an image's printed dimension. Throwing away data when downsampling is fine; it's leaving it up to the application to interpolate and create extra data when visual image artifacts typically appear. When downsampling, you may be left with more resolution than needed for the job (remember: printed image dimensions and resolution are inversely proportional), but that is easily adjusted in production by the designer.

We typically recommend that images destined for press have a minimum resolution of 300 PPI at final, printed dimension. Images for on-screen display are typically 72 PPI at their final pixel dimension. If the final dimensions are unknown, which is not unusual, an oversized image is required so that the designer can scale down to the appropriate size for the design.

Deciphering Image Resolution—Part 2: DPI, PPI or LPI—what's the difference? >