Export for Web: sRGB or P3?

Viewing 12 posts - 1 through 12 (of 16 total)
  • Author
    Topic: Export for Web: sRGB or P3? Read 23649 Times
  • John Sadowsky
    John Sadowsky
    Participant
    Posts: 169
    Computers & Displays
    on: January 25, 2020 at 10:06 am

    Since introduced by Apple in 2015, most new computers and mobile devices have a wide P3 color gamut.  Shouldn’t we create JPEGs for the web using P3 now?  I used P3 JPEGs for my web page, and the images look great on my P3 Apple devices!

    The issue is whether or not the viewing browser is color-managed.  If managed, the browser will do the transformation from P3 (or whatever the color space is embedded in the JPEG) to monitor the screen color.  The problem comes when the browser is not managed, in which case it just assumes the image is sRGB.  That will distort the colors of a P3 image.  10 or 15 years ago most browsers did not observe color management.  What is the current situation?  Do we need to be concerned about browsers that will trash the colors of P3 files?

     

    JSS

    Mike Nelson Pedde
    Mike Nelson Pedde
    Participant
    Posts: 641
    Re: Export for Web: sRGB or P3?
    Reply #1 on: January 29, 2020 at 3:19 pm

    Good question, John. Given that I can download an app and use my x-rite device to calibrate my phone screen, on one hand we’ve come a long way. On the other hand, even among the members of the photo club to which I belong, I’d say maybe a handful of them bother to profile their monitors or even have the hardware to do so. If one doesn’t begin there, whether or not one uses a colour-managed browser becomes, to some extent, moot. On Windows I use Firefox, and it is possible to set it up to be colour-managed, it’s not engaged by default. One first has to know it’s possible and then take the steps to engage it. To that end, and given that most of the people in the world have no idea what you’re even talking about, I’d say that colour management is a very weak link in a very long chain. Unless you’re sending specific images to specific people, I’d suggest staying with sRGB.

    My 2¢.

    Mike.

    _____
    Mike Nelson Pedde
    Victoria, BC
    https://www.wolfnowl.com/

    John Sadowsky
    John Sadowsky
    Participant
    Posts: 169
    Re: Export for Web: sRGB or P3?
    Reply #2 on: February 5, 2020 at 12:21 am

    Mike, I’m not sure I agree – rendering as if sRGB when it was really Adobe or P3, I think would be noticeable.  I don’t believe that calibration error is as large as differences in these color-spaces.  (I think that calibration may be overrated with modern monitors – I’ve never noticed much before/after difference on my 2017 iMac retina, or on my previous 2009 iMac.)

    Anyway, this is a testable hypothesis!  I have my own code that allows me to construct TIFF files – so I can stuff in any ICC profile.  I can take an image in P3 or Adobe, and spoof the viewer by inserting an sRGB profile.  Then we can do a side-by-side to see the difference.  Give me a week or so.

    JSS

    John Sadowsky
    John Sadowsky
    Participant
    Posts: 169
    Re: Export for Web: sRGB or P3?
    Reply #3 on: February 5, 2020 at 2:35 pm

    Mike:  Here are some results of a P3 vs. sRGB comparison.  I have to admit – it is hard to see a difference.  Looks like you were right.

    These files show stops gradients with a 6 stop range for sRGB and Display P3.  The RGB values at full scale are the same for both sRGB and P3: red = (255,0,0), …  Each gradient was generated as a 16 bit TIFF.  Both the sRGB and P3 versions contain the same RGB data – the only difference is the ICC profile embedded in the TIFF file.  I then imported into Affinity where I combined the sRGB and P3 versions as layers.  The Affinity working color space is ProPhoto (which encompasses both sRGB and P3).  I then exported the combined images to the png files below using the Display P3 color space, with the embedded ICC profile.  I checked the results with the Mac “Digital Color Meter,” which read out the RGB values as you mouse over the screen.  The P3 values were pure primaries, while the sRGB values did deviate from pure primary RGB, but only a very small amount.

    One thing about this comparison is that both sRGB and Display P3 have the same white point and TRC (tone reproduction curve).  Display-P3 is a variant of P3 created by Apple that has the original P3 primary colors with D65 white pt, and the sRGB TRC.  (The original P3 white point is a bit greener than D65.)  If the two color spaces had different white points, then I think we would see the color shift.  D65 is the most common white point for display purposes (not for print).  (ProPhoto has a D50 white point, so it must be color managed for display.)  It appears that Apple created Display-P3 specifically so that it could be rendered as sRGB with little difference in appearance.

    Why did they bother going to P3 displays?  P3 has a nearly monochromatic red, which must be more difficult for manufacturing.  If we can’t see the difference – why bother?

    Then there is always the possibility that I screwed up the comparison.

    JSS

    John Sadowsky
    John Sadowsky
    Participant
    Posts: 169
    Re: Export for Web: sRGB or P3?
    Reply #4 on: February 6, 2020 at 10:42 am

    Well, I did screw up the comparison.  Somehow, when I stacked the two gradients in Affinity it converted the colors … probably user error.  There is a difference, but Mike is still mostly right.  🙂

    This site won’t let me upload TIFF files – so I converted them directly to PNGs with Display P3 profiles attached below.  This time the sRGB colors were correctly transformed into P3 coordinates correctly.

    On Mac, I open them in Preview (the Mac viewer) simultaneously and switch between the P3 and sRGB images.  If you have a P3 monitor, you can see a difference.  I only did red and green as blue is the same for both color spaces.    For red, the mac Digital Color Meter shows (r,g,b) = (255,0,0) for P3 and = (230,50,35) for sRGB in P3 coordinates, for both the original TIFF and the PNG.  For green, it shows (r,g,b) = (0,255,0) for P3 and  = (116,250,75) for sRGB in P3 coordinates for green.

    I’m holding to what I said about white points.  A shift in white point would be noticeable, but these two spaces have the same white point (for Display P3).

    JSS

    Wayne Fox
    Wayne Fox
    Silver Member
    Posts: 11
    Re: Export for Web: sRGB or P3?
    Reply #5 on: March 4, 2020 at 2:17 pm

    Since introduced by Apple in 2015, most new computers and mobile devices have a wide P3 color gamut. Shouldn’t we create JPEGs for the web using P3 now? I used P3 JPEGs for my web page, and the images look great on my P3 Apple devices!

    Interesting thoughts.  However, my sRGB jpegs also look great on my iPhone and iPad.  I think we’re in still in the world of the lowest common denominator, and that remains sRGB … which is what most using a computer display are seeing.  At some point I do believe P3 will become prevalent in all devices, and fortunately sRGB images will still look great. But I think I’ll stick with sRGB now.

    Andrew Rodney
    Andrew Rodney
    Participant
    Posts: 294
    Re: Export for Web: sRGB or P3?
    Reply #6 on: April 23, 2020 at 12:52 pm

    IF your viewers are using a color managed browser, you can post ANY RGB color space (embedded profile or EXIF describing that) and the browser, like Photoshop and the slew of other color managed applications will preview it ‘correctly‘. But people are viewing this outside of color management, then DCI-P3 will look butt ugly on an sRGB gamut display. Because of a lack of color management.

    The opposite would be true viewing sRGB on a wider gamut (DCI-P3) display without color management. Now sRGB will appear very ugly.

    Don’t view images without color management! Good luck with the masses of people without color managed browsers. So the general ‘rule‘ is to post in sRGB because on sRGB gamut displays, without color management, the images should look “OK“. But the web doesn’t know if an image is in sRGB or any other color space. The browser may or may not. If it knows the scale of the RGB values, if it uses color management and the display profile, the image will be color managed. If not, the RGB numbers are sent directly to the display and all gets are off.

    All outlined here:

     

    sRGB urban legend & myths Part 2

    In this 17 minute video, I’ll discuss some more sRGB misinformation and cover:

    When to use sRGB and what to expect on the web and mobile devices

    How sRGB doesn’t insure a visual match without color management, how to check 

    The downsides of an all sRGB workflow 

    sRGB’s color gamut vs. “professional” output devices

    The future of sRGB and wide gamut display technology 

    Photo print labs that demand sRGB for output

    High resolution: http://digitaldog.net/files/sRGBMythsPart2.mp4

    Low resolution on YouTube: https://www.youtube.com/watch?v=WyvVUL1gWVs

     

    Author “Color Management for Photographers" & "Photoshop CC Color Management" (pluralsight.com)

    John Sadowsky
    John Sadowsky
    Participant
    Posts: 169
    Re: Export for Web: sRGB or P3?
    Reply #7 on: April 23, 2020 at 1:18 pm

    But people are viewing this outside of color management, then DCI-P3 will look butt ugly on an sRGB gamut display. Because of a lack of color management.

    I’m not so sure about that.  Display-P3 has the same D65 white-point as sRGB.  Yes, an image in Display-P3 viewed without CM (as if it were sRGB) that will desaturate the reds and greens (blue is the same as sRGB), but the whites will be correct so there won’t be an apparent color cast.  I think that was Apple’s intent when they defined Display-P3 (as opposed to DCI-P3).

    What devices/apps/browsers don’t have CM anymore?  My internet searching on “browsers with/without CM” yield articles at least 5 years old, or simply not dated.  (All internet articles should be dated!  It should be the LAW!)  Firefox was apparently the first to employ CM, and before 2015 most browsers did not have CM.  It was a big problem then, but what’s the situation today?  P3 monitors are pretty ubiquitous today.  You’d think most browsers are up to speed by now.  I do some iOS programming, and I can tell you all the iOS framework libraries have CM (as you’d expect since Apple was an early adopter of P3).  One would assume the same for Android apps.  Even if displayed on older devices with sRGB displays, the software & OS updates should have everything up to speed with CM.

    JSS

    • This reply was modified 2 years, 5 months ago by John Sadowsky.
    Mike Nelson Pedde
    Mike Nelson Pedde
    Participant
    Posts: 641
    Re: Export for Web: sRGB or P3?
    Reply #8 on: April 24, 2020 at 5:17 pm

    What devices/apps/browsers don’t have CM anymore?

    Just had to reset/rebuild my computer. Windows 10, Firefox 75.0 – color management is not enabled by default.

    Mike.

    _____
    Mike Nelson Pedde
    Victoria, BC
    https://www.wolfnowl.com/

    John Sadowsky
    John Sadowsky
    Participant
    Posts: 169
    Re: Export for Web: sRGB or P3?
    Reply #9 on: April 24, 2020 at 5:49 pm

    Mike – I found that surprising.  I did some quick research.  I assume you are using setting under about:config.

    gfx.color_management.enablev4 is false by default.  That only enables ICC version 4 profiles.  I check profiles I extracted from TIFFs created by C1, and they were v4.  JPEG is a tougher egg to crack, but I assume C1 is creating v4 JPEGs as well.  I find that odd.  All my images on my web page, my Facebook page, and (at least recent) images uploaded to PhotoPxl are Display-P3.  They look fine.  Moreover, changing the enablev4 to true didn’t change the appearance in Firefox.

    gfx.color_management.mode is the other setting that may be relevant.  Mode = 1 “enables CM for all rendered graphics”, whereas, “the default value of 2 enables CM only for tagged images …”  I set the mode = 1.

    Here is my source:  https://cameratico.com/guides/firefox-color-management/

    JSS

    • This reply was modified 2 years, 5 months ago by John Sadowsky.
    Mike Nelson Pedde
    Mike Nelson Pedde
    Participant
    Posts: 641
    Re: Export for Web: sRGB or P3?
    Reply #10 on: April 25, 2020 at 6:04 pm

    That’s what I’ve done as well. It’s just that you have to do it manually (which of course suggests that you know to do it, otherwise it doesn’t matter… ?)

    _____
    Mike Nelson Pedde
    Victoria, BC
    https://www.wolfnowl.com/

    John Sadowsky
    John Sadowsky
    Participant
    Posts: 169
    Re: Export for Web: sRGB or P3?
    Reply #11 on: April 25, 2020 at 10:54 pm

    Mike – I can’t say for sure, but I don’t think this is a browser issue.  I could be wrong, but I do have some experience with iOS/Mac programming

    I think color management (CM) is an operating system (OS) issue, not a browser issue.  It may have been a browser issue years ago, but not as of 2020 when P3 displays are ubiquitous.  Any app (including web browsers) hands an image to the OS, or an OS supported “framework”,  for rendering on a particular piece of display real estate.  So, the OS does the CM, not the app.  Apps don’t do pixel stuffing – that’s done by the OS frameworks.  If that’s true, then the Firefox settings are mute, which, by the way, is not unusual.   All browsers, or apps in general, just hand the JPEG file to the OS, and the OS renders it on the display.  So CM is an OS issue – not a browser issue.

    Anyway, that would explain why my Display-P3 images didn’t change when I changed the Firefox settings.  My guess is that, for current versions, those settings don’t do anything.

    JSS

Viewing 12 posts - 1 through 12 (of 16 total)
  • You must be logged in to reply to this topic.