Working digitally? Know your turf!

  1. A short introduction
  2. dpi, lpi – What’s the difference?
  3. Grids vs. pixel in printing
  4. The “mystery” of the resolution of image files
  5. What about interpolation?
  6. 72 dpi vs. 300 dpi
  7. Pixel first!
  8. Conclusion

1. A short introduction

As a digital agency in the Frankfurt area we are often confronted with a lot of superficial knowledge regarding the resolution of image data. Unfortunately, there is still team Digital versus team Print. The bastion 300 dpi belongs to experts in printing, while the company 72 dpi has a firm grip on the digital matters. And of course, each part is separated neatly. Both teams have their special field to prove themselves. But what do 72 dpi and 300 dpi actually mean and where do these terms come from? In this article I try to clarify the situation. I want to show you what really matters and what impact it has for your work. But before we focus on this subject, we need to start at the basics.

2. dpi, lpi – What’s the difference?

An image’s resolution is always represented by dpi = dots per inch. Actually, this means pixels per inch. 1 inch is exactly 2,54 cm. Since we describe a square area (math experts, hands up!), we’re looking an area of 2,54 cm x 2,54 cm = 6,4516 cm².

Note:

  • dpi = dots per inch; pixels per inch²
  • lpi = lines per inch; grids per inch²

Or if you’re talking about „cm“:

  • dp/cm = dots per cm; pixels per cm²
  • lp/cm = lines per cm;grids per cm²

3. Grid lines vs. pixels in printing

A pixel defines the smallest dot that can be represented in a printed product. In contrast, grids consist of the smallest pixels standing in a row. You might have heard the term screen width, which is another word for grids. This indicates how close these lines stick together. The more subtle the grid, the closer these lines are set. It means that the screen ruling is getting larger.

4. Behind the mystery – The resolution of image files

Digital image-files always have a width and a height. Their edge length is represented by pixels (px). Pixels also indicate the amount of pixels a file contains. For example: If your image has 1.000 x 1.000 px on each side, the image file contains 1.000 px.

The graphic is an exemplary presentation showing 1.000 x 1.000 px. So this file consists of 1. Mio. pixels in total. Let’s look at dpi. This term is common in printing and has been established when desktop publishing (DTP =directly on the computer) became popular. When producing printed material the so-called 60 grid became the prevalent quality and the standard for professional printing.

Note: 60 grid = 60 gridlines per cm2

Converted in inch we talk about a 152,4 grid or 152,4 lpi = lines per inch

And here’s how it is calculated: 60 cm x 2,54 (to convert to inch) = 152,4 lines per inch

Got that? Now, let’s dig deeper …

How many pixels are required for a perfect printing result (without any blur) and of course professionally printed (f. ex. as sheet-fed or web-offset)? It’s quite easy: You multiply the lines needed with quality factor 2. The result: 304,8. In the next step you round down this “odd” number to 300. That’s how the 300 dpi-resolution was born for printings with a 60 grid.

Note: 60 lp/cm ≈ 150 lp/i x 2 = 300 dpi

Sounds strange, but that’s exactly how it happened. It is still mentioned on very expensive scanners (drum scanner, flatbed scanner etc.), because these devices are able to transform slides, printings or negatives etc., into digital data.

Theoretically, you have now twice as much information as needed. So a 60 grid with 150 dpi should always be enough to create an optimal printing result. Sounds like perfect conditions, doesn’t it?

A brief side note: If you print an image in a 60 grid with 150 dpi, you cannot distinguish the result from a printing in 300 dpi – at least, if it is a small image. If it is printed in DIN A4, you’ll already notice significant differences. But if the image is printed in a very large scale, f. ex. as a poster, you usually don’t stand right in front of it. In this case, it is not necessary to print it in 300 dpi.
Why is that the case? Step forward and take a closer look at the poster: You will certainly detect the pixels (as long as it is not printed frequency modulated, but that’s another story …). How does that work? This has to do with our naturally limited ability to see. The smaller the image the less we are able to detect blurs or even perceive them as such. And the more we step away from a large format poster, the more blurred the pixels get.

5. What about interpolation?

Interpolation means that pixels are calculated on the basis of neighboring picture elements – this method is useful if you don’t know the image’s actual pixel. If I want to enlarge an image – even though it doesn’t have enough pixels to make this work –  I interpolate the image f. ex. in Adobe Photoshop and the result is always a softer and more blurred image.
The computer doesn’t detect these new pixels automatically. It has to calculate them approximately. The result: The more I try to enlarge it, the more blurred the result gets. Also the file’s size increases.

Note: If you enlarge an image, it gets more and more blurred.

6. 72 dpi vs. 300 dpi

In the following, we discuss the difference between 72 dpi and 300 dpi. Computer monitors have a resolution of 72 dpi or 96 dpi. A higher resolution is not necessary, as long as the file is displayed in its original file or is minimized. Scaling the file can lead to a blur as described above. Another important fact: Your web browser is not able to load large files quickly. That’s why the edge length (in pixels) is always an important factor. Let’s check out this example:
You can use Adobe Photoshop to calculate your image data. So you can see instantly how the image changes which is very useful and convenient. Another important feature is the checkbox: Make sure that the option “Maintain proportions” is not active.

Both images have exactly 1.000 x 1.000 px. On the left, we have set the required resolution 300 dpi, on the right to 72 dpi. Let’s take a look at the image’s size in cm. Using 300 dpi (meaning the file’s pixel density), we get only an area of 8,47 cm2.  With 72 dpi the area measures 35,28 cm2. Remember, we assume we want to display the image in its original size – without scaling.

If our printing-file needs 300 dpi resolution, we won’t succeed with 1.000 x 1.000 px, while 72 dpi is definitely enough for monitors or displays etc.

So, how many pixels do I need to print 35,28 cm? Let’s reverse the question:

For an image size of 35,28 cm you already need 4.167 px, as long as you choose a 300 dpi-resolution. Your file increases also in size: from 2,86 MB to 49,7 MB. That’s one reason why large files are needed for printing.

7. Pixel first!

Even if you mostly work digitally, it is important to understand the needs and requirements for the printing-industry. Also team Print needs to understand that image files are always pixel values. Of course, files that contain 5.000 x 5.000 px in 72 dpi are perfectly printable. But that’s how misunderstandings happen. Therefore: pixels first!
In the digital world, images with 1.000 px work perfectly, f. ex. for modern previews. 300 dpi is nothing the digital world needs to deal with. The latest monitors with retina displays have a high resolution. And it makes perfect sense to consider high resolutions today, but it should always be defined in pixels and not in dpi.
Meanwhile, retina displays can be found in tablets, laptops or desktop-computers (f. ex. Apple). This needs to be considered, because due to high resolution the requirements for image-data will increase in the future. Zooming-gestures must be considered, too. Of course, heavy zooming (enlarging) has its natural limits, too. But users usually accept that an image gets blurred the more it is enlarged.

To offer various zoom-capabilities on high-resolution displays, it is perfectly good to keep in mind a pixel value of 2.000 px.
A useful agreement could look like that: 1.000 px, 1.500 px, 2.000 px the longest side.
Images can be in portrait- or landscape-format. Images in portrait-format such as product images of pens, toothbrushes etc. always have a short and a long side. So we need an agreement that specifies which is the long and which is the short one. Depending on that, your data file is a small or large one.

You need to be careful when working with a white space. Note, that the resolution takes into account everything the file contains. Keep that in mind and you won’t get an unpleasant surprise when there’s is not much left of your image after resizing it.

8. Conclusion

The number of pixels does not reveal an image’s quality. You can create poor images with an extremely high resolution. Smartphones or small digital cameras offer huge amount of megapixels and reflex cameras have a considerably less pixel-density but offer good quality images. It’s the technology that matters combined of course with the surroundings and the light: camera lens, camera sensor (the chip that receives the “light” and saves it digitally) etc. By now, images are mostly created digitally in an excellent quality, especially when created in a professional environment (according to equipment and expertise).

Even if I haven’t solved the mystery “resolution” completely, I hope, that this article sheds some light on the subject. If you have any further questions or suggestions, contact me. We’re happy to help.