Problem with files when saving for web. Why?

[rivi1969]

Advertisement (gone after registration)

Hello,

 

I am looking for some technical assistance here. I have a problem with some of my color files. (specially those with lots of green like some I took on the park)

 

When saving them for web, they look dull, flat and desaturated, no matter how much I increase the saturation in the PSD file they still look the same. Any ideas of how to make them look just as they are? I am going crazy because I have this problem with some files not all so I am a little lost here. I assign their profile to Srgb but anything happens...

 

Any help will be very appreciate!

Ricardo

[gwelland]

The most important thing to do when saving files for the web is to ensure that you're CONVERTING them to sRGB colour space in Photoshop prior to saving. That's about the only way that you'll get anything close to matching your original files on PC browsers and non-colour managed browsers on the Mac.

 

If you are working in PS with AdobeRGB or ProPhotoRGB and then assign, not convert, the image to sRGB you will end up with the type of problem you are describing.

[andybarton]

Don't forget also that PCs render colours differently from Macs and it what looks great on your screen, may not look so good on the alternative platform, regardless of which OS you prefer.

 

AFAIK, Safari is the only colour managed browser out there, and this can make a huge difference in the way that images are perceived.

[ericperlberg]

Don't forget also that PCs render colours differently from Macs and it what looks great on your screen, may not look so good on the alternative platform, regardless of which OS you prefer.

 

Andy, could you explain more? This isn't my experience... maybe I'm missing your point.

[rivi1969]

Thanks for your replies, fortunately I just realized exactly what to do. I didn't mention it but I am using a Mac Powerbook laptop so maybe is different from a PC. What I have to do to save it exactly as it is in PS, is assigning the COLOR LCD CALIBRATED profile, when doing this the file keeps all its color information and no matter if I use Safari or Firefox, seems to be the same.

 

I am posting an example here, pic 001 is saved as srgb, pic 002 is saved with the color lcd profile.

 

Thanks again!

Ricardo

[wattsy]

If you are using the 'Save for Web' feature of PS, click the little triangle slightly up and to the left of the 'Save' button and make sure that 'Use document colour profile' is selected. Your sRGB profiled images will output with the saturation that you expect. I wouldn't advise converting your images to the 'Colour LCD' profile as this is designed as a monitor profile rather than a working space.

[ericperlberg]

Advertisement (gone after registration)

If you are using the 'Save for Web' feature of PS, click the little triangle slightly up and to the left of the 'Save' button and make sure that 'Use document colour profile' is selected. Your sRGB profiled images will output with the saturation that you expect. I wouldn't advise converting your images to the 'Colour LCD' profile as this is designed as a monitor profile rather than a working space.

 

Further to what Wattsy said, the colour LCD profile is only your monitor profile but its not my monitor profile or most people's monitor profile. So you're only guaranteeing that the file looks as you intended on your monitor. On my monitor, a high end Eizo which I use in my professional colour management consulting work, your images look almost identical if not identical.

 

Unless you're using CS3 you should convert your working image (presumably in aRGB or ProPhoto RGB) to sRGB. It's important to use Convert and not Assign as Graham said . Most monitors today have a colour gamut near the sRGB gamut but each monitor is somewhat different. The best you can do on the web at the moment is to convert your image to sRGB (after saving the original copy). All browsers, whether on a PC, Mac or Linux OS will just pass the colour information in the file to the monitor. They (web browsers) aren't profile aware (except Safari on either a Mac or PC, but even though Safari is colour profile aware, not many people use it). So unfortunately, converting to sRGB is as close as you can get at the moment. By converting, the numbers describing the colour in the file are changed from the orignial to sRGB (assigning doesn't change the numbers and since the web browsers are blind to the profile, you're really not doing anything useful except making your file larger). The browser then passes the colour info to your monitor which, since it is more or less in the sRGB colour space, more or less displays your file accurately (well at least it doesn't totally loose saturation).

 

In CS3 I believe that just using Save For Web now automatically converts your file to sRGB.

[stunsworth]

If you are using the 'Save for Web' feature of PS, click the little triangle slightly up and to the left of the 'Save' button and make sure that 'Use document colour profile' is selected

 

I found that out for myself recently when images I was saving on my MacBook looked terrible even though I'd converted to sRGB <grin>

[mmk60]

Hi -

 

I am new here and enjoying each thread. Thanks for sharing your experience and knowledge.

 

I have been selecting "use document colour profile" but I am still having the issue. Photos tend to look "flat"...

 

I have one more question in this thread. When you resize photos, what resolution (ppi) do you use for web posting?

 

Thanks

 

PS: Sample photo attached here. M8 w/ 35mm cron in Gettysburg, PA

 

Welcome, dear visitor! As registered member you'd see an image here…

Simply register for free here – We are always happy to welcome new members!

[andybarton]

You need to post images at 72 ppi for correct display on computer monitors. Like this:-

 

[ATTACH]44602[/ATTACH]

[ericperlberg]

You need to post images at 72 ppi for correct display on computer monitors. Like this:-

 

[ATTACH]44602[/ATTACH]

 

Sorry to be difficult Andy but this isn't correct. The image maker can't control the ppi density of how an image is displayed on the web, nor is there an optimal setting, nor is there any photoshop control over the ppi., the 72 in your screen grab relates only to printed files. An image displays on the web as a function of the pixel density of the viewers' monitor. And most monitors these days have pixel densities far above 72 ppi.

 

The only thing which you, the image maker, can control on the web is the pixel dimensions of an image (well only one of those dimensions is under your control if you want to keep the aspect ratio the same, the other dimension will scale accordingly if you have the "constrain proportions" tick box ticked.)

 

So you only need to set either the width or height in the top numbers in the screen grab assuming that constrain proportions is ticked.

[mmk60]

Thank you folks. I have tried everything mentioned here and got some better results.

 

Thanks again!