Have you ever uploaded a colorful and crisp image into WordPress only to see it loose color saturation and exhibit tonal degradation? If so, you aren’t alone. Let’s fix that. But first, let’s see why this is happening in the first place.
Color Space Conflicts
Many photographers shoot in Adobe RGB color space because it has a wider color range, meaning colors are more diverse and therefore accurate. The internet prefers sRGB mode, and herein lies the problem. WordPress developers explained it like this:
Any time an image is uploaded, if that image was saved in the Adobe RGB color space, then the image does not get loaded correctly for resizing. Thumbnails are saved in the default color space, which is sRGB. By failing to perform the color conversion, and then failing to specify the non-default color space in EXIF, thumbnails are produced with colors that are noticeably different from the original.
Convert To sRGB Before Uploading
If you convert your images to sRGB mode before uploading into WordPress, you will notice a world of difference. You will also be able to accurately color correct your images in anticipation for how they will look on the web.
Related tutorial: Improve image quality in WordPress
11 thoughts on “Fix Image Color & Saturation Loss in WordPress”
i wonder if facebook also applies this to photos that are upload, they never look the same, thanks for the article!
More than likely @twitter-204906526:disqus
Actually, it seems Facebook reads the embedded color profile, then converts it to its own stripped-down version of sRGB which one of their engineers likes to call “TINYsRGB” (but which shows up in Photoshop as “c2” when I open a photo downloaded from Facebook). Here’s an interesting look at why they decided to create their own color profile: https://www.facebook.com/note.php?note_id=10150630639853920
Thanks man- this worked perfectly.
THANK YOU! This thread saved my life! Literally. Well, not literally, but extremely significantly in a figurative sense. If I could have your babies, I would.
Thank you. You’ve made me **very** happy 😉
Converting to sRGB before uploading is fine if you’re just uploading a photo for online display, but not if you’re uploading a photo intended for sale as a digital download to professional photo buyers (editorial and commercial) and want to sell the highest quality originals using your Sell Media plugin. Ideally, we should be able to upload Adobe 1998 or ProPhoto files, have WordPress leave the originals untouched and have Web previews and thumbnails converted to sRGB when they’re generated.
It’s a complicated issue and a niche that probably only appeals to pro photographers, but I wonder if it might be possible to create an extension for Sell Media that handles color management more appropriately since the WordPress core doesn’t (and likely never will, from the look of things)? Between ImageMagick and Little CMS (http://www.littlecms.com/), it seems like the necessary tools are available if somebody could just figure out how to put all the pieces of the puzzle together.
Until that time, it doesn’t look like Sell Media will be a truly viable alternative to Photoshelter for anybody who shoots in a wider-gamut color space than sRGB, which is a tragedy.
instead of managing the color profiles properly, just ask your users to fuck their pictures 😀 very open-source approach…
Even when I use sRGB exports, the issue is when I bulk upload them, they become crappy. When I upload them individually, the photos stay crispy and saturated as they are meant to be.
Anyone else who faced this issue?
I already have sRGB IEC61966-2.1 set in color settings in photoshop and I still get the loss of color. Workaround right now is to take a print screen of the image in photoshop and then import to photoshop to crop to correct size and then save to jpeg and upload. any idea? Adobe RGB (1998) is not working eaither.