Image
206 466-3880
See Our Work

Image resolution – Look great on paper

This image looks great on my computer - so why can't I use it in print?

At some point, it happens to just about everyone who wants to use a digital image in print: The photo or graphic that looks perfectly fine on your screen becomes blurry, pixelated, or just plain bad once it’s on paper. What’s the deal?

It all comes down to resolution—something you’ve probably heard of, but might not fully understand.

That’s OK. You don’t need to be an expert on things like this (that’s our job). But the right resolution will ensure your images look great, whether someone is checking out your website on their phone, looking at a billboard featuring your logo, or anything in between.

The Basics

If you break down any photographic image, either in print or digital form, you’ll find many, many tiny parts that when combined, create the full image. Think of these parts as individual colored tiles comprising a mosaic picture. Up close you can see the individual tiles in blue, green, and orange. But as you back up (or zoom out), your eyes stop seeing the tiles and start seeing the overall picture. The technical term for this mosaic-built image is “raster image.”
Image

Digital—pixels per inch

For digital images, these tiny parts are called pixels—everything you see on a website or even a TV is displayed in pixels. Generally, the more pixels there are per square inch (a measurement called pixels-per-inch, or PPI), the sharper and clearer an image will appear.
Image

For smaller photos, such as ones you would use on your website, you may not need all an image’s pixels—at a certain level, cramming more and more pixels into a small space just doesn’t make any difference to the human eye, or to the display’s limitations.

For large photos, though, more pixels typically result in higher quality both digitally and in print (depending on the printer, which we’ll get to next).

In general, your designer will be working with images at 72ppi for most digital displays. The newer retina screens display at a higher resolution, so those same images will have to be around 150ppi to display clearly. These numbers are not adequate for print reproduction of the same image file.

Print—dots per inch

When an image is printed, it’s made up of dots created by the printing mechanism. The resolution measurement here is called dots per inch, or DPI.
Image

This DPI measurement doesn’t actually have anything to do with your camera or image size; it’s a reflection of the printer’s capabilities. Different printing equipment prints at different dpi. Which is generally confusing and unimportant for you.

As a rule of thumb, your designer will likely ask for a minimum of 300ppi (around 4 times that of the usual digital image), to ensure the images can print properly. That glorious 5 x 5 inch image on your digital display will only print at about ¼ of that size. Some math: If you want to print that image at 5 x 5 inches, you’ll need 1,500 x 1,500 pixels.

An exception: At close range, higher resolution is better, but as the distance between the viewer and the image increases (remember the mosaic), the need for DPI decreases. For this reason, extremely large images, such as a photo on a billboard, will usually print at a significantly lower DPI.

What does this mean for me?

It’s important that our work is displayed properly—not for our reputation, but for yours. For example, if we use the web version of your logo on a brochure or letterhead, it might be blurry or pixelated. This makes you look unprofessional—which, of course, is the exact opposite of the result you should have when working with a graphic designer.

For that reason, when you work with us, we’ll ask that any images you provide meet certain resolution standards for use online, in print or both. (Our tips are below this post.) And if we’re providing image files to you, you’ll receive design files that are appropriately optimized for their uses.

At Chalkbox, we want you to look your best. And that starts with images that look their best. Contact us today to learn more.

A few tips:

Please keep that original image. Save original photos and logo artwork, and anything else. Don’t assume you can pull it off the website later. Your designer will thank you. So will you when you don’t have to pay to reshoot or rebuild something.

Do some math. You can “get info” about an image file on your computer to find its pixel dimensions. Divide those numbers by 300 and you’ll have the printable size of the image. Divide by 72 for the digital display limits of the image.

The other art file: Vector images are not raster images. Instead of a mosaic tile assembly, they are defined mathematically by points, lines, and curves. For this reason, they are infinitely scalable with no loss of quality. Logo artwork will almost always be built as vector art, and for good reason. You can always go from vector to raster, but you usually can’t go back.

Recent Posts

  • The Chalkbox Mega Guide to Branding
  • Chalkbox Case Study: an improved experience for EdVisions
  • Should you DIY your website? DIY website builders vs. custom websites
  • Chalkbox Case Study: website redesign for Kevin Spence | Architect
  • Buying a business? Don’t forget about branding.

Categories

Archives

Image

Explore
  • Home
  • See Our Work
  • Services
  • Approach
  • Blog
  • Contact
Follow Us
  • LinkedIn
  • Instagram
  • Facebook
Like typefaces? So do we!

On this website we use Open Sans for body copy, menus, and buttons. For headings, and our boiler plate message we use Bitter. Both are Google fonts available here. We chose these typefaces because they pair well with the typeface we use in our logo, Gotham. Gotham is a geometric sans-serif typeface designed by Tobias Frere-Jones in 2000. Open Sans and Bitter pair well with Gotham (in our opinion) thanks to a balance of contrast in the slab-serifs found in Bitter, and similarities in the geometric finish of those slab-serifs along with similar x-height and counter shape in both Open Sans and Bitter.

Top
  • Home
  • See Our Work
  • Services
    • Logo and Brand Design
    • Print Design Services
    • Digital and Web Design
  • Approach
  • Blog
  • Contact