Comments on: Optimizing Images For The Web With Photoshop http://www.sitepoint.com/blogs/2009/07/07/optimizing-images-for-the-web-with-photoshop/ News, opinion, and fresh thinking for web developers and designers. The official podcast of sitepoint.com. Sun, 22 Nov 2009 11:54:05 -0500 http://wordpress.org/?v=2.8.4 hourly 1 By: Jennifer Farley http://www.sitepoint.com/blogs/2009/07/07/optimizing-images-for-the-web-with-photoshop/comment-page-1/#comment-928238 Jennifer Farley Tue, 07 Jul 2009 19:23:28 +0000 http://www.sitepoint.com/blogs/?p=12009#comment-928238 Hi Guys<br /> Ralph, that's a good point about setting the matt colour when saving transparency. I'm not too sure what's going on with the sRGB issue. Could it be the case of saving an image as a GIF when it should be a JPEG, as in there is not enough colours causing it to look wierd? <br /> Web2Crawler, I find that PNG-24 is the best option when saving transparancy on an object with a style applied to it. If you've got a drop shadow or a glow for example and you want to keep transparency, PNG-24 does a great job. It tends to give a bigger file size but looks much better than GIF. Hi Guys
Ralph, that’s a good point about setting the matt colour when saving transparency. I’m not too sure what’s going on with the sRGB issue. Could it be the case of saving an image as a GIF when it should be a JPEG, as in there is not enough colours causing it to look wierd?

Web2Crawler, I find that PNG-24 is the best option when saving transparancy on an object with a style applied to it. If you’ve got a drop shadow or a glow for example and you want to keep transparency, PNG-24 does a great job. It tends to give a bigger file size but looks much better than GIF.

]]> By: Ken Trueman http://www.sitepoint.com/blogs/2009/07/07/optimizing-images-for-the-web-with-photoshop/comment-page-1/#comment-928233 Ken Trueman Tue, 07 Jul 2009 18:24:55 +0000 http://www.sitepoint.com/blogs/?p=12009#comment-928233 Great advice, I didn't know about the 4up comparison. Thank you. <a href="http://www.kentrueman.com" rel="nofollow"></a> Great advice, I didn’t know about the 4up comparison.
Thank you.

]]> By: TomBradshaw http://www.sitepoint.com/blogs/2009/07/07/optimizing-images-for-the-web-with-photoshop/comment-page-1/#comment-928210 TomBradshaw Tue, 07 Jul 2009 12:21:25 +0000 http://www.sitepoint.com/blogs/?p=12009#comment-928210 I too have never used the 4-up option - looks very useful. I like to use transparent PNGs in some of my designs. Just remember to use the PNG fix code to make it work in IE. I too have never used the 4-up option – looks very useful. I like to use transparent PNGs in some of my designs. Just remember to use the PNG fix code to make it work in IE.

]]> By: web2crawler http://www.sitepoint.com/blogs/2009/07/07/optimizing-images-for-the-web-with-photoshop/comment-page-1/#comment-928209 web2crawler Tue, 07 Jul 2009 12:09:26 +0000 http://www.sitepoint.com/blogs/?p=12009#comment-928209 Thanks for nice article. What about JPEG like special PNG optimization? Thanks for nice article. What about JPEG like special PNG optimization?

]]> By: ralph.m http://www.sitepoint.com/blogs/2009/07/07/optimizing-images-for-the-web-with-photoshop/comment-page-1/#comment-928199 ralph.m Tue, 07 Jul 2009 07:30:35 +0000 http://www.sitepoint.com/blogs/?p=12009#comment-928199 @ Catmull Problem is, they DO "look right beforehand". It's only after converting to sRGB that they look wrong. Guess I'll have to look more into this. sRGB does seem to be important. (Sorry to Jennifer if this is too off topic!) @ Catmull Problem is, they DO “look right beforehand”. It’s only after converting to sRGB that they look wrong. Guess I’ll have to look more into this. sRGB does seem to be important. (Sorry to Jennifer if this is too off topic!)

]]> By: Catmull http://www.sitepoint.com/blogs/2009/07/07/optimizing-images-for-the-web-with-photoshop/comment-page-1/#comment-928193 Catmull Tue, 07 Jul 2009 03:48:29 +0000 http://www.sitepoint.com/blogs/?p=12009#comment-928193 Please DO NOT take the advice given about color profiles on that site you linked to. They couldn't be more wrong. Under Photoshop CS4 you should always use the 'Convert to SRGB' checkbox and if the colors look weird when you turn it on, go back and fix your image using soft proofing before using 'Save for Web' so they look right beforehand! Please DO NOT take the advice given about color profiles on that site you linked to. They couldn’t be more wrong. Under Photoshop CS4 you should always use the ‘Convert to SRGB’ checkbox and if the colors look weird when you turn it on, go back and fix your image using soft proofing before using ‘Save for Web’ so they look right beforehand!

]]> By: ralph.m http://www.sitepoint.com/blogs/2009/07/07/optimizing-images-for-the-web-with-photoshop/comment-page-1/#comment-928189 ralph.m Tue, 07 Jul 2009 02:01:07 +0000 http://www.sitepoint.com/blogs/?p=12009#comment-928189 Ah, hadn't used the 4-up thing before, but very handy. When saving for web, it's also good to set a color in the matte box if the page's background color is anything other than white, to avoid a faint white edge around the image. Other thing worth mentioning is that image color can go off when saving for the web (my images often look washed out or less vibrant). I found this <a href="http://www.viget.com/inspire/the-mysterious-save-for-web-color-shift/" rel="nofollow">wonderful little article</a> that shows how to prevent this, which has been a lifesaver. Ah, hadn’t used the 4-up thing before, but very handy.

When saving for web, it’s also good to set a color in the matte box if the page’s background color is anything other than white, to avoid a faint white edge around the image.

Other thing worth mentioning is that image color can go off when saving for the web (my images often look washed out or less vibrant). I found this wonderful little article that shows how to prevent this, which has been a lifesaver.

]]>