Print and the Web
There is a vast difference between image files displayed on the web and files used for print. First, they use different color models. The Web uses RGB (Red Green Blue) and Printers use CMYK (Cyan Magenta Yellow Black). RGB light is projected and CMYK light is reflected. That is why it is so hard to match printed color with the color you see on your computer monitor. The second difference is size. Web graphics are small and compressed to pass through the internet as quickly as possible. Graphics used for print are large and may produce a file many hundreds of megabytes in size.

What's a Pixel?
A pixel is a little square box that helps us determine the size and resolution of bitmap images. I know, I know… what is a bitmap? A bitmap graphic is an image composed of several pixels like an ice tray set up in rows and columns. A typical graphic ad banner on a web site might be 120 pixels across by 60 pixels in height. This is a small graphic and can't be scaled up larger with any success. If you did, it would look blurry or “pixelly”. Those little small squares just get bigger not better looking. As a rule of thumb, you can always start with a larger bitmapped image and scale it to be smaller, just not the other way.

Does My TV have Pixels?
Resolution is bit tricky to explain. I had a customer ask why her web site looked larger on her computer and smaller on her friend's laptop. The computers in question had different resolution settings. Her computer was set to display 800 pixels across while her friend's laptop was set to 1280 pixels across. The web site has a fixed size of 650 pixels and would appear half the size on the laptop. This same customer asked me why a small tv and a large tv show images in the same proportion. This would be a great question if one doesn't see the difference between computer monitors and television screens. It all comes down to pixels again because the National Television System Committee (NTSC) has a fixed size of 720 x 480 pixels and these aren't square pixels either, they are rectangular. This fixed size can be stretched over a larger screen and no one is the wiser because you usually don't look at a big tv screen that close but, if you did you would notice it was really blurry. This is why people want HDTV. High Definition is more pixels and a sharper image!

How the pixel affects the average human is when it comes time to make a business card or a brochure. It is roughly assumed that you take graphics from the computer and give them to the printer or the graphic designer. They will inspect these files and determine that there just aren't enough pixels to do the job. Has anyone ever told you the photo you sent was too small for print yet it looked fine on your computer? Or have you printed an image full page that you found off the internet. Kind a fuzzy huh?

Scanning Tip
Make sure when you scan a photo for print that you scan it big. If you have settings that allow you to choose different resolutions, pick 300 pixels per inch for something that will be printed. You might see a setting called “Screen Resolution” this is 72 pixels per inch and is suitable for web site graphics.

But Karl What About Vector Graphics?
I'm glad you asked...There is another way to build graphics that does not use pixels for measurement. They are called vector graphics. These are graphics that are made of shapes that are numerically calculated. Some very sophisticated artwork can be made with vector shapes. Vector graphics are also “resolution independent”. They have no resolution and can be reproduced perfectly at any size whether it be on a business card or a huge banner. If you can, always have your logos built as vector graphics. That way you can have them printed on anything. Photos are always bitmapped. While it might be possible to convert a photographic image into a vector shape composition, it is usually reserved for stylistic effects like silhouettes and posterizations.

Karl Knelson - Site Mechanix, LLC
Web Development and Web Consulting