Okay, sRGB is not Really That Common
In numerous ways on the first page of this article, I indicated how popular the sRGB color space is, and how most devices and applications don't use anything else. What I really should have said is that many devices and applications don't pay any attention to color spaces — sRGB or otherwise — and just let the graphics card and monitor do what they want with the color data.
What any one person's graphics card and monitor will do with raw color data is anyone's guess — it depends on how the two were built, how old they're getting, how the user has adjusted the color/tint/brightness/contrast settings, etc. Everyone's system is different.
As different as everyone's system might be, overall there's an average, and that, it turns out, is how sRGB was designed. sRGB was designed to mimic the average colormetrically unaware Windows PC. Thus, at least in the Windows world, the phrase “is totally ignorant of color spaces” means, on average, sort of close to “strict adherence to the sRGB standard.”
In the old days, image color data more or less represented the voltage that should be fed into the cathode ray gun (in a Cathode Ray Tube — CRT — a standard monitor) to cause it to create the proper color on the screen. Software processing the image didn't modify this data, but rather shipped it off directly to the graphics card. The graphics card turned the raw numbers into raw voltages, and sent it off to the monitor. The monitor did what it wanted with the signal.
This is a perfectly acceptable color-encoding method if everyone has graphics cards and monitors that behave in exactly the same way. Of course, that's not the case. Heck, even a pair of identical monitors next to each other at the computer store show different colors.
Thus, in the old days, the colors you got from your system were highly dependent on your specific graphics card, monitor, and how you'd adjusted the monitor's settings.
Color printers use completely different color spaces — subtractive-color CYMK spaces rather than the additive-color RGB spaces that monitors use — so they had to do their best to convert from what were essentially monitor voltage levels to whatever they needed. As with monitors, color was hit and miss.
That mess of a situation was the old days. Applications were what I would call “Color Unaware.” Over the years, specific applications might have been made color aware — products from Apple and Adobe often led the way among mass-market companies. Still, the general population of PC software was slow to move to color-aware image handling, and one can surmise that this owes itself to Microsoft not taking a leadership role in pushing color-aware software.
The Advent of sRGB
As a first step toward moving the world of common PCs into a color-managed reality, 10 years ago (1996), Microsoft and HP created the sRGB color space. In short, this color space codified as a standard the color behavior of an average home Windows PC.
It created a starting point around which software and devices could take a small step toward full color management. It said, basically, that if an application or device got color data that didn't have a color profile associated with it, it should treat it in this very specific sRGB way, rather than the device-specific probably-pretty-close-to-average way that it would have done so in the past.
To be clear, the advent of sRGB didn't mean that suddenly every image on the fledgling web or stored on old floppies at home were suddenly sRGB-compliant. Old images, like old monitors, were still a hodgepodge of whatever they were. But with sRGB, digital cameras and scanners and software had a standard color space that they could create images in and still know that those images would probably look “okay” on old non-color-aware systems (because, again, the sRGB color space was designed with an average Joe's Windows computer in mind, to mimic what hardware had already tended to do). The design of sRGB reflects Microsoft's oft-repeated business strategy of “grandfathering” the former status-quo when designing new products.
It was a step. A baby step. It would have been nicer had Microsoft pushed for full color management, but in any case, this is what was done in 1996. In one sense, it was excellent timing, as it came at the cusp of explosions in two areas of popular culture: digital cameras, and the World Wide Web.
One problem with the design of sRGB is the least-common-denominator aspect of it. Monitors can reproduce only relatively small subset of colors, so using a monitor-related color space as a system-wide standard hurts pretty much everything that's not a monitor. That means that a digital camera has to throw away color information as it squeezes the wider range of colors it can record into an sRGB jpeg. It also means that printers that might be able to handle a wider range of colors won't even be given the chance.
And frankly, when I say that sRGB hurts everything that's not a monitor, I should say everything that's not an average consumer circa-1996 monitor. Monitor technology has advanced remarkably in the last 10 years, but holding on to sRGB as a global standard limits what the average person sees of those advances.
Using the “sound space” mentioned on the first page as a somewhat exaggerated example, it's as if the low sound quality standard of the 8-track-tape was applied to all sound devices (including FM radio, home stereo, etc.) and even later applied to modern-day compact discs and music players.
To be clear, the existence of sRGB in no way prevents the use of other, better color profiles where appropriate. But, unfortunately, while sRGB was supposed to be only a stepping stone, it has become entrenched.
Today, most digital cameras create pictures with sRGB-encoded data, without embedding a color profile. The lack of an included color profile is a symptom of just how entrenched and seen-as-permanent sRGB is in the minds of the consumer-products industry. The lack of an included color profile says “don't bother moving to fully color-managed systems; let's stick with 8-track quality sound” (so to speak). It's really a shame.
Higher-end pro/prosumer cameras, at least, can usually create images with better color spaces. The DCF standard allows for Adobe RGB to be specified by reference, without the need for a color profile (although as I mentioned on the previous page, as far as I know, no browser actually understands these “by reference” profile-less specifications).
So, for better or for worse, the vast majority of images you're likely to run into on the World Wide Web (for example) have sRGB color data, but no embedded color profile. This means that all browsers — all software but advanced image-processing applications — handle them without any color management, which means that the colors are, on average, likely to be sort of not too heinously off. Maybe. At best.
Colormetric Classes of Software Applications
Today, there are four colormetrically-distinct classes of application, listed here with my easy-to-remember label, from worst to best:
Color Stupid | What might have been called “Color Unaware” in the old days gets a more pejorative term today. A Color-Stupid application is still like the caveman days and does no color management, leaving the look of images up to whatever your graphics card and monitor happen to do with them. There is no way to ensure proper colors with a Color-Stupid application. IE (prior to IE9) is color stupid. |
Color Foolish | A Color-Foolish application is one that's smart enough to
understand embedded color profiles in images that have them, but does not
perform color management on unprofiled images. (Remember, 99.99% of the
images on the web have sRGB data but no embedded profile, so if you're a
web browser and know how to apply profiles, why not apply the sRGB profile
to unprofiled images?)
I should really list Color Foolish as the worst of the four classes, since it involves a specific decision to be dumb. (My initial name was “Color Moronic,” but that didn't have as nice a ring to it.) Web browswers that are claimed to be “color managed” like Safari and Firefox are Color Foolish. |
Color Stubborn | A Color-Stubborn application is one that refuses to move past sRGB as a first step, blindly treating all image data as if it were sRGB, completely ignoring embedded color profiles. This happens to work out well for most images on the web, but becomes part of the “entrenchment problem.” |
Color Smart | A Color-Smart application recognizes embedded color profiles, and treats unprofiled images as if they were sRGB (or, perhaps another color space it allows you to specify). This is the way it's supposed to be, but Color Smart applications are rare. For example, I know of only one Color Smart web browser, for any OS, ever. This is another shocking tidbit we'll get to soon. |
High-end image editors like Adobe Photoshop, for Windows or Mac, have been Color Smart for a long time.
Windows
The vast majority of software for Windows is Color Stupid. Notable exceptions are photo-processing software like Photoshop and Lightroom, and modern non-Microsoft browsers (Safari and Firefox).
Even Microsoft's supposedly-advanced Internet Explorer is not color managed. This is particularly shameful for Microsoft, considering that it and HP created the sRGB standard a decade ago, in which the recognition of embedded color profiles is explicitly recommended.
[Update: March 16, 2010: IE9, out today as a testdrive beta, has graduated from Color Stupid to Color Foolish.]
Perhaps even worse, it seems that Internet Explorer 4 provided ways to indicate the color space in which an image should be rendered, which is a fairly colormetrically advanced concept. It's not the right concept because it should just honor the color-space information in the image itself, but it's discouraging to see Microsoft backpedal on color management in this way; I've not been able to find references to color management in any later version of IE.
I had hope when Google's Chrome came out, but it's Color Stupid, too.
“Color Foolish” should be called “Apple Foolish”
The vast majority of software for OSX is Color Foolish or Color Stupid.
Apple software, and third-party software that uses Apple's image toolkits, are color managed. They recognize and respond to color profiles embedded in images. This is very, very good.
If an image is unprofiled (has no embedded profile), the best you can do is guess how to interpret the color data. Well, considering that just about every digital camera in use today by default produces images with sRGB data, and sRGB is the color space for the vast majority of images out on the web or on your hard drive — well, a guess of sRGB would be a smart guess. Yet, Apple's color-management software does not guess sRGB, but rather, guesses “the color data in this image was designed to work specifically for whatever monitor you happen to be using at the moment” (which is, in effect, the same as no management).
The sheer ineptness of this decision can not be overemphasized. There is almost no chance that there are any images in existence anywhere that were written with your particular monitor in mind, other than perhaps those you've created yourself with a color-stupid image editor. Thus, Apple's decision effectively guarantees the wrong colors. (Remember, in the case of a web browser, we're talking about the 99.9% of images out there that are unprofiled.)
I've struggled to come up with an analogy that suitably reflects the unfortunate magnitude of this decision, and the best I can come up with is this: imagine that there's someone who can speak every language in the world, and you send him to a mall in the middle of bread-and-butter America to interview people. If he comes across someone who happens to have their passport with them, he's to converse with them in their native language. But if someone doesn't have a passport with them, you instruct him to converse in a minor dialect of Hindi.
Make no mistake, this is a specific, conscious decision on Apple's part. There used to be an easy way you could override the default used for unprofiled images (so you could tell it to use sRGB), but Apple actually removed this feature in recent versions of their color-management software.
Update (Oct 22, 2006) — Apple engineer Dave Hyatt comments on the social/technical issues involved with using sRGB as the default color space for images. There are apparently social problems created by using sRGB as the default color space whose solutions are technically difficult. The root of the problem is that Macromedia Flash is not color managed, and web designers that which to use Flash also like to use images with colors that meld perfectly with the flash colors. Thus, images need to also be not color managed — at least images that have no explicit profile.
So, the sum of it is because some miniscule percent of web designers would find subtle color differences between their Flash and unprofiled images, Apple has chosen to cripple Safari color management.
Clearly, I don't agree with the conclusions that Dave comes to, but at least it's good to know that there are more than religious reasons behind it. (A previous version of this article was much more searing towards Apple for what I felt was a blindingly stupid colormetric decision. I still think the decision is wrong, but thanks to Dave's response I can at least understand what's behind it.)
Update (Feb 14, 2007) — it seems that the “miniscule percent” that I refer to in the Oct 22 update above is actually pretty big, according to this comment left by Dave on an OSX-related color management blog post by SmugMug president Chris MacAskill. (My mini claim to fame: although Chris doesn't mention me or this writeup — sniff-sniff, boo-hoo — I'm pretty sure that this writeup and some associated comments I made on a forum at Digital Photography Review were the genesis of his recent interest in the issue.)
More thoughts on how to actually solve the practical issues on the Mac are here: More on Digital Color Spaces: a Reply to Chris MacAskill.
Web Browsers for OSX
Unfortunately, most “big name” browsers for the Mac are Color Stupid — they do no color management at all, guaranteeing that every single image is shown with randomly wrong colors. These include Firefox, Opera, Mozilla, and Camino (although again, Firefox 3 can be made Color Foolish, as described above).
Most Mac browsers that aren't Color Stupid are Color Foolish — color managed, but default to no effectively management — including Apple's Safari, OmniWeb, iCab, Sunrise Browser, Shiira, Scourge, surfDude, Postino, and even RealPlayer. (RealPlayer for Windows is still not at all color managed.)
The Only Color-Smart Browser, Ever
It's truly ironic that the only Color-Smart Browser that's ever existed, as far as I know, is the now defunct Microsoft Internet Explorer for the Mac. It was color managed (if you turned on the option; oddly, it was not color managed by default) and it used sRGB for unprofiled images. Unfortunately, it was IE, so was woefully lame in every other respect. I hear that it doesn't even run on modern Macs. (Update: it does. I have it running on my Intel-based MacBook right now.)
The moral of this story so far is this:
Regardless what color space you use for your images out of the camera or in your own image-editing and image-printing software, when preparing an image for presentation on the web, be sure to convert it to sRGB if it's not already there, and be sure to embed a color profile.
The profile allows color-managed browsers to display colors properly, while the conversion to sRGB is the best you can hope to do for the others.
It's a sad state of affairs. I often peek at the metadata of other people's online photos (with my Online Image-Data Viewer), and it seems that a lot of people with pro and semi-pro cameras set them to save in different color spaces, such as AdobeRGB, and present them on the web that way (and without even an embedded profile). The problem is not that they use a different color space to begin with, but that they use something other than sRGB for the versions they present online; they're ensuring that pretty much everyone will see the wrong colors.
One of the most egregious offenders was me. When I got my Nikon D200, I'd heard that “AdobeRGB is better than the default sRGB,” so I ignorantly switched the camera settings to use the AdobeRGB color space when creating images. My ignorance was not in switching, but in not knowing the ramifications to the switch.
By the time I understood the issue, I had already put many of my images onto the web. Sigh. At least I'd done so with an embedded color profile.... usually. I didn't understand the issues, so who knows how many didn't have an embedded profile? I just didn't know. (I've since gone back and converted the ones I could find to sRGB; I must go back again to ensure that the sRGB color profile is actually included.)
It's a common refrain on photography forums: “My image's colors look washed out on the web.” Invariably, this is because their camera was set to use the Adobe RGB color space, and they blindly put the images on the web. However, it's only because they also viewed the images with a Color Smart application like Photoshop that they later noticed the washed-out effects viewing in the browser.
Mini-Rant About Photoshop's “Save for the Web”
Note: the section that follows applied to Photoshop CS3 and prior. Photoshop CS4 has a “Convert to sRGB” checkbox!
I'll take a moment at this point in the discussion to rant about Adobe Photoshop's “Save for the Web” feature, which allows you to conveniently tweak image-compression settings and immediately see the image-size vs. quality tradeoff being made. It also strips out all the metadata from the image, including the thumbnail that most cameras embed in the metadata, so that the resulting image is as small as possible. This is all good.
What is inexcusable is that this feature does not convert the color space to sRGB, or even offer the option. This is like a camping “water-purification kit” that cleans out mud but doesn't actually purify the water. If it's already microbe-free you'll be fine, but if not, you'll be silently poisoned.
Equally bad, it doesn't default to embedding a color profile. The reality of the current Web is that profiles are needed, even with sRGB.
I have a very high opinion of Adobe, but this iswas just moronic.
Mini-Rant About Camera Standards (EXIF and DCM)
It's wonderful that the camera makers have standardized much of how camera-created images are saved in a file, from the metadata like the time/date of the picture, to embedded copyright information, to file-naming conventions, etc. It allows third-party products (printers, photo-kiosks, etc.) to work with images directly from the camera, and it certainly simplifies things for the writer of image-handling applications (like web browsers, photo editors, etc.)
The problem is that the creators of these EXIF and DCM standards (JEITA) have been incredibly short-sighted on some issues. For example, the standard allows for encoding the time/date that an image was taken, but not for encoding the timezone associated with that time/date. Thus, if you have a bunch of photos taken from around the world, you can't sort chronologically. I asked a standard's committee member about this, to which he replied “Why would you want to encode the timezone?”. Unfathomable.
They also do not allow for embedding color profiles. They essentially require sRGB (a color space that embraces the limitations of circa 1996 monitors!) as the only color space officially supported. The DCF Version 2 (circa 2003) seems to allow for the use of Adobe RGB by encoding “R03” in the Exif “InteroperabilityIndex” field, but this is but a small step. (Adobe Photoshop responds to this field, but does any normal consumer software?)
I shouldn't feel too bad about not having gotten the color-profile stuff right, because even photo-hosting sites designed for pro photographers don't get it right. PBase strips an embedded color profile when creating the various non-original-sized versions of uploaded photos (thumbnails, medium, large, etc.). This guarantees incorrect colors. And these sites are geared toward pro photographers! I asked them about it, but they didn't seem to care, and said that they had no plans to fix it.
Photo-hosting sites Smugmug and zenfolio both convert incoming photos to sRGB if not already there, which is the best they can do for the world of Color Stupid browsers. That's excellent, I think, but it would be nice if they were to also embed a color profile, to allow color-managed browsers to show proper colors.
The most popular photo-sharing site, Flickr at least preserves any embedded color profile in the smaller-sized versions it makes. Unfortunately, they, too, don't convert thumbnails to sRGB, nor embed a color profile for sRGB-tagged images not having a profile.
Some do get it. All the pictures on Rob Galbraith's site are sRGB with an embedded profiles.
Continued on the Next Page
We now move from color mis-management the next page: Page 4: Color Management.
However, if you'd like to skip further technical stuff, feel free to skip directly to Page 7: Recommendations and Links.
> I’d heard that “AdobeRGB is better than the default sRGB,”
This is true.
Any manipulation is best done in the largest gamut possible. Tonal correction, color correction, resizing, or any other edits are best done in the largest gamut. You can set Photoshop to preview your edits in the target color space if needed. This is particularly true when printing images ( if the printing operation can handle color management ). If you use sRGB as a source profile, you have cut off some of the colors that could be printed.
> My ignorance was not in switching, but in not knowing the ramifications to the switch.
Actually, you switched profiles, but kept the same workflow. You needed to convert to the sRGB color space before you put an image to the web. With the source profile sRGB, you do not need to convert color spaces. When using a larger gamut working color space, you need to convert to sRGB just like you need to convert to PNG or JPEG.
If I may make a comment in general about color management – the real problem is that color manaement only really works if _all_ processes understand color management. If you have one piece of your workflow or one piece of software that doesn’t understand profiles or color management, you generally get _worse_ results than if you have a unmanaged system. For those that put one toe into color management, they get burned, and don’t want to touch it again. You really need to jump all the way in to get the most out of it, and then you run into the implementation problems you ( are just starting to ) describe.
Spaz.
http://webkit.org/blog/?p=73
(Safari’s Hyatt’s response).
Mac Internet Explorer 5.2.3 runs fine on Mac OS X 10.4.8, including on Intel Macs (with the Rosetta translation layer). If only other modern Mac browsers made such excellent use of drag-and-drop and proxy icons…
As far as I’m aware, Photoshop’s Save for Web does correct images to the sRGB space — if you use it on a non-sRGB image, it’ll shift it to sRGB before generating a color table or doing any compression.
Of course, while it does move the color numbers into the correct color space, it also doesn’t do any gamma correction, which results in the total chaos that ensues when you look at images in an idiot browser like Firefox. I’ve found that just running `mogrify +gamma 0 *.jpg` (or .png or .gif, as the case may be) on my images provides 100% color consistency between Safari and Firefox on the Mac. The colors still will look washed out compared to Windows, but at least they’ll be consistently washed out.
I am so looking forward to having to gamma-correct every single one of the dozens of images I’ve saved for web for my current big project. Thanks, Adobe.
David, Save-for-the-Web does not convert color spaces. It’s easy to test for yourself: use it on any non-sRGB image, save a JPG with an embedded color profile, and then inspect the file (e.g. with exiftool). You’ll see that it’s not sRGB.
About the gamma, you’re thinking of a concept for monitor adjustments. Changing the gamma changes the color space: digital-image color spaces, by definition, have their own gamma, and changing that gamma makes a different color space. So if something converts to sRGB, it must convert to sRGB’s gamma. It’s not a choice or optional.
When you modify your images as you described, you’re likely making a second mistake to try to compensate for a first one. Just as two wrong turns can happen to get you closer to your destination, it’s probably not best to rely on it.
Jeffrey
Photoshop CS3’s “Save for the Web” now lets you save as a sRGB by default. Location is the pull down where “File Size and Optimize Setting” are.
Matt’s comment below was to a version of this writeup that incorrectly stated that Windows browsers and apps were generally Color Stubborn. I have corrected that mistake, but leave Matt’s comment here as testimony to both his kindness to point it out and my embarrassment that he needed to. —Jeffrey
Nice article, but I take issue with one of your points.
In my experience the majority of Windows software (browers, image preview, etc.) is “Color Stupid” as you put it.
I have my system color calibrated. All sRGB images show up no where near what they should, except in color aware programs like Photoshop.
When displaying an image in a Windows application the application does no color conversions at all and simply displays the image using its raw color numbers. This is purely and simply “Color Stupid”. Really a sad state of affairs.
THANK YOU THANK YOU THANK YOU! After months of banging my head against a wall and reading all sorts of websites and books and posting in various forums, you have finally answered the question of why an image exported from Aperture as sRGB with an embeded profile looks correct in Aperture but so wrong in Firefox (on the mac), on the same screen, side by side.
Er, why would you want the timezone? Storing timestamps in a local time is completely and utterly the Wrong Thing, and is one of the many ways in which Windows fucked up. Store in UTC, converted to local as displayed. Then any kind of chronological munging is easy, easy, easy. And you don’t have to tell your camera which timezone it’s entering when you go abroad.
Er, Phil, how do you propose to “convert to local” without the timezone or comparable data (e.g. local offset from UTC)? —Jeffrey
Very nice blog. A few things still puzzle me.
1) Why do Windows browser don’t have problems with ‘un-profiled’ images blending into CSS elements? Do they translate all CSS elements into a device independent color space assuming that the CSS colors are defined in the sRGB space and from there via the monitor profile output it to the screen? Something too much of a performance hit for Safari according to Hyatt?
2) Converting an image into one’s own monitor profile should ensure that the image will look ‘correct’ in color-stupid apps (seems at least to work with my monitor profile). However, converting it into an exotic profile and then changing the monitor profile to that exotic one, does not work. What am I missing here?
Not sure if you got this info, but IE7 on Vista is NOT color managed.
–Marc
I love this article, I just stumbled into it looking for software to strip png’s of their profile, but this article helps me educate others with words I could not find myself 🙂
However, you are, in part, wrong about saving images for the web. Yes, a photo should be stored with a profile and yes, it would be a good idea to use sRGB. However, images used for page-design/layout should be stored unmodified and without a profile. Why? Because the browsers are at best Color Foolish. And their CSS-rendering is most certainly Color Stupid, see where I’m going?
You’re absolutely correct, and I talk about this under Suggestions for the Web Designer on the last page. I guess I should make that more clear on this page…. —Jeffrey
As Adobe’s initial intention for the ‘Save for Web’ feature seems to have been targeted at slicing a psd for use in your page-design I can totally see how they went for the unprofiled approach. However, having spent a long weekend fuming about their stupid CS3 release converting the colors of my images even when I turned of Color Management in my workspaces I can honestly tell you that by default they will now convert your images to sRGB, and trust me, the result is appalling for page-layout! Luckily they do allow you to choose not to convert to sRGB if you think you have a good reason to 🙂
So Adobe must have listened 🙂
Firefox 3.0 beta has color management, since about 27 July 2007. After installing a recent nightly build of Firefox, you have to go to about:config and set
gfx.color_management.enabled == true. Then go and browse some images with embedded ICC profiles or PNG cHRM/gAMA chunks.
Yes, it’s an exciting prospect. It’s still not complete, and how to continue is being discussed. —Jeffrey
Lightroom’s Web Module embeds sRGB IEC61966-2.1.
Jeff,
Indeed, I am looking at the CS3 Save For Web and Devices screen on my other monitor as I type this… while it’s obscured by being buried in a very weird little menu, just below the Done button to the left of “Preset – [imageType] — “, the menu has a Convert to sRGB and it’s defaulted to true.
While I’m sure this wasn’t the case in previous versions of Photoshop, I know Adobe sunk a TON of effort into CS3 and it seems they’ve finally added this feature.
thank you so much for this article.
I feel really stupid for not having looked into this much sooner. All my posted images are of course without an embedded profile… have to go back and correct this.
I do have one question. Your stating:
“Regardless what color space you use for your images out of the camera or in your own image-editing and image-printing software, when preparing an image for presentation on the web, be sure to convert it to sRGB if it’s not already there, and be sure to embed a color profile.”
How can an image have two color spaces sRGB and an embedded profile? Sorry, if I don’t understand if you already pointed this out.
Thanks again for this great article and happy new year.
Simon, any particular image’s data is in one color space (such as sRGB, AdobeRGB, etc.), and you can use software like Photoshop to create copies that use a different color space.
An independent issue is whether the color space that the data is to be interpreted in is somehow indicated in the file, or left unstated. There are several ways that the color space can be indicated, one of which is to include the color profile for the image data’s color space. That’s the safest approach for web images because otherwise smart browsers like Safari don’t recognize the other ways an image might indicate the colorspace of its data. —Jeffrey
Thank you for your clarification.
Just to make sure I understand it correctly.
You would save your “good version” of a photo in a wider color space (such as AdobeRGB instead of sRGB) but then save a second version (second file) intended for posting on the internet in sRGB with sRGB embedded in the file.
Generally speaking, I’d keep the “good version” in the color space that the camera produced. With Lightroom, you generally keep the direct-from-camera original unmodified, and export a new version only for specific needs.
As I understand it, one single file can not have 2 different color profiles? For example you can’t save it as a sRGB but embed an AdobeRGB color profile, right?
Thanks again.
Well, you can, but it’d be a mistake, just as a book written in French can be misfiled in the “Japanese” section of a library. The image data are just numbers, with the profile serving as specific instruction on how those numbers should be interpreted. Including the incorrect profile guarantees misinterpreted colors in applications that respect the color profile —Jeffrey
A great article that I can use to help educate the masses – thanks!
One area of disagreement:
“Mini-Rant About Photoshop’s “Save for the Web”
I’ll take a moment at this point in the discussion to rant about Adobe Photoshop’s “Save for the Web” feature, which allows you to conveniently tweak image-compression settings and immediately see the image-size vs. quality tradeoff being made. It also strips out all the metadata from the image, including the thumbnail that most cameras embed in the metadata, so that the resulting image is as small as possible. This is all good.”
No, it’s NOT!!! Stripping out all metadata is a photographer’s worst nightmare, as it is likely to result in orphaned images.
See http://www.asmp.org/news/press/20060713_metadata.php and check out the Manifesto. There is an active movement to get Adobe to change this behavior.
Thanks!
I disagree that “save for the web” is always wrong to strip most metadata. A copy of an image on a web site is generally not intended to be a source of all knowledge about an image, but rather, an easy-to-digest (small in image size and file size) visual rendition. You wouldn’t use “save for the web” for a final archive-quality version of an image, but rather, for a slimmed down version suitable for easy downloading. I’ve seen plenty of images whose thumbnail is larger (in both senses) than the image itself! This waste of bandwidth is not very respectful of the user.
That being said, I like to see control left with the photographer, so I’d like to see any form of image-save allow an informed user to pick and choose exactly what metadata is included and excluded. —Jeffrey
Thanks for a great page. I’m still cofused, however, about monitor calibration/profiles. I have a Sony HiColor (wide gamut) laptop and “calibrated” the monitor with a Spyder2. But the colors are still oversaturated (‘course I’m not using PhotoShop). Why doesn’t my calibrated monitor map images from the Internet correctly? If I were to save these (profiless) Internet images and then open them up in PhotoShop, would they appear correctly? What does calibrating a monitor do, and how is it related to color spaces?
Thanks!
“Calibration” (adjusting the monitor so that it generates proper colors) and “profiling” (creating a color profile for the monitor so that you know exactly what light is produced from what signals) have meaning only when used with software that uses the fruits of that work. Photoshop is a color-managed application, meaning that it knows how to convert data from the image’s color space to the monitor’s color space. If an application is not color managed (such as IE, Firefox, Irfanview, or most non-pro apps), they don’t know that, so your calibration and profiling just end up giving you a different random result. Safari is color managed for some kinds of images, as can be Firefox 3 (currently in beta), so things are looking up, but there’s still a long way to go. —Jeffrey
Great Blog!
I would add one more type of color handling (I tried to make up name for it, but I didn’t figure anything).
I don’t know about other OS, but in Windows there is lot of programs which says they can do Color Management. Actually they just converts images from source profile to sRGB-profile and totally ignore monitor ICC-profile.
Here is examples (I have only tested Windows versions):
-Windows XP built-in imageviewer
-Fast Stone Image Viewer 3.5
-Adobe Reader 8 (!?)
-Irfanview
So, if your monitor is not calibrated exactly sRGB, you get random results. This “source profile”->”sRGB”-conversion thing confuses even more this whole mess off wrong Color Management.
At first I couldn’t believe it, but anyone can test this. Just put to Windows Monitor Color Management options something else than sRGB-profile and compare images to what you see in Photoshop (or Gimp or Safari).
Other little thing I noticed: with default settings, Photoshop treats some unprofiled sRGB images as there would be profile. I noticed this when I loaded some images to Safari and Photoshop. Photoshop didn’t give any error about missing colorspace but Safari didn’t Color Managed those images.
Answer is in EXIF-tags. Some programs (like Photoshop) can read profile from EXIF:ColorSpace-tag even when there is no ICC-profile embedded.
Example my Nikon D40 doesn’t embed ICC-profile to sRGB-images (with AdobeRGB it does) but Photoshop opens images like there is sRGB-ICC-profile.
I think this is important: With default settings, you can’t tell with Photoshop does imagefile include ICC-profile or not!
There is actually option for change this behaviour (CS2):
Preferenses->File Handling->Ignore EXIF profile tag
Ah, loved this article. It says so succinctly stuff that I’ve learnt from half a dozen websites. And the previous page with the diff photos really take the cake. I turned off my FF3 color mgmt just to cross check 😉 . I can confirm that G-chrome doesnt perform color management.
Perhaps you need a new term (Color Absurd?) to describe apps which recognize embedded color profiles, but refuse to honour color tags. Color profiles are standard, so I see no reason why the app does not render it in the correct color space when it finds a color tag.
Hopefully as more apps become color aware, all it will take is the metadata to render correctly, rather than have to bundle a standard profile in each image. Its like giving a dictionary to interpret each time a word is spoken.
My old P&S only tagged images, but didnt embed the color profile. Fine. But surprisingly, even my Pentax DSLR doesn’t embed the color profile, not for sRGB and not in Adobe RGB. Hmmm…
Heyaaa. =)
I found your article on stumbleupon, I really love it. However, even if it is 2 years 2 months old, people are still seeing it, and it’d be nice if you updated this with the fact that Firefox 3 is a Color Smart application by option, and 3.1 is looking like it’s gonna be set for Color Smart by default. And as I’m sure you know, Firefox is available on Mac, Windows, and Linux. 🙂
Very nicely written.
On the “tagged” images: I had assumed that one has a tag “sRGB” and the other a tag “Undefined”, yet the AdobeRGB image opens fine in Photoshop…
Nice.
Learned something again 😉
Just a comment on the date solution mentioned in a previous comment.
To convert to “local” the software can easily determine what TZ is currently set on the computer being used. Conversion from UTC to a local time is easy in this way and is the safest and most consistent thing to do. Having to change your camera every time you switch timezones would be a minor nightmare for travelers, as it’s one more thing to remember to fix when you get to your destination. Just put the camera in UTC and software should be able to figure it out.
However, I know Lightroom 1 had a nasty habit of interpreting the time in the metadata as being in the currently set TZ on the computer being used, so setting your camera to UTC nearly always resulted in bad dates. The best thing to do for Lightroom is to set your camera to your local TZ and never ever change the TZ on your computer while importing photos. A pain, but the only thing that “works”.
I completely agree that the TZ should be encoded in the metadata, because without it the software has to make an assumption, and we know where that leads.
Sorry, minor clarification. When I said “The best thing to do for Lightroom is to set your camera to your local TZ”, I meant to say “set your camera to your home TZ”, that is, the TZ that your computer is generally set to when you’re importing photos.
Strange, but MSIE can perform Color Management:
Open http://fitt.tychy.pl/icmtest/ in MSIE . You should see a slight difference.
Hmm, some edits were done since I last read this, and I think not all of them are right…
Firefox 3.0 is not color managed by default (Color Stupid) and fully colormanaged when set to. (Color Smart, not Color Foolish)
FF 3.5 is Color Foolish by default, and can be set to either get Color Stupid or Color smart.
As far as I know, the “convert to sRGB” option in the “Save for Web” dialog box was introduced in PSCS3, not CS4.
Jeffrey, Thanks lot for this most informative article on Color Spaces and CMS as a whole . In fact I read the complete 7 pages twice .
Rene Damkot,
I agree with what you said about FF3.0 and FF3.5 , as I tested and concluded the same and I
request Jeffrey to look in to it ,and update the same in the main article.
The main issue is about FF3.0 ,when it is CMS enabled it is smart type not foolish type.
The second issue is FF3.5 by default is foolish type (mode 2), What a pity! they should make it smart type ( mode 1) out of the box.
Do others agree with my view ?
I have a client who has a site with a JPG background, and they have a certain part of that site where they want a flash element (see the bubble anim on absoluteleigh.com). On Safari the color of the backgrounds do NOT match and you get a big seam up the middle of the site. I’m glad I found this article/discussion and I was wondering if anyone can tell me if this problem is solvable from my perspective (as a developer). That is, is there anything I can do to eliminate a seam in Safari between a JPG and a flash movie that utilizes the same JPG as a background. I appreciate any insight.
Last I checked in on Safari, it treats images without embedded profiles in the same way flash does, for exactly this reasons, so strip any color-profile info from the image and it should be fine. This Safari design decision work out great for you, but it would make so much more sense for them to recognize embedded “this is sRGB” notations as well….. then you’d still get your win, and out-of-camera JPGs would be displayed better as well. —Jeffrey
Hi Jeffrey,
Thanks for writing such a great article. A few months ago I didn’t even know what color management was. Because of this and a few other good articles out there, I now at least have a decent understanding of the basics.
The reason I’m interested in learning more about CM is my notebook screen. I have a Dell Studio XPS notebook with a wide gamut RGB LED screen. I decided to buy this (quite expensive) screen because of the great reviews I read about it. And it is a great screen, the high resolution and brightness are just stunning. But it didn’t take long for me to notice that some colors look horribly wrong (over saturated). e.g. the reds look almost pink. It’s easy to understand that this is very annoying when watching movies, browsing, using Office, etc. And of course when editing photo’s.
I now know the reason for this and I’m trying to find the best possible solution for the problem. That’s why I’d like to ask your thoughts on some things.
I found a forum about the exact screen and this has already been of great help to me. Lots of people there have used calibration hardware to create profiles for the screen and since I’m not planning on buying such hardware and don’t know anyone to borrow it from, I’m going to assume those profiles are good enough for my screen as well.
http://forum.notebookreview.com/showthread.php?t=382939&highlight=studio+xps+16+color+profile
The biggest difficulty I’m facing now is the fact that some of my applications are color managed but most are not. I’ve come up with two possible ways to make my display look as correct as I possibly can:
I could ignore every word said about color management and just calibrate my display to look like an sRGB. This is a great solution for applications that are not color managed but how will this affect CM applications? (i.e. will photoshop display correct images when my monitor is configured in such a way that unmanaged applications look OK?) This isn’t a good solution of course because why would I buy a wide gamut display then.
A lot better would be to use as much CM applications as possible and use a correct monitor profile which I’m sure I’ll find at the forum mentioned above. But this leaves all my unmanaged applications looking horrible. Is there any way to make at least those where color is important (all kinds of Windows previews, thumbnails and photo viewers, movie editing software, media players, paint and office) look somewhat correct with the correct monitor profile in place for those that are CM?
There might be a third possibility. If one were to set the graphics cards settings in such a way that the screen looks like sRGB and then do a calibration that would consider those settings as default and create a profile to convert from data in those settings to data in wideRGB to be displayed correctly on the screen. Could it be possible to kind of ‘get the best of both worlds’ in such a way or would this just totally mess up the CM applications? Some people on the forum have spoken of this as well but I don’t think it has been tried yet. I’d just like to know your thoughts.
To conclude I’d like to add this list of software that I use. It would be great if you could tell me which ones are CM and if you know any color managed alternatives to the ones that are not.
Windows desktop (I know this isn’t CM and I can live with that)
Windows preview
Windows Photo Viewer
Windows Live Photo Gallery
Windows Live Movie Maker
Camtasia Studio and Fraps (Or any other editing and recording software)
Irfanview (is CM)
Photoshop (is CM. I don’t use it very often.)
Windows Media Player (I’ve seen that there is a way to make the classic player somewhat CM)
Power DVD (Or any other software of this kind. I know no media player is CM but I’d like to find a solution to properly watch movies. It’s annoying when people’s faces are ‘red’! Probably the only way to fix this is to temporarily adjust the display to look somewhat like sRGB)
Windows Media Center (Only use this to watch live TV via an antenna. The same applies here as with Power DVD)
Games (The same applies here again I suppose.)
Adobe Reader (I think it is CM.)
Paint
Office 2007 and possible 2010 in the future
Internet browsers (I use Firefox 3.5 which I know is CM but I’d like to know some alternatives.)
Webcam software (I have a program from Dell that is probably not CM. A program that adds a color profile to the pictures would be nice.)
Viewing a webcam stream in Messaging programs like Live Messenger or Skype (Not really that important but it would be nice to know.)
Flash player (i.e. Are Youtube video’s displayed in my browser correctly? I think the progress bar is not, it looks pinkish too.)
Sorry this post has gotten so long but I’m just trying to be complete. I know I’m not the only one having this problem so hopefully this can be of use for others too. Thanks in advance.
Greetings,
Jeroen
I would guess that your third idea would not work, because even though you calibrate it after you make the hardware changes, the hardware changes have left it so that it can’t generate colors outside sRGB, so a CM application won’t be able to drive any other colors. Microsoft is notorious for completely ignoring color management, so I’m not sure there’s much you can do until they get a clue, other than not use their products or put up with it. non-IE browsers are often color managed these days, at least to some extent. Check out Safari and perhaps Chrome. Last I checked Irfanview wasn’t color managed… maybe it is now? —Jeffrey
Great articles and comments. Answered a host of questions for me.
Just to say that Irfan View for Windows 7 is now colour managed but you have to specifically enable it. By default it is not. One side effect is that after you turn on colour management it takes much longer to display images.
Thanks,
Stefan (UK)
Interesting article. Considering that this article is linked to from http://regex.info/exif.cgi and I suspect a number of people are still reading it, it’d be worth re-investigating the state of the world in 2013. I suspect its much better now based on my limited experimentation.
Is mandating sRGB now the right thing, or are Color Smart browsers ubiquitous enough that smaller images with no color profile information are a good choice?
I’m writing from Seattle, but originate from New Zealand.
One thing about color management is that it’s SLOW. You have to apply something like 3 gamma functions (one for red, green and blue), plus a whole matrix transform (9 multiplications + 12 additions) for every single pixel. Considering the recent trend towards large resolutions (1920×1080 and so on, not to mention iPhone-style double resolution “retina” screens), this is a lot of data to process.
This is why Flash isn’t color corrected – you would have to color correct more or less the whole screen at 60fps. It’s relatively doable on GFX hardware if you have a reasonably fast 3d card but you’re essentially doing a post-process shader on the whole screen. But mobile devices don’t have that extra leftover processing power, and same goes for people with older computers (especially older laptops), and having this correction dynamically turn on or off depending on your hardware is a logistical nightmare and a great plan to make sure no web page shows up the same anywhere, ever.
As for applications other than graphics editing (where color correction makes perfect sense, of course), they already have a zillion much more important features to implement and debug, and they will never implement color correction. Every single feature you add to a program makes it more impossible to write/maintain, and makes it more buggy, and pushes it one step closer to oblivion (essentially the point where fixing 1 bug introduces more than 1 new bug on average).
For a program where color correction isn’t essential (for instance a game or audio program such as a DAW), adding color correction is stupid: you’re adding another step in the rendering pipeline which eats up valuable CPU or GPU time (making the GUI less snappy), and it’s another step that you’re going to have to debug (and if it breaks on, say, OSX then you can easily lose a whole week to debug it and make it work OK), and considering your short term memory can only hold about 7 items at the same time, if your GUI rendering code has 7 elements, you reach 8 elements and then you can’t understand your whole rendering code all at the same time anymore, and it becomes exponentially harder to debug and then you’re doomed.
H. Lamontagne said: “they already have a zillion much more important features to implement and debug, and they will never implement color correction. Every single feature you add to a program makes it more impossible to write/maintain, and makes it more buggy”
So instead of fixing something that is broken for everyone today, they should leave it alone because there’s a chance their fix might not be perfect?
“considering your short term memory can only hold about 7 items at the same time, if your GUI rendering code has 7 elements, you reach 8 elements and then you can’t understand your whole rendering code all at the same time anymore, and it becomes exponentially harder to debug and then you’re doomed.”
Haha, OK. I’m also going to not worry about Unicode bugs because I’ve already got 7 other bugs in my program and ASCII should be good enough for anyone! My program has 7 usable features and if that’s good enough for my nervous system’s short-term memory it should be good enough for my users.
AAAAAGGGH I JUST DO NOT GET IT.
I’ve literally been researching this for weeks. I’ve spent countless hours, going from article to article. I’m not a stupid man. But I think there’s some small, fundamental nugget of information about color spaces, which everyone, yourself included, is unknowingly omitting.
You say:
“When a different color space is used to encode the raw image data, the resulting data is still just a bunch of raw numbers”
“Without the proper color profile associated with the color space used to create the image data, applications don’t know how to decode the color data.”
“A Color-Stupid application is still like the caveman days and does no color management, leaving the look of images up to whatever your graphics card and monitor happen to do with them.”
You say that all images should come with a color profile. Otherwise, a browser/graphics card/monitor will misinterpret them.
But why would the image be misinterpreted?? What could the monitor possibly be doing that would screw it up?
Going back to your “65 mph” versus “65 kph” analogy….
Let’s say I have an image where every pixel has the values of 065,000,000.
Every computer/gpu/monitor already knows that the first value is “red.” Correct? Red, then green, then blue. Then we go on to the next pixel. Correct?
So, we know that we have “65” for red. So exactly how much red is that?
Well, if we have an 8-bit monitor (therefore, only 256 possible brightness values for each of the 3 channels (R, G, and B)), and the computer it’s attached to KNOWS that it’s an 8-bit monitor, (because why wouldn’t it?) then you take 65/256 = 0.254. Let’s say that our monitor uses LEDs, and 2 volts to a red LED is as bright as that LED can get. So we take 0.2539, multiply it by 2, which gives us 0.509.
Therefore, “065,000,000” should be displayed as: “0.509 volts to the red LED.”
And this will display a somewhat-dark-red color.
Right??
(By the way, I’m treating this linearly, ignoring gamma curves for the moment, because frankly I don’t understand exactly when they come in.)
Now, not all LEDs are the same. Some might emit a slightly different wavelength. Instead of 700nm (as it should be according to the International Commission on Illumination, I think,) it might be 702nm, or 693nm. And it might be brighter, or dimmer, according to the type of LED, or the monitor’s own brightness/contrast/whatever settings. That’s why the viewer should properly calibrate their display. Grandma’s pink TV is HER problem, not OURS. We should always deliver an image that looks good on a calibrated display… right? Right.
SOOOO,
If that monitor is 10-bit, (allowing a total of 1024 values, yes?) perhaps the instruction “65,0,0” would result in a VERY dark red, because the computer would do the math like this: 65/1023 = 0.063. Multiply by 2 (again, 2 volts being the maximum for this monitor’s red sub-pixels,) and you get just 0.12 volts to the red LED. A very dark red. TOO dark.
Is THAT what happens to an image that does not have a color profile??
Because, in this situation, it seems to me that SURELY the computer/monitor would be smart enough to know that it is 10-bit, because otherwise, everyone who buys a 10-bit monitor would complain that tons of images on the web, (which, as we know, often do not have a color profile) look way darker than they should. Surely a 10-bit monitor/computer would know to multiply everything by 4, and therefore a value like 255,255,255 would “become” 1023,1023,1023 and would display as pure white, like it should. So, the responsibility for correctly interpreting those numbers, should ALWAYS be on the viewer’s device…
Riiiiiight??
In binary, the color 65,0,0 is this: 10000010000000000000000 …and then we go on to the next pixel. In the context of an image, there’s no possible way to interpret this as anything other than 8-bit color, because there is only one byte of data per channel, per pixel.
A color profile cannot possibly know if the viewer’s monitor is 8-bit, 10-bit, 12-bit, Adobe RGB, HDR, or whatever it might be! But the monitor/computer DOES know.
I just… I still don’t understand why color profiles are even necessary. They seem to be making this so much more complicated than it needs to be. Are 8-bit R G and B values not absolute? Are they NOT always red, green, and blue? They can just be ANYTHING? Why???
In Photoshop, on the photo of you and your son that has a custom color profile on it, I found a blue part of your sunglasses, which has these values associated with it if you use the eyedropper tool: 139,068,068. But these values are “wrong.” Photoshop is lying to me. I can clearly see that there is more blue than red.
If I take a screenshot, open that as a new image, and use the eyedropper on the exact same color, the pixel values are now “correct:” 091,113,172. We can see just from these numbers that there is more blue than anything else.
But when I un-assign your “custom RGB” profile, and assign the “sRGB IEC61966-2.1” color space to the photo, your skin turns green, and the sunglasses become a rusty-looking red. The sunglasses are still 139,068,068. Now the values actually match what the color looks like to my eyes. Photoshop’s eyedropper is no longer “lying” about what those colors are. Why was it lying to me? What’s the point? If you want the color of your sunglasses to be 091,113,172, why not just specify that in the first place? Just “bake it in,” so to speak. Why would anyone, or any device, deliberately do this weird roundabout thing where the stored numbers are wrong, and require a color profile to “fix” them? If the device that created that image already knows that the colors need fixing, why doesn’t it just fix them??
I’m just rambling now. My thoughts are disorganized and incoherent. I don’t even know what questions to ask. I am so incredibly lost on this stuff. It does not make sense.
I understand that adobeRGB has much “greener greens” than sRGB. And I also understand that it, too, uses only 256 total values for each channel. I understand that an image that was taken in adobeRGB, needs to have some metadata which says, “this image is adobeRGB,” so that responsible programs like Photoshop will know exactly how to display that image. (assuming that the monitor is capable of displaying those colors.)
But I’m NOT sure what happens, exactly, if a website has an adobeRGB image on it, and the viewer’s monitor can only display sRGB. (And, furthermore, let’s imagine that the browser is “color stupid.”) Does the image simply not load? Is “0,255,0” in the adobeRGB color space, simply treated as “0,255,0” in sRGB color space? (and so on for all the other values?) Because that would make the most sense to me. (Is this, or is this NOT, a “relative colorimetric” conversion?)
What exactly happens if there is no color management? What weird/incorrect decisions could the monitor possibly be making about how to display those values?
agggh help
Without profiles, “255,0,0” simply means “as red as you can get”, which differs wildly based upon the hardware. The differences are in all three channels, and perhaps not linear (and their “not linearness” differs among channels on the same hardware), so that makes something specific like “57,210,110” turn out to be a dart throw: go 57/255th of the way between your darkest red and your brightest red, then shuffle over 210/255th of the way between your darkest green and your brightest green, and finally mosey on over 110/255th of the way between your darkest blue and brightest blue. That may or may not hit the mark, but probably not. Now do that for every color, and you may find them all over the place, relative to what the “real” colors should be, and how they should interact. Contrast that with going through a profile for each color, which effectively says “here’s a specific shade, by wavelength and intensity… do whatever you need to do to get as close to that as possible.” In many cases, due to the limits of the hardware, it simply can’t get that color (the target color is too bright/dark/rich for the hardware to replicate). The various rendering intents combine with the profile to describe how to map the desired colors to what the hardware can actually deliver. —Jeffrey
-This article is almost 16 years old and still comes handy.