ABOUTPORTFOLIOSERVICESRESOURCESCONTACT
REQUEST A QUOTE
designworks RESOURCES

WEB GRAPHICS VS. PRINT GRAPHICS
CAN'T WE ALL JUST GET ALONG?

"JUST GRAB THE LOGO OFF THE WEB"
We have heard this said many times. The web is a tremendous resource, and you can find many useful things there. However, an image that has been compressed for the web is usually not good for much else. The two main reasons for this are image resolution and color reduction.

IMAGE RESOLUTION
Image resolution is a term used to describe raster graphics. It measures the number of dots or pixels in one linear inch of the image. Image resolution is measured in dots per inch or dpi. The higher the dpi, the crisper and finer the image. When an image has low dpi, it can have jagged edges and the dots will appear large and clunky. Web graphics are saved at 72 dpi because that is the best resolution that monitors can display. Professional print graphics are usually at least 300 dpi, and sometimes higher. The demonstration below shows what happens when you magnify web and print graphics to compare the detail.

Web Graphic at 100%
ABC Company

Print Graphic at 100%
ABC Company

Web Graphic at 200%
ABC Company

Print Graphic at 200%
ABC Company

Web Graphic at 300%
ABC Company

Print Graphic at 300%
ABC Company

COLOR REDUCTION (RGB vs. Pantone and CMYK)
When we specify colors for a print job, we use precisely calibrated tools to ensure that the colors that get printed are exactly the colors that we want. The printer and the designer work closely together to achieve this correlation. There is a standard for printing inks called the Pantone Matching System. Any designer should be able to show you their Pantone color swatch booklet with well over 1000 different colors from which to choose.

In addition to those colors, we can also use a 4-color process much like color photos in newspapers. The colors cyan, magenta, yellow, and black, can be applied in tiny dots which then optically blend when viewed from a distance. A broad spectrum of colors can be represented with just those 4 inks. This is called CMYK process color. Both Pantone and CMYK systems have different strengths and weaknesses and many professional print jobs use both.

When we design a web page, unfortunately, the end user is not looking at ink on paper, they are looking at a computer monitor or a television set. These modern display devices use the 3 colors red, green, and blue, mixed in tiny dots or pixels on the screen, to make all the colors we see. This RGB system has its own spectrum, which does not always overlap with the CMYK and Pantone systems. Because of this disparity, we do not have the same color control on the web that we have in print media. For more information on monitor color control, go to our section on web color. In short, web graphics have a spectrum of available colors different than that of print graphics.


Downloads





ARROW
The Web Demystified
    Page Loading Time
    Screen Sizes
    Color on the Web
    Compatibility & Plugins
    Web Graphics vs. Print Graphics
    Image Quality vs. Download Time
    Vector Graphics vs. Raster Graphics
    Reaching Your Web Market