Tuesday, July 28, 2009

This is why your colors are gross

A friend of mine just got himself a fancy-pants new camera (and when I say fancy-pants, I really mean fancy-tuxedo-pants), and mentioned that Blogger had sucked the life out of his photos. That's always the joke right? You buy a nice camera, but then what goes on the net looks like it came from your Senior party disposable camera. I've been there too.

So, here's why it's important to make sure that photos you post to the web are assigned to the sRGB color space rather than the Adobe RGB color space that a fancy-tuxedo-pants camera might be set in (hint: because if you don't make the switch, all your colors will look washed out and gross). The reason why is more or less this: computers aren't the warm and feeling individuals that we are and instead of red-orange being red-orange it's a series of numbers (think 20,40,80 or 1,2,3). Now, you don't want numbers where there should be colors, so you must use some kind of table to decode them. Perhaps in the sRGB table 1,2,3 represents orange and in the Adobe RGB table it represents red-orange. The problem is that many browsers out there assume that all images are using the sRGB table, coloring your beautiful Adobe RGB tagged flower orange instead of it's original red-orange. Check out the examples below:

This first one was left in Adobe RGB. It's kind of washed out.
This photo was converted to sRGB. Notice the difference? It helps if you open these photos in separate tabs and switch between the two.

It turns out that some browsers (Firefox, Safari) can determine what color space is associated with the file, and assign the correct colors (in other words, they are "color managed"). If I were to give you the original JPEGs of these two shots, and you opened them in one of these browsers, they would look the same (Chrome, Opera and IE don't color manage and the photos would look different, like they do above). So, if you happen to be reading this post using Safari or Firefox and notice the difference you might be getting a little confused. Well, there's one more little point to discuss, and that is what Picasa does to your photos.

Since users of these two color managed browsers do notice the difference between the two photos above, I'm guessing that when you upload photos to Picasa (they host your Blogger photos, right?) it assumes that the photo has been tagged with the sRGB color space. So, regardless of your browser's ability to manage color spaces, Picasa has stepped in and outsmarted it by looking up the colors using the sRGB table and making your red-oranges orange. Boo. It would be nice if it left the photo as is and let the browser sort it out, but for whatever reason it doesn't. So, long story short, if you're going to post things to Blogger, make sure the photo is using sRGB before you upload it.

A little side not here - if you happen to own a Leica M8, the default color space should be sRGB, unless a previous owner has changed it. So if you happen to be taking photos in sRGB, and nothing else (like Photoshop) has reassigned the color space, I don't know what to tell you.

Oh, one more thing, if you shrink your photos down for the web, you might want to fiddle around with the Unsharp Mask, since you might have lost some of the sharpness. YMMV.

2 comments:

Brigham said...

You are a hero. I've made my first s exports, lets hope my blog stops looking a disgrace on this next post.

Side of Jeffrey said...

YOu know what is funny? I learned that in college but forgot all about it until you wrote this post. I probably forgot it because it has no personal application...for now.