Entry tags:

! tutorials

Colour Settings

Colour Settings and Why Icon Makers Should Care

Sam (kavalier) and I have completed some exhaustive Mac vs PC, Photoshop Elements vs Photoshop CS4 vs PaintshopPro research and have discovered something about colour profiles. The following information is super important for PC icon makers to keep in mind, since you won't be able to see when something comes out with a messed up colour profile, but those on macs will be able to see it.

**NOTE** MacBook OS X Leopard is what Sam is using. According to splott, her MacBook Pro with Snow Leopard doesn't show a difference.

As far as we can tell, none of these problems come into play using Paintshop Pro!

Problem 1: JPEGs look different on macs and PCs if there are embedded colour profiles    If you have a PC, firefox makes these two look the same [this is what it looks like on a mac, PCers], but if you have a mac, the left should look more saturated. The left icon has a preserved colour profile whereas the right does not. The right icon is how the icon is supposed to look. Solution: Do not embed colour profiles (DESELECT ICC profile) If you Save for Web (Photoshop or Elements): If you Save As (Photoshop or Elements): Problem 2: Icons made by a mac look really red on a PC and icons made on a PC look really yellow on a mac Solution (from kavalier): The default Mac color settings on monitors is different than the typical graphics default. To change your monitor settings to match those on most PCs and the internet graphics profile: Apple --> System Preferences --> Displays --> Color --> Calibrate --> Continue until you get to 'Select a Target Gamma' --> 2.2 Television Gamma --> Continue on and save Problem 3: When I go to Save For Web, my icons come out desaturated! Solution: The problem occurs usually on a mac, but sometimes on a PC if your colour settings are not matched up to what the necessary web-colour profile is. Sometimes you can get around this if you're using PNG-24s, but not always. In Photoshop Elements Edit --> Color Settings In Photoshop CS4 Edit --> Color settings Problem 4: PNGs look hypersaturated on Macs but not on PCs. This is an effect of Photoshop Elements, from what we've been able to tell, and results from using Save As to save your PNGs. Make sure your color settings are set as "no management" and use Use Save for Web instead of Save As and the problem is solved. Original (colours preserved using Save For Web): When using Save As: (Both will look the same on a PC [this is what it looks like on a mac, PCers], and Sam wants it to be known that she did the first intentionally less saturated to show the difference) Not a problem but -- JPGs vs PNGs It's my (Em's) personal opinion that JPGs are better than PNGs for banner making. A lot of the time PNGs are used to retain "true colour" but at a huge cost to file size. Banners that could be 1-200kb come out at 600+kb which can be a pain in the ass in terms of layouts and userinfos. If your colour profiles are correct, then saving a JPG at 90% quality will have a drastic impact on picture size without forfeiting any of the colour quality. My 2 cents!