Skip to main content
Inspiring
May 3, 2018
Answered

What is the best way to preview and save images for the web?

  • May 3, 2018
  • 2 replies
  • 4721 views

I realize this is a very basic question, but what is the best way to preview and save images that are destined for use on a website? I'm a bit bewildered as to why "Save for Web" seems to be so disfavored in CC 2018 (buried away and labeled as "legacy" and also as to why the Device Preview has been removed. As you can tell, it has been a few years since I've done work of this sort - is there some new set of features that are meant to be better than these old ones?

Also, is View>Internet Standard (sRGB) + Proof Colors the right way to preview the colors of images destined for the web?

    This topic has been closed for replies.
    Correct answer D Fosse

    Thank you for your help! Now that I've set that up, I assume it is "sticky" and it will remain my preview setting that will be used whenever I turn preview "on" using command Y. Have I got that right?


    That's right. This setting sticks until next time you change it.

    But again, just so it's noted - you will see exactly the same thing by just opening Save For Web. With the checkbox on, it shows you the sRGB version after it's been converted.

    2 replies

    D Fosse
    Community Expert
    Community Expert
    May 3, 2018

    Turn off proof! Proof is for print. Just make sure color management is enabled in SFW as per above.

    Inspiring
    May 3, 2018

    So, the only way to get an accurate preview of the colors is through the multi-step process of File>Export>Save For Web>Preview?

    Inspiring
    May 3, 2018

    If your display is wide gamut and you have a file in Adobe RGB or bigger, and you want to see it as sRGB, prior to any profile conversions - then yes, you can proof to sRGB in Photoshop. Not Internet Standard or anything like that - just sRGB, because that's your target space in Save For Web.

    But then on the other hand this is exactly the preview you get in SFW already, before you actually save out anything.


    I don't understand. These are the options that are available (CC on a Mac):

    D Fosse
    Community Expert
    Community Expert
    May 3, 2018

    Convert to sRGB, and embed the sRGB profile for added accuracy in color managed web browsers. That's it for the file.

    Previewing in Save For Web is made a bit tricky, because someone apparently insisted that no color management is possible on the web, and even if it was, it wouldn't be desirable (insert sarcasm icon here). As a result all color management in SFW is off by default, and it doesn't match Photoshop.

    The first thing to do is check the two boxes for sRGB and embed. But you're not done. The Preview rolldown is by default set to "Monitor Color", i.e. no color management. You need to change this to "Use Document Profile". The other two alternatives can safely be ignored. They are hybrid settings that tell you absolutely nothing useful.

    Proofing as such makes no sense. If you have a standard (not wide) gamut monitor, everything you see on screen is already soft proofed to sRGB. Proof in Photoshop is used for print, to check for out of gamut colors in a print profile.

    Save For Web (which is based on very old code) will eventually be replaced by the new Export As function. It should handle big files better, and has a somewhat simplified and modernized UI. But still they haven't caught on that web browsers today can handle color management.

    Inspiring
    May 3, 2018

    My screen is a Mac Retina 4K. From the Photoshop toolbar, I use View>Proof Steup>Internet Standard RGB (sRGB).

    I assume this correct!

    Do I need to then go through the steps of File>Export>Save For Web>Preview in order to get an accurate preview of the colors?