alfa1.jpg
0659.jpg
0566.jpg
CL00office.jpg
Contact
Digital image size for print and web

The web is crammed with images, and it's tempting to use them in print articles. Legal and ethical issues aside, there are fundamental differences between images used on the web and images used in print. Pics from a website will rarely be much use in print.

Let's look at an example:

Image

On screen this looks like a fairly big image, and it might be tempting to try and use it in a magazine or newspaper. But there's a problem. If we use that same image in print it ends up looking like this:

Image

In print, the image reproduces at a much smaller size than you might expect. The problem is that print reproduction has much higher resolution than a computer screen.

The resolution of a digital image is measured in 'dots per inch' (it's an area which has yet to go metric). The dots are pixels, the individual elements which make up the image. The greater the number of pixels in each inch of image, the higher the resolution of the image - and the more detail it can show.

Images on websites are usually 72dpi, whereas images for high-quality print reproduction (eg in a magazine) are usually 300dpi - so a one-inch-square image on screen is 72 x 72 pixels, but a one-inch-square image in print is 300 x 300 pixels.

If we take our 72 x 72 pixel image and try to use it in print, it will be only 0.24 (72 divided by 300) inches square. Any image taken from a website will appear about a quarter the size in print.

Of course, in InDesign and QuarkXpress it's up to us how big we use images - so why can't we simply use the image scale settings to blow up the picture to the size we want? If we scale up the image to 400% in both directions, it should be the right size again.

The trouble is, we end up with this:

Image

We've taken a small image and increased its size, but all that's happened is that we've taken a tiny amount of data and spread it across a wider area. We haven't increased the detail in the picture, so at this large scale it looks fuzzy.

Whenever you use an image at more than 100% size, the image loses definition - it becomes fuzzier.

Resizing the image in Photoshop is marginally better, because Photoshop has a more sophisticated resizing method. But even this does not add information back into the image: all it does is use a guesstimate to synthesize more pixels.

Images for print: how big do they have to be?

As we've seen, images for high-quality printing need to have a resolution of 300dpi. To find out how many pixels we need to cover a given area, we simply multiply the size we want (in inches) by 300.

If we take an A4 page (210 x 297mm or 8.25 x 11.7in) as a starting point, we can quickly work out how big a digital image must be to cover different amounts of the page:

Size on the page Digital image size (pixels) Megapixels
1 x 1 in (eg byline pic) 300 x 300 0.09
4.1 x 5.8in (A4 quarter page) 1240 x 1753 2.1
8.25 x 5.8in (A4 half page) 2475 x 1753 4.4
8.25 x 11.7in (A4 full page) 2475 x 3510 8.7
16.5 x 11.7in (A4 DPS) 4950 x 3510 17.4

In practice, we would probably need images even bigger than this to allow for cropping, and to provide some 'bleed' area where the image runs to the edge of the page.

An image we could run at half-page size in a magazine would be 34 inches wide on screen - and you don't see too many websites with images that big...