Web vs. Print Basics: Dimensions

I've had the opportunity to work on several projects for print lately.  These projects got me thinking about the differences between web and print products and what it would be helpful for someone working with a designer to know about the differences.  So prepare yourself to learn in this series about online and offline creative projects.

This week, I'm starting with the topic of dimensions.  Web and print projects have different "rulers," so to speak, and it's important to know which one to use.  You wouldn't want to bring measuring cups to determine a house's square footage or a measuring stick to determine how much someone weighs, so I'll help you know what type of measurements you'll be dealing with in these projects.

With web-based projects, the gold standard of measurement is the pixel.  Pixels are those itty-bitty dots that your computer is using to display visual information for you on your screen.  Websites widths are measured in pixels.  Images for online use or videos are a number of pixels in width and a number of pixels in height.  Elements on a website are also measured in pixels or set to be a percentage of the size of a larger container, which is measured in pixels.

For print-based projects, you'll be dealing with real world measurements like inches and feet if you're American and into our crazy system or millimeters, centimeters, and meters if you're in the rest of the decimal-based world.  Even if you are creating an "online" print project, like an ebook or digital magazine, expect to be dealing with the same measuring system that you would use to make the offline counterpart.

So when you go to a designer with a project, know that you'll need to speak pixels for online projects and real world measurements for offline projects.  As an example, let's say that you just purchased the PERFECT stock image for your business and you want to put it on the front page of your website and on the vinyl banner you're going to have printed for your next expo booth.  First of all, congratulations for wading through a gazillion stock images and finding perfection! 😉  Now, you need to know what dimension information the creative person(s) helping you will need.

First of all, you've downloaded this image online from a stock image company, so you'll have received an image that is a certain number of pixels wide by a certain number of pixels high.  Your web person will resize that image to be the right number of pixels wide and high for use at a particular location on your website.

Next, your print person will take that stock image measured in pixels and use special software to convert it's measurements to inches or feet and enlarge it without losing quality (that's a topic for another blog post).  And then they'll incorporate that image into the overall design for your banner, which is measured in inches or feet.

So pixels will have been used for one project and inches and feet for another, but it will all have been based on the same stock image you bought.  And you will have had the confidence of knowing and understanding the correct "ruler" for each project.

Now you have the dimension details and will be ready to competently speak dimensions with creative folk!  Next up will be the subject of resolution...


Posted in Creative Speak and tagged , , .