Brady J. Frey

Search bradyjfrey.com
Search my site

Print Production: Color for print, color for web – 1 of 3

Full Article:

Color Science, Color Theory, Color Calibration; much of it in our industry is still a psuedo-science — filled with much speculation, and, to tell you the truth, professional confusion. In my production experience, even talking with members of the INTERNATIONAL COLOR CONSORTIUM can give you more questions than answers. So here are the basics, and further resources to get you started on the world of color for print and web, passed onto me by Art Director’s stressed out long before me.

Color we see vs. color we produce

The human eye can see 7,000,000 colors, or so the experts estimate. RGB, the reflection of Red Green and Blue light, shows only about 13% of what the human eye can see. CMYK, only 7%. In that estimation alone you can see why color is a significant frustration for an artist — with our current technology, we cannot reproduce the human eye.

Ever wondered why you make a beautiful, brilliant blue in photoshop, swing your color to CMYK from RGB, and it turns into a matte, dull blue? That’s because the color you created cannot be reproduced in CMYK… it’s too far out of the gamut.

Gamut?

Gamut, as described by Google via RockPrint Dictionary is:

Every color combination that is possible to produce with a given set of colorants on a given device or system.

So when we think of a color space, we think of a 3D glob or a 2D drawing that shows how much color we can produce within our device limitations. Adobe RGB has a ‘wider gamut’, so it can produce a larger percentage of colors compared to the human eye. sRGB has a slightly smaller gamut than Adobe RGB, so it produces a smaller amount of color compared to the human eye than Adobe RGB (however, it’s been largely adopted as the preferred color space in Monitors and certain RGB devices, so you will find that many professionals recommend sRGB if that is your target output — I have a tendency to prefer Adobe RGB, but I have varied outputs, as I’ll explain below). CMYK is, again, much smaller a color space compared to the various forms of RGB — print design is therefore an even more extreme frustration in color consistency to any designer. That’s the last time I write extreme, I promise.

So from the beginning of your design, to the ultimate end result, whether it’s a web application or a a hi-resolution screenprinted poster, your job is to control the translation of your color from one device to the next… let’s talk about each color technology specifically.

CMYK or CMYKcmOG or CMYKcm or Pantone…

The print world seems largely the most technical and most confusing in design — what you see on your monitor is NOT what you get on your printer, or your professional proofs, etc. However you calibrate your monitor (as we’ll discuss more later), you’re essentially translating an RGB screen to a CMYK print.

Cyan (pronounced ‘Sighanne’ not like the native american tribe), Magenta, Yellow, and Black come together in a series of dots to make the impression various colors when someone looks at a CMYK print. In theory, CMY should produce Black for you, but impurities of man made inks (namely, the materials we use to create them) required the early producers of color to a make a ‘Black’ ink. The rumor is, the acronym ‘K’ was used because ‘B’ was always mistaken as ‘Blue’ (and you’ll hear more than one comment in your lifetime from a client, client’s assistant, or young designer that your color could use more Blue… when they probably mean it could use a bit more Cyan) — rumors aside, most of us in the industry accept the term that K stands for the ‘Key Plate’, the area of detail an artist created, commonly designed in black.

As Digital Print has moved ahead in our industry as a strong leader for print methods, CMYK has grown into the more advanced CMYKcm (Cyan, Magenta, Yellow, Black, Light Cyan, Light Magenta), allowing for more accurate printing in areas such as skin tone, and CMYKcmOG (Cyan, Magenta, Yellow, Black, Light Cyan, Light Magenta, Orange, and Green), allowing for ‘Hi-Fi’ Printing, with an impressive color output offering a huge gamut of color compared to the original CMYK.

Wikipedia has an interesting, albeit brief discussion of the CMYK color model worth reading.

What’s coming next?

We’ll talk briefly about RGB, LAB, ICC profiles, mix them all together in Color Calibration, Color Theory, Color Psychology, Controlling color in your daily applications… and the growing frustration of Color in the Design industry.

Similar Posts

Published

5 Reader Comments::
  1. 1 Rodoula says:

    This is a great article, thanks! I’m looking forward to the next installment. I found your website via Mark Boulton’s site. I’ve just about finished my degree in graphic design but nobody taught us these things. Most of the times I’ve had to figure things out by trial and error.

    On the topic of RGB spaces, I use sRGB for when I’m outputting images for the web, and Adobe RGB when I’m preparing images for print, before I convert them to CMYK. I have found that when I save images for the web with Adobe RGB the colors look duller. Why is that? I’m asking because you mention that AdobeRGB has a wider gamut than sRGB.

    Incidentally, I did a little research yesteday on desktop inkjet printers. The higher end Epson photo printers use the CMYKcm inks you have described here. I also read somewhere that laser printers produce crisper text than inkjet. Why is that, and how do I know which printer is right for a graphic designer? The higher end, prosumer printers I looked at are geared toward photographers, and the next line up is too expensive for me. I know that’s a little off topic but I thought you might know something more about it.

  2. 2 Brad Brooks says:

    Nice start. I look forward to reading the rest, as this sort of stuff you can always do with a bit of a refresher in no matter how long you’ve been designing. Thanks!

  3. 3 Brady J. Frey says:

    Rodoula: In college they never taught me either:) I’ve always wondered why — but again, I think it’s a lost art in some respects.

    There can be a couple reasons that saving for web as Adobe RGB can fail you:
    1. If you’re using, say, the ‘save for web’ option in photoshop, you could have ‘use document color profile’ selected:
    Photoshop's save for web preview
    Which would apply an ICC profile to the image when it’s exported. Browser’s like Apple’s safari will take advantage, and use the profile when displaying the image, but if I remember correctly, just about everything else does not. Therefore, you’re putting an Adobe RGB profile on a screen/browser that cannot handle a gamut larger than an sRGB, so the translation comes out poor.
    2. Photoshop (or fireworks, or Illustrator’s save for web, and I’m sure a few others) maybe trying to translate the color space using a method that does not ‘translate’ the color as accurately as you’d like. We’ll talk more about this later, but Relative, Perceptual, Saturation or Absolute Colormetric Rendering intents http://www.normankoren.com/color_management.html#Rendering_intent try to intelligently translate color that’s inside or outside a gamut as it sees fit… which is pretty much what we try to accomplish when we use ICC profiles for a printer.

    Is Photoshop your method of export?

    —— Printers ——-
    We’ll talk more in detail very soon about types of printers — but you’ve brought up some good questions.

    Laser for the most part will always produce a much more crisp text (though, there is a cool process of silk screening that uses metal over silk so the screen is rigid and you can print really small 2pt type on things such as computer compenents, etc.) than inkjet — however, this can very on the type of paper. For the most part, inkjet systems either ‘drop’ ink on a page, or attempt it to be partially absorbed by the page — so the principle is water/dye/solvent based… a liquid. Regardless of how close to perfection you get, the liquid will always absorb into the paper and create an unsightly halo affect; how big a halo is dependent on the technology used to drop the ink and the type of paper you use.

    Laser printers burn an image using a LED light or, you guessed it, a laser beam onto a drum, and giving it an electric charge. You then dump toner onto that burned image, and then press/fuse that image onto the paper, found an interesting graphic for it:
    http://www.compudirect.net/oki/led_versus_laser.htm

    Since you’re using a laser or an LED (or some of the other processes we’ll try and get too), it’s more accurate than a liquid based material, so you’re getting what looks like more crisp lines.

    So picking a printer is hard as you’ve found out — it’s a strange balance. Bubblejet is a disaster, and arguably one of the worst technologies of print, so I’d stay away from it like the plague. Inkjet can be more fine tuned, and for the most part, I find the average inkjet print to be much more rich with color in solid areas (large pantone colors, for example) or photographs — and I find laser to be slightly dull in these areas, although more ‘crisp’ to look at. In the end, paper selection is as much an issue — you can use an inkjet specified paper in a laser printer and that print will have a huge halo, if not be completely distorted. High end, extremely expensive, laser printers are beautiful — the desktop versions I find are slightly dulled compared to inkjet prints when doing graphic design. I have a little epson that I’ve calibrated to keep a close accuracy for test prints, and we have a large High End Canon we use for in house production; but for most things, we send our work to a house for proofs and high level production of course.

    So that is a general description, if you tell me more about what you’re creating for (say, just for proofing, or just for your own testing, or the best single prints you can do, or mass production), I can suggest something more specfic?

    ——-

    Thanks Brad:), there’ll be lots more to come, I’ve already got my hands full, but it’s a good primer for me; I’ve developed my share of bad habits too for production!

  4. 4 Rodoula says:

    Thanks for the comprehensive reply!

    Yes, I do most of my exporting through Photoshop, although I do use Illustrator sometimes. I never actually thought to check those menu options in the Save for Web window. My Photoshop at home has the Uncompressed Color setting selected, and if that is the default selection, then I’m guessing the computer at my last job had that one selected too.

    From the way you describe the way inkjet works, would uncoated paper work better with an inkjet printer than coated paper (as far as crisp lines and text is concerned)?

    At my last job, we did all the work in house, and we mostly used the HP Color LaserJet 9500 (http://tinyurl.com/5t82z). I was able to use it for my class and personal projects as well and the quality was exceptional, especially when used on high quality, premium paper (either coated or uncoated).

    To get to your questions, I want a printer than I can use at home to print single copies of my work to keep my portfolio up to date, and to print my own artwork for personal use or for friends, ie. the best single prints I can do.

  5. 5 woz says:

    I’d use sRGB for website images because you will be able to see your picture exactly the way most people using Windows will see your picture. sRGB is their default colorspace. You should also know that saving with ICC profile will make a larger file.

    Nice article. I just wrote one about Pantone vs. CMYK (sorry, it’s in Dutch). Turns out Pantone has been selling us faulty ‘Pantone to Process’ Guides for decades. Only recently, they’re using ISO standards. (As you are probably aware by using ISO the entire process is documented and other printers will be able to reproduce the same colors). The faulty PMS->CMYK guides were also provided to Adobe and Quark for years and years. Thank you very much, Pantone inc. There is good news though: Everyone can get the new color Guide/libraries for free on the Pantone website.
    http://www.gammag.com/WhitePapers/doc/PANTONE_bridge.doc

Your thoughts:
Tell us what you think: