I'm a fairly seasoned photographer and computer guy, so it only took me a few hours to figure this out, but I know of at least one professional photographer who had quit using 365project because of this issue. So hopefully, the powers that be (Ross?) will heed my warning, and add a FAQ to the site.
1) If you save out images using standard image editing software (I like Lightroom and Photoshop) it will not always save the (correct) ICC color profile along with the image by default.
2) When certain browsers see a lack of a correct ICC color profile, they will -randomize- the colors that are displayed. Sometimes, the images look fine, sometimes, the images look terrible. I mean, really bad.
3) Most people DO NOT KNOW that this is happening, because they will view the image on their desktop browser, and not view it in other formats (such as on a tablet or a phone).
4) Someone with a phone or a tablet will view your image, and it will look very bad color-wise.
5) Profit.
Anyway. The fix is super simple: when you're saving out your images in Photoshop (either "Save for Web" or just with the "Save As" button) just look for the "embed ICC" checkmark box, and select the sRGB color space. This will map the colors of your image, to the standard sRGB color space that most/all browsers use.
Please feel free to comment here if what I'm saying is less than accurate. I'm not a color space expert, and I realize that some folks are fiddling with Adobe RGB and ProRGB spaces, but I do believe that when working with the web, your color space should (always?) be sRGB.
OMG!!! Thank you so much for this information!!!! This has been bothering me for YEARS. Literally years! I am going to go test this right now and will post my results shortly!
@amarand thank you! Now I know why some of my photos look freaky when viewed on phones, tablets, other browsers, etc. I've had people comment before about a color and I would always wonder if they were color blind and then I got a smart phone and viewed it on my phone and found that sometimes it will either change a color or over saturate it or give it a creepy glow. Very valuable information here.
@jsw0109 I know that Autumn and I both use the same color management system (ColorMunki) to calibrate our screens (which are also identical). When you view them in certain browsers they look great "Wow, what vibrant color!" Then, a few minutes later, if I'm away from the monitor, and I pull it up on my phone, I'm like "Ugh! Those strawberries look half-dead!" And I know it's a color space issue, and because it's a -random- thing, you never know what you're going to get.
@jsw0109 As a systems administrator, I have to debug this stuff a lot, and the best way to verify what color space your images are in, is to run them against this: http://regex.info/exif.cgi
It'll show you what color space (if any) is embedded in the image. If you don't see sRGB, and you're working with the web, you're asking for trouble.
Always. No exceptions for Web display. sRGB color space. You might notice that all Web based competitions and professional sites, Nikon, Canon, National Geographic, all explicitly specify jpegs and sRGB for submissions. Issue comes up every six months or so. Alexis Birkill @abirkill answered this many times.
I'm putting this out here in the hopes that this gets added to the FAQ, because as a graduate of The 4-Hour Workweek, I know that anytime someone's asked the question more than once (check the history of discussions here for "bad color" and the like - this has been addressed many times over the past few years), it's probably something you should be entering into your FAQ. Maybe not a comprehensive ten paragraph discussion (that's clearly not appropriate for a FAQ), but at least offer a brief description of the known problem, how to fix it, and a quick link to a reputable source to explain what's happening.
I did some test uploads of the strawberries and crayons I had posted previously with the embedded profile on January 1st and 2nd and the difference is immediately apparent when viewing on my iPhone and iPad!!! Thank you so much for the solution. I have been using sRGB and all that but the embedded profile was the problem. One little checkmark makes everything better. =D
I realize you probably won't see a difference on your Mac or PC but you should see a big difference on your phones and tablets. WOW! Thanks again @amarand!!!
@frankhymus Thanks for copying Ross! I'm a bit new to this site...thanks to @autumneden2015 for originally recommending me. It's certainly a great way to stay creative every day - which is wonderful for every creator, regardless of discipline!
Very interesting! Since I work entirely on a MacBook, I had no idea. What's also interesting is that iPhoto uses a different color space (Adobe) than does my Photoshop (sRGB), and that PicMonkey--outside of 365---saved my collage with "no information" about color space.
@houser934 Adobe is a larger color space than sRGB, so some colors map weirdly, causing strange color casts. But "no information" is the worst, and causes the randomness shown in the strawberry pics above. But yeah, it's always best to intentionally choose a color space and embed it. 😸
@cimes1 I like to read and reply to comments on my phone when I have free time and that is when it is most noticeable. But the issue can appear in more than one place such as Facebook and Flickr too! I have noticed it the most with my own photos but *I know* what they are supposed to look like and seeing the difference between my Mac and my iPhone is jarring to say the least. One of the reasons I stopped doing 365 is I didn't want my customers to see photos like the strawberries and have them wonder about the colors and *my* quality. At least now I know how to keep them consistent across sites.
@cimes1 This post is a caution especially for people who only use a desktop/laptop in their workflow and viewing. Your viewers might be seeing your images in a way not intended by you, and as seen in the screen capture above, it can be the difference between pretty, fresh, vibrant fruit and something that looks like it's ready to be tossed. Best not to leave that to chance. Your mobile audience is only going to grow, and most viewers won't be kind enough (or perhaps have the visual vocabulary) to explain why your photographs look wrong.
@amarand I have noticed a couple times when I posted a picture the colours were not quite right. I have even trying to figure our in Lightroom 5 where I check the "embed icc" box that everyone is referring to? Do you do it upon export? Any help would be appreciated.
Write a Reply
Sign up for a free account or Sign in to post a comment.
Tweets ahoy!
Join the Group
Pin With Me
It'll show you what color space (if any) is embedded in the image. If you don't see sRGB, and you're working with the web, you're asking for trouble.
After saving with the profile:
Before saving with the profile:
After saving with the profile
I realize you probably won't see a difference on your Mac or PC but you should see a big difference on your phones and tablets. WOW! Thanks again @amarand!!!