28 Mar ‘13
Why I Love Pixels and So Can You!
28 Mar ‘13
In: Technology, / By: Chris Simental
I got my first taste of digital imaging in 1994. I was working for a company called Bowhaus, a digital imaging service bureau. It was my first job out of college. Having had experience with DOS and Windows-based PCs and SOME experience with Macs, I felt comfortable enough with the technology that I could find my way around. But there was much to learn when it came to digital images. One of the biggest lessons, and one that I see come up a lot for designers and developers, is understanding the relationship between pixels and inches.
What’s this about pixels?
In digital imaging, a pixel is a single point. It is the smallest unit that can be represented or controlled in a picture. Each pixel has its own position and color value. An entire image is made up of many different pixels at different positions with different color values. All together they tell a story, but each on its own is just a small color block. Take this image, for example:
In the middle portion, you begin to see the pixel blocks and how they comprise the image. In the last portion, you see each individual pixel and how it relates to the pixels around it.
What about resolution?
That’s the gist of what pixels are, but how do they relate to resolution, overall image size, screen size, or printed size? While the resolution of screens and printers vary greatly, the cool thing is that every digital image contains a fixed number of pixels. When your digital camera captures an image, the number of pixels is fixed depending upon the capabilities of your camera and the settings used when the picture was taken. That means the overall size of the image for any given medium can be precisely calculated.
The first bit of confusion revolves around the terms “pixels per inch” and “dots per inch”. Pixels, as explained above, refer to points in a digital image while dots generally refer to points in a printed image. But their values related to digital images are identical. The resolution (i.e. dots per inch, or more commonly, dpi) of most computer screens is 96 or 72 dots per inch. The most common printer resolutions are 300 and 600 dpi.
Calculating the size of an image
Let’s say, for example, you have an image that is 640 pixels wide by 480 pixels tall. When you open this image on your computer and view it at 100%, it will consume approximately 6.66 inches by 5 inches on a 96 dpi display:
640 pixels / 96 dpi = 6.66 inches
480 pixels / 96 dpi = 5 inches
But what about when the image is printed? Well if the printer prints at 300 dpi, then that image at 100% would be just 2.13 inches by 1.6 inches. Much smaller because of the higher resolution, but it’s the same number of total pixels.
640 pixels / 300 dpi = 2.12 inches
480 pixels / 300 dpi = 1.6 inches
How many pixels is enough?
If you want to print a 4 x 6 inch image using a 600 dpi printer at the best possible quality and highest definition, the digital image should be 3,600 pixels wide and 2,400 pixels tall. On a computer screen, that would be a whopping 37.5″ wide! But luckily computer software lets you zoom in/out so you don’t need to have a display that large.
Now, let’s say you were working on an image for an outdoor display, such as a billboard, that’s 20 feet tall by 40 feet wide. How many pixels do you need? Assuming the resolution of the printer is 100 dots per inch, the ideal pixel dimensions of the image would be 24,000 pixels by 48,000 pixels:
20′ x 12″ per foot x 100 dpi = 24,000 pixels
40′ x 12″ per foot x 100 dpi = 48,000 pixels
That’s a pretty big image. You’ll need some serious computing power to work on an image of this size.
Can’t it just be sized up or down?
Images can always be scaled up or down as needed to accommodate lower or higher resolutions, but any time this is done, the quality of the image suffers. The reason is because when an image is scaled, some interpretation needs to be done mathematically based on the pixels that are actually there. When an image is scaled up (e.g. to print a 4-inch image from a 2-inch image), pixels are being replicated to account for the missing pixels. The technical term for this is interpolation, and it means the software will make it’s best guess as to how to create the missing pixels. Likewise, when an image is scaled down, the extra pixels are discarded and the resulting image will lack the detail of the original. For these reasons, it’s always best to start with an image that has enough pixels to print at 100% of the size of your final print to get the absolute best quality. That said, high quality imagery can be very forgiving when scaled up or down, so the better your image is to start with, the less this is an issue.
The reason I love pixels is because they never lie. A 600 dpi image might sound like a high resolution image, but it’s not very useful if the image is 1 inch wide and 2 inches tall. If you know the actual pixel dimensions of the image, you can determine for yourself just how high the resolution can be and how well it will display on various media.