Colour management workflow for web

Discussion in 'Photoshop Tutorials' started by Derek Fountain, Jun 13, 2004.

  1. Another one of those colour management questions... :eek:}

    My digital camera uses (or at least claims to use) sRGB colour space. In the
    past I've used sRGB as my working profile, and since I've only really
    wanted to put my images on the web, that all seemed satisfactory. sRGB for
    everything and ignore the complications!

    However, I've just taken a set of photos in the Australian Outback where red
    rock is the predominant background feature. By chance I assigned Adobe RGB
    1998 colourspace to the image and, wow!, the red colours just came to life.

    First question, then: why, when the camera uses sRGB, does a different
    colour profile make the images look not only better, but more like the real
    world when I took the shot? I understand the idea of Adobe RGB 1998 having
    more colours but I don't see why the image should be improved by using a
    different colour space. The camera uses sRGB, so surely sRGB is the natural
    colour space for the image? Why does applying a colour space which the
    camera knows nothing about make the image look more like what the camera
    really saw?

    Anyhow, after this revelation, I started playing with colour management some
    more. My images are destined for the web, so ultimately sRGB is where I
    need to end up. Tweaking the image as required, then assigning sRGB back
    again just puts the colours back to their rather drab old selves. I tried
    converting the image to sRGB colour space and that seems to have the effect
    I want: the image is in sRGB colour space and looks right - bright colours
    as seen in Adobe RGB 1998 - and should look right on the average monitor.

    Second question, then: Is this workflow about right: Start with sRGB, assign
    Adobe RGB 1998, work on the image, convert to sRGB, save for web? I think I
    understand the steps, but since I discovered all this somewhat by chance
    having an expert clarify what's going on would help somewhat.
    Derek Fountain, Jun 13, 2004
    1. Advertisements

  2. Apparently your camera only claims to use sRGB, but really uses Adobe RGB.

    Keep doing what you're doing - your workflow is spot on.

    Maris V. Lidaka Sr., Jun 13, 2004
    1. Advertisements

  3. Well, your camera claims to come close to the sRGB color space
    but that doesn't mean that it always captures the reality to
    your liking. Some camera's tend to over-saturate the reality
    and others tend to under-saturate.
    All you know is that the camera sees something close to sRGB.
    If you open an image from the camera in Photoshop, in the sRGB
    color space, you should see what the camera saw. If this is
    dull colors compared to what you mean they should be, then
    your camera captures under-saturated colors and that's quite
    normal. Your job is now to correct those colors to your liking.

    Let's say that your camera has captured a reddish color with
    the following numbers: R:186, G:57, B:17 in sRGB.
    When you assign Adobe RGB in Photoshop, you're not changing
    the numbers. They will still be R:186, G:57, B:17 but those
    numbers will now give you a more saturated red in Adobe RGB
    than in sRGB because Adobe RGB has a larger gamut than sRGB.
    That's why you'll see a saturation boost when you assign
    Adobe RGB to an sRGB image.
    Yes because the numbers are still the same. Assign means "keep
    the numbers and change the appearance according to the assigned
    color space"
    Yep and that happens because you have now changed the numbers.
    Still with the red color as an example (R:186, G:57, B:17) :
    You assign Adobe RGB to your sRGB image. The numbers doesn't
    change but you'll see a saturation boost (appearance change).
    It shows that the color numbers doesn't say anything whatsoever
    about the appearance before we assign a color space to them.

    Then you convert back to sRGB. When you're doing that, you're
    telling Photoshop: "keep the appearance (from source space to
    destination) and change the numbers (if necessary) in order
    to keep the appearance". Now the red R:186, G:57, B:17 changes
    to something like: R:215, G:54, B:4.
    The RGB numbers has changed but the appearance (the Lab-value
    from Photoshop's point of view) hasn't.
    If it works then I guess it's right but as I see it, you could
    just as well boost the saturation in your sRGB image instead of
    assigning a different color space, but if it's easier for you
    to assign a different color space in order to get the colors
    where you wan't them to be, then why not?
    Thomas G. Madsen, Jun 13, 2004
  4. Derek Fountain

    Bill Hilton Guest

    From: Derek Fountain
    Technically the camera has it's own native color space (the range of colors it
    can capture) and it's surely wider than sRGB. What happens is this native
    device-specific gamut gets mapped into one of the device-independent spaces
    like sRGB or AdobeRGB when the camera converts the file to this space.
    That should work fine if the web is your final target, or if you're aiming for
    prints from the popular Frontier-class machines, since the extra gamut is
    wasted on these.
    AdobeRGB has a wider gamut, especially in the reds ... you can see this if you
    make a blank layer with white background on a new document with AdobeRGB as the
    working space and fill several blocks with RGB = 220/0/0 - 240/0/0 in
    increments of 5 (ie, R = 225, 230, 240) ... these should show as different
    shades of red (unless your monitor sux). Now convert this to sRGB and all of
    these will clip to R = 255 and of course look the same tone.
    The camera only used sRGB because you told it to, its actual color gamut is
    probably even slightly wider than AdobeRGB. Converting to a wider gamut simply
    shows more gradations of color and for reds it makes a big difference.
    Not at all, the "natural color space" of the camera is actually different from
    any of these abstract, grey-balanced working spaces.
    Because the range of colors (gamut) the camera can capture was wider than sRGB,
    so you didn't have to clip colors to make it fit the space. See my example
    above with the red blocks.
    Because of this I don't think there's much point in going to AdobeRGB first,
    unless you are printing on a top flight inkjet or a laser printer like the
    LightJet, where the extra colors will show. You end up clipping them anyway
    when you convert back to sRGB.
    You may still be surprised at how dull bright reds look on the "average
    monitor", especially on the web where there's no color management. To preview
    this do View > Proof Setup > Monitor RGB.
    I would skip the AdobeRGB step if you're going to the web anyway, unless you
    intend to print on one of the printers I mentioned. On my photos with lots of
    reds I like to preview with the color management off to see what it will look
    like in a non-color managed app like the web and add a layer set to adjust for
    it there.
    I would highly recommend the book "Real World Color Management" by Fraser,
    Murphy and Bunting, for a well-written in-depth look at color management.

    Bill Hilton, Jun 14, 2004
  5. That's true if Derek's camera has captured very high numbers
    (like R = 225, 230, 240 from your example), but who says that
    his camera has done that, or am I wrong here? He wrote that
    the red rock keeps the appearance when he converts back to
    sRGB so as I see it, there's no gamut clipping taking place
    in this particular case. If a gamut clipping was taking place,
    shouldn't the dull colors come back, when he converts back to

    All he's doing by assigning Adobe RGB and converting back to
    sRGB is to make a more saturated image because most of the
    numbers will be raised.
    That will show him how uncompensated colors looks like on _his_
    monitor and not on the average monitor. sRGB tries to simulate
    the average monitor doesn't it?
    Thomas G. Madsen, Jun 14, 2004
  6. Derek Fountain

    Bill Hilton Guest

    sRGB's gamut was defined to encompass the average gamut of uncalibrated
    monitors, yes. But typically you strip out the sRGB profile when you save the
    jpeg for the web. If you don't strip it out most browsers will simply ignore
    it anyway.

    The main reason to check with View > Proof Setup > Monitor RGB is that very few
    browsers use color management. Doing the Monitor RGB check basically ignores
    your monitor ICM profile, showing you what the image would look like on your
    monitor without color management, which is closer to what someone else will see
    (since they won't be viewing it with the sRGB profile or thru their monitor ICM
    file (if they even had one)).

    If you have saturated colors, especially reds or oranges, in an AdobeRGB file
    you will see a big color shift when you do the 'monitor RGB' trick. If you
    convert to sRGB and do it you'll see less of a shift but with many colors you
    still will see it. On a lot of my red rock photos I need to add an adjustment
    layer to the non-color managed file before converting to jpeg to get the colors
    even close to the original.

    So the main purpose of the Proof Setup > Monitor RGB step is to show you what
    you lose without the monitor profile. sRGB isn't an exact match for the
    non-color managed image's colors and you may need to tweak them.
    You're right, if he isn't going to clip then he should go ahead and do his
    conversion. But he could get the same thing by shooting sRGB and increasing
    saturation, probably.
    I didn't realize he had shot the red rocks in both modes, I thought he just
    shot them in ARGB.
    No, it won't be "dull" it will just lose all the subtle tonalities between
    shades of colors, like in the example I gave.

    Bill Hilton, Jun 14, 2004
  7. I know but still I thought that sRGB was the color space that
    came closest to the common non-calibrated monitor out there.
    I often use View > Proof Setup > Monitor RGB too but only in
    situations where I would like to know how an image in Photoshop
    looks like in my browser or in Dreamweaver for instance (which
    both are non-color managed) but I still converts to sRGB before
    sending it out on the web. I seldom embed the sRGB profile
    because I know that most browsers ignore it but I convert to
    sRGB in the hope that most non-calibrated monitors out there
    are closest to that particular color space.

    From page 291 of Real World Color Management:

    | If your work is exclusively for the Internet, calibrate your
    | monitor to sRGB - most monitor calibrators offer sRGB as a
    | preset, and for those that don't, use 6500 K as the white
    | point and 2.2 for gamma. Then, do everything in sRGB. Your
    | calibrated color in the color-managed applications will
    | closely match your uncalibrated color in the non-color-managed
    | ones.

    My work isn't exclusively for the Internet so it happens that
    I prefer this workflow instead because at least it gives me
    consistent colors between my color-managed and non-color-managed

    | Use Monitor RGB as the source profile for all your Internet
    | work. Color-managed applications will see that you RGB is
    | already Monitor RGB, so they'll just send the values in the
    | file to the screen, the same way non-color-managed
    | applications do. Then, when the work is complete, convert it
    | to sRGB.

    Mostly I prefer working in Adobe RGB though even if the work
    is for the web. With the soft proof function I can alway check
    how it would look in my browser (by soft proofing to Monitor
    RGB) or on the common monitor (by soft proofing to sRGB).
    I see a huge difference between sRGB and Monitor RGB too and,
    to tell the truth, often a bigger difference than between Adobe
    RGB and Monitor RGB. I have always thought that the reason for
    this is, that the gamut of my (calibrated) monitor is closer to
    Adobe RGB than to sRGB but maybe I'm wrong.
    In my case I need to tweak them a lot if I want to see the
    same colors in an sRGB image in Photoshop and in my browser.
    Here's an example:
    I agree.
    What is ARGB?
    As I understand it, he has shot the red rock in sRGB because
    that what his camera tells Photoshop that the color space of
    the image is, but that's not giving him the appearance he wants
    in Photoshop. He then assigns Adobe RGB and it gives him the
    right appearance. Then he converts back to sRGB and the image
    keeps the appearance which from my point of view must mean,
    that the camera hasn't captured very high color numbers like
    R:230 in sRGB. If that was the case, it would be impossible
    to keep the appearance when he converts back to sRGB from
    Adobe RGB because of the gamut clipping that will take place
    from R:230 in Adobe RGB to sRGB. The red you have on R:230
    in Adobe RGB (L:57, a:84, b:72) doesn't exist in the sRGB
    color space. (It will change to something like L:54, a:81,
    Maybe I've completely misunderstood Derek's post then but
    if you have a very saturated red in Adobe RGB of say R:230,
    you'll see a saturation drop when you convert to sRGB and
    that's what I mean with the word "dull". If there's no change
    in appearance from Adobe RGB to sRGB it must mean that there's
    no gamut clipping taking place.
    Thomas G. Madsen, Jun 14, 2004
  8. Maybe I've completely misunderstood Derek's post then but
    I've been following the thread doggedly, but I think I ought to be reading
    the recommended book before I throw in any opinions of my own. To clarify
    what I'm seeing, though:

    The camera is a little Canon which doesn't offer switchable colour spaces.
    The EXIF data attached to each JPEG from it says it's sRGB.

    I opened a couple a "red rock" images and assigned Adobe RGB to them and the
    reds looks much closer to what I remember shooting. However, since my
    original post, I've noticed that other colours don't look as accurate with
    Adobe RGB. Light blues in particular - I have a light blue car, and the car
    colour looks about right in images with sRGB assigned to them, but much too
    "rich" in the same images with Adobe RGB assigned to them. From this I
    infer that Thomas's original assertion was correct: the camera isn't
    capturing reds quite as well as I'd like and that boosting red saturation
    would be a better way of adjusting the images.

    My understanding now is that for some colours (specifically reds) Adobe RGB
    matches the camera's native colour space better than sRGB and therefore
    makes the image look better. For some colours (specifically light blues)
    sRGB matches the camera's native colour space. On balance, and having
    looked at a lot of images, I can say that the majority of colours look
    better viewed in sRGB space.

    The final step I was using was to convert back to sRGB for web output. The
    image colours stayed the same - there was no clipping. The reds still
    looked like the bright reds shown in Adobe RGB, which were accurate with
    regard to what I saw. After the conversion I can't honestly claim to see
    any loss of subtle tonalities as Bill suggests, but then I suspect my
    untrained eyes aren't as sensitive to such things. Fact is, I can't see any
    difference between the original image with sRGB, and the image assigned
    Adobe RGB then viewed with View > Proof Setup > Monitor RGB.

    I do have one more question though: when previewing with View > Proof Setup
    Gamma? That is, does it show the image as it would appear on my monitor
    without colour management, or does it show the image as it would appear on
    my monitor without colour management and without Adobe Gamma running?
    Derek Fountain, Jun 15, 2004
  9. Derek Fountain

    Mike Russell Guest

    Sounds correct to me, particularly the part about boosting reds selectively
    with color correction tools. Adobe RGB "reaches out" further into the red,
    green, and blue corners of the gamut than sRGB does, with red and green
    being more pronounced than blue.

    See this yourself with the Color Gamut Plotter image from Curvemeister: .

    There's a tutorial that describes how to use it. I would add that you may
    use the info palette, and sample points on the image to get a more
    quantitative read on where the corners of the gamut are, or where a
    particular color is on the plotter.
    sRGB is a good approximation for most digital cameras - which stands to
    reason, since the images are generally viewed on uncorrected monitors, and
    printed on sRGB printers.
    You can verify this by looking at the Color Gamut Plotter with two soft
    proofs, one for sRGB, and another for Monitor RGB. These should be very
    close because sRGB is a generic monitor profile, and most monitors are not
    much different from sRGB.
    A combination of the two. It shows how your image would look viewed on your
    current monitor settings, as set by Adobe Gamma, on a non-color managed
    application such as Netscape or Explorer.

    BTW - you may want to play with the engine settings as well. I find the
    gamut expands ever so slightly - a few percent - when switching to the
    Microsoft ICM. But again, after satisfying your curiosity about profiles,
    hit up curves and other color correction tools. The best book for this: Dan
    Margulis's Professional Photoshop.
    Mike Russell, Jun 15, 2004
  10. Yes. I agree with Bill on the point that the camera technically
    has it's own color space and that it's probably wider than sRGB
    in some areas, but the camera tags the image so that Photoshop
    sees it as an sRGB image. It's up to you if you want to treat
    it as such or not.
    Adobe RGB also goes farther into the blues than sRGB (particular
    the light ones towards cyan), so it's normal that you'll see a
    change in the blues too. If you have a WRML-viewer(*) installed,
    you can see a comparison between sRGB and Adobe RGB here:
    (Adobe RGB is the white wireframe).
    Main page is: <>.

    If you look at a comparison like this:
    - you'll see that the native gamut of a Canon D30 in some
    areas are larger than sRGB and in some areas smaller.
    Your camera's native color space probably doesn't look like
    the D30's but the gamut plot should show how different the
    native color space can be from the color space that the
    camera tags the image with. If you set the D30 to sRGB (if
    that's possible but I guess it is) it can happen, that a
    very saturated yellow from the real world will be clipped
    because the native color space of the D30 can "see" deeper
    into the yellow areas than the sRGB color space can honour.
    The same thing goes with the blues and greens.
    It must then mean that overall, the native color space of
    you camera is closer to sRGB than to Adobe RGB but in some
    parts (like the reds) it's closer to Adobe RGB.
    Since it's overall closer to sRGB than to Adobe RGB, it
    would probably be easier for you to adjust the few colors
    you aren't satisfied with (again the reds) in sRGB than to
    assign Adobe RGB and convert back to sRGB. Both sRGB and
    Adobe RGB are good working spaces because they're both gray
    balanced and perceptually uniform. Adobe RGB is just larger
    than sRGB.
    And this is why I mean, that your camera has originally
    captured a red color of say R:150. If the image is tagged
    with sRGB, a color-managed program like Photoshop knows
    exactly what that color looks like (L:43, a:67, b:58).

    Then you assign Adobe RGB.
    The red still has the number R:150 but R:150 in Adobe RGB is
    more saturated than R:150 in sRGB (L:50, a:76, b:65).

    You convert back to sRGB and now Photoshop changes the number
    to keep the appearance from source (Adobe RGB) to destination
    (sRGB). You now have R:233 but no clipping has taken place
    because both Adobe RGB and sRGB can contain L:50, a:76, b:65.
    I guess it depends on the quality of the monitor and the quality
    of the calibration and profiling but I often see a difference
    between sRGB, Adobe RGB and Monitor RGB because in some areas
    they're very different.
    Remember that most programs doesn't use the profile you load
    into Adobe Gamma. Only color-managed programs like Photoshop
    use it.
    It shows you how your image would appear in a non-color-managed
    program (like Internet Explorer on the Windows platform for
    instance). It takes the monitor profile (the one you have loaded
    in Adobe Gamma) out of the loop and sends the numbers directly
    to the monitor because that's what non-color-managed programs
    do. Normally Photoshop uses the monitor profile to correct the
    numbers that are send to the monitor but when you turn View >
    Proof Setup > Monitor RGB on, that function gets turned off.
    Thomas G. Madsen, Jun 15, 2004
  11. I made a mistake.
    I wrote R:150 but my examples was based on R:200. I'm sorry.

    R:150 in sRGB has the Lab-value: L:31, a:54, b:46
    In Adobe RGB it's: L:37, a:61, b:53.

    If you have an sRGB image with a color value of R:150, you'll
    end up with R:176 if you assign Adobe RGB and converts back
    to sRGB.
    Thomas G. Madsen, Jun 15, 2004
  12. Derek Fountain

    rgbcmyk Guest

    What is the way to convert a psd file for non-web display on a PC, like
    using IrfanView or similar? Will Proof Setup>Monitor RGB also be a
    reasonable approximation?
    rgbcmyk, Jun 15, 2004
    1. Advertisements

Ask a Question

Want to reply to this thread or ask your own question?

You'll need to choose a username for the site, which only take a couple of moments (here). After that, you can post your question and our members will help you out.