Designing Logos for Web & Print
If a client so much as utters the words
"design a logo," one of your first questions should be, "Do you plan on having
this printed on stationery?" Chances are they'll say yes. Creating a logo for
both Web and print can be a challenging task. But failing to ask this question
up front could mean producing the logo all over again. You should also tell the
client about the extra costs involved for digital production. Otherwise, you may
end up designing a logo that's so costly to print your new client will be filing
Chapter 13 before they even start. Knowing the differences between designing for
the Web and creating for print will help you to walk the client smoothly through
the digital production process.
Color = Cost
When you know your client needs digital files for print, it's important
to discuss the number of inks that will be used. In the print world, you
generally have two options: full or spot color. You can find four or full color
in printed pieces like glossy magazines with color photographs. These pieces are
printed with four inks, each requiring their own plate for printing: cyan,
magenta, yellow, and black—or CMYK. The K stands for black. The four negatives
produced from your digital file for the four respective inks are comprised of
tiny dots, each set at a slightly differing angle from the next. These tiny dots
mix together to create full or four color when the inks are transferred to a
metal plate and applied to the stock or paper you're printing on.
If you don't want or need the expense of four
color, you may elect to use spot color—one, two, three, and possibly even four
inks. A one-color print run will cost less than a two-color print run. A
two-color print run will cost less than a three- or four-color print run.
Most printing presses are one-, two-, or
four-color, which means that one, two, or four colors can be run at the same
time. If you're using three spot colors, the printer may put the job on a
two-color press, clean the press, and run the third color after the other two
have been completed and dried. They may also put it on a four-color press and
leave one ink well empty. In either case, the clean-up or the use of the
higher-end press will inflate the price of a three-color print run, so don't be
surprised if three-color printing is quoted at about the same price as
four-color.
Aside from full and spot color, there are
options that involve more than four colors, such as adding a fifth color and
perhaps varnish to CMYK. You also have the option of using a six-color
hexachrome process, which adds a vibrant orange and green to CMYK to reach
colors that can't be printed in four-color—like many Pantone spot colors or
those you see on a monitor. Unless your client is prepared to spend huge amounts
of money, the latter two wouldn't be options.
When a client understands how color affects
cost, you and the client will be able to make decisions about how the logo
should be designed. The solution might be a four-color logo for the Web site and
a two-color logo for the stationery. It may be the same for both, but it's
important to discuss the options because the decision will affect cost, design,
production, and time.
Four-Color Printing
Figure
1: CMYK color
Have a look at the logo below. You can see
black, brown, red, very different greens, yellows, and blues . . . well,
heavens! You're already way past the four-color limit. Printing all of these as
spot colors would be very costly. Plates would need to be made for each separate
color and would involve many cleanups and runs through the press. This would be
a dead ringer for a four-color print run.
When broken down into the four inks, called
color separations, the plates required each ink to appear as below. It may be
difficult for you to imagine at first, but these four colors will mix together
to create the image above.
Figure 2: Cyan, Yellow, Magenta, and
Black color plates
Spot-Color Printing
As with four-color, spot-color printing also requires a plate for each
color. Where the Web world applies hexadecimal codes to its colors, the print
world applies PMS, or Pantone Matching System numbers, to its spot colors. There
is a Pantone Color Formula Guide that has all available swatches for both coated
(glossy) and uncoated (dull or matte) stock (paper). Coated and uncoated colors
are close, but not always identical. It's important to see what the spot colors
will look like on the stock you and/or the client have decided on. Stock choices
can range in weight, as well. A text weight is generally used for letterhead,
while cover stock is used for business cards. Envelopes come in different shapes
and sizes. Ask the print house if you can see samples of each.
If you think you might run into specifying
spot colors for clients frequently enough, you may want to buy a "Pantone Color
Guide" (approx $110 US). If the cost cannot be rationalized and you think
specifying spot colors will be an isolated incident, visit the print house and
choose the PMS numbers you'd like to use from their guide. Every good printer
has one and they'll need these numbers from you before they can print the job.
If you're doing long-distance printing and know of a friendly local print house,
you could also drop in to have a quick look at their PMS guide. Bring a printed
version that matches your colors as closely as possible so you can specify your
PMS colors from an established reference point.
Are Your Colors Accurate?
As a Web developer or designer, you know that one screen may see
color very differently from the next. In print, you have another set of
problems—what you see on the monitor must be converted to a completely different
"color space." The monitor sees images using RGB color (red, green, blue), while
printing houses use CMYK and the Pantone Matching System.
Typical dye-sub printers also use CMYK. As
proof of the difference between the printer and RGB as seen on our monitor,
let's run a quick test. In RGB mode, place a block of 100% green on your page
and print it. You'll most likely get something in the neighborhood of forest
green. Hold your printed page next to your block of vibrant green on your
screen. Not even close cousins.
In the printing industry, a great deal of
time and money are expended in setting up a calibrated or WYSIWYP
(what-you-see-is-what-you-print) monitor. You solve this problem through color
calibration—adjusting the color of the monitor to simulate what would be printed
on a final piece.
Calibration is not critical in spot-color
printing because the inks don't need to be mixed to create another color. From a
design perspective, it's nice to approximate the colors you'd like in order to
study the balance and weights of colors, but the inks will ultimately be
independent of each other on the press and don't need to be exact.
Calibration is very important in CMYK (or
tritone and duotone) printing because the inks mix together to create the color
you're looking for. If you see our logo in RGB view, you're unable to accurately
tell whether the percentages of CMYK inks will mix properly. You'll need to know
what they'll look like in CMYK. Printing is pretty costly, so guessing is not an
option. It's important to have your monitor calibrated to the final output.
How Can I Calibrate My Monitor?
For professional color matching, color management software is
necessary. Also, the better the video card, the more accurately your monitor
will accomplish calibration for print. A 24- or 32-bit card is recommended.
The Macintosh platform integrates color
management into its operating system very easily.
Adobe Gamma, shipped with Photoshop, is widely used on Macs. There are
problems using Adobe Gamma in Windows NT 4.0 because the system's architecture
doesn't support it. While it can be used on Windows 95 and 98, some video cards
don't support it, so system-wide calibration isn't possible; a profile for
Photoshop 5.0 is possible, though.
While low-cost solutions for color management
on PCs are few, there's a lot of work being done. This is a short list of color
management tools for PC; prices are approximate.
Taking the High Road On Resolution
Many of us have created a masterpiece, emailed our files off, and
shortly thereafter received a call from the printer saying our files were fuzzy
or bitmapped. When you create files for your Web sites in a program like
Photoshop or Fireworks, you use a resolution of 72 pixels per inch. Print media
is executed at a much higher resolution and the film is output at specifications
of lines per inch (lpi) and dots per inch (dpi—sometimes called pixels per
inch).
Before you begin to build your files for
print, it's important to know at what line per inch or "line-screen" value your
files will be output. It varies from printer to printer and job to job, so it's
always a good idea to ask. Not to worry; you're not asking a silly question. If
your client, rather than you, is dealing with the printer, tell your client
you'll need this information.
Newspapers generally print at 85 lines per
inch and sometimes higher. That simply means that in one linear inch there are
85 rows of dots. The more lines per inch or the higher the line-screen value,
the finer the image. Magazines and books usually print at 133 lines per inch or
higher, depending on the quality. Stationery is also usually printed at 133
lines per inch and higher.
Once you've established the line-screen
value, you'll have the answer to what print resolution—the dpi or pixels per
inch—you'll need to use to create your files. Just double the line-screen value.
If the printer tells you they'll be printing
your files at 133 line-screen, create your files at 266 dots or pixels per inch.
If they tell you they'll be printing your files at 150 lines per inch, create
your files at 300 dots per inch, and so on. Unless you're doing high-quality,
glossy publications, it's very unlikely that you'll need to create your files at
any greater than 300 dots or pixels per inch. If you're designing for stationery
and can't get the line-screen value from anyone, play it safe at 300 dots per
inch.
Software That'll Do the Job
For print work, you'll need software that can accomplish higher
resolutions. This'll only be an issue when working with raster files, though, as
opposed to vector files. What's the difference? Most graphics on the Web today
are created in raster formats like JPEG, GIF, and PNG—a collection of pixels.
If you create your file at 72 pixels per inch
and try to increase the resolution to, say, 300 pixels per inch, the image must
make up for the extra pixels that are being added. When you sample up or
increase your resolution, the pixels "interpolate:" new pixels are created
between the original pixels based on their color information. The results can
be, well, ugly, and the reason for the fuzziness.
For high-resolution raster images, you may
want to consider using Adobe Photoshop, Corel Draw, Photo-Paint, or Painter.
Your final high-resolution files should be saved in either .TIFF (Tagged Image
File Format) or .EPS (Encapsulated PostScript) format. Of these raster programs,
only Corel Draw and Painter support spot colors; the others will output images
for CMYK separations, which won't be appropriate if you need separations for a
two-color logo. You'll need to create your file in a vector program.
Vector programs use shapes and paths rather
than pixels. The file sizes are substantially smaller and can be enlarged to any
proportion without degrading the image—the shapes and paths stay intact—even if
you enlarge to the size of a billboard! Vector programs can be used for logos
and line drawings that have smooth curves and straight lines, and are a good
choice for creating spot-color logos. Any raster images or subtle shadows can be
imported at the proper resolution if needed. If you do import any raster images,
be warned that they'll interpolate if you attempt to enlarge them. The most
common industry software choices for vector files are Macromedia Freehand or
Adobe Illustrator. Your files should be saved in .EPS format.
One of the beauties of using a vector program
to create your logos is that the .EPS files can later be opened at the desired
size in an image editing program without losing quality. If you originally
create the logo at high resolution in an image editing program like Photoshop,
you're left to downsample to 72 ppi when creating the Web site. Again,
resampling in a raster program can cause loss of quality, so you would need to
make touch-ups to the low-resolution version for the site.
If your client wants you to produce the final
layout files for all of the stationery, you'll need a page layout program
supported by most print houses such as Quark XPress, Adobe Pagemaker, or Adobe
InDesign. They're expensive programs, so unless you want to get into the
business of desktop publishing for print, you may want to tell your client that
you will provide a high-resolution file of their logo to the print or design
house, which can be imported into these programs.
Microsoft Publisher is also gaining
popularity as a layout program with many small businesses, but check with the
print house you'll be using to ensure they support MS Publisher files first—not
all do. If they don't, and try in some way to recreate or convert your files,
you'll be guaranteed an instant nightmare and extra costs. No matter what layout
program you're using, it's a good idea to check with the print house to be sure
they use the same one or can deal with Mac or PC platform files, or both. If a
print house doesn't support any of these programs, find a new printer.
Files to Go
After you decided on the number of colors and the required
resolution, you were able to make decisions about which software to use to
create the logo. If it was a one- or two-color logo, chances are you made a
decision to use Illustrator or Freehand. If you had the luxury of four-color
process, you may have chosen Photoshop.
In any of the vector programs, it'll be
necessary to ensure that your colors are named and used in RGB mode, rather than
CMYK, so they'll appear in the separation list as spot colors for final output
to film. You may have either used the pre-existing Pantone color names, or named
the colors yourself—perhaps teal and gold, or PMS 321 CVU and PMS 110 CVU. CVU
means "uncoated." If the name appears without the U after CV, it's intended for
"coated" or glossy stock.
In a raster program like Photoshop, it'll be
necessary to convert to CMYK mode (or duotone or tritone) before sending your
files. Also check your colors in the palette. If a little triangle with an
exclamation mark appears when you choose the color, it means it's out of the
gamut—not attainable in CMYK. Choose one that is.
Along with the file you've created, you'll
also need to send all font files you've used in your file to the print or design
house. Again, check with them to see if they can deal with Mac and/or PC
platform. Let them also know what colors you'll expect to output in an attached
note. It'll save costly mistakes, time, and guesswork.
Print and design houses are your friends. If
you're in doubt at all about what you should be sending, ask questions. And it's
okay to be honest. If they know your experience is in Web design and that you
haven't dealt with print in the past, you might be delightfully surprised at how
helpful they'll be in guiding you through the process. After you've done it
once, you'll be an old pro. You'll be talking print geek with them in no time.
Author: Wanda Cummings
Website Acquired: www.creativebehavior.com
Date Written: 2004-03-08
Back
to Articles
|
|
