快速业务通道

用Photoshop颜色配置文件设计web图像

作者 佚名技术 来源 平面设计 浏览 发布时间 2012-06-11
I’ve noticed lately that some web designers don’t seem to be using color profiles correctly in Photoshop. If you’ve ever saved images for the web and discovered that they come out slightly lighter and more desaturated than what you saw when you worked on them, this guide is for you.

There are some blog posts that advocate disabling color profiles in web images to “fix” this problem. This isn’t the right way to go about it because modern browsers like Firefox 3 and Safari do use color profiles, so you can get much better results by using them correctly. What’s more, color profiles are dead simple to use. Here’s how…

NOTE: The following instructions are for Photoshop CS3 running on OS X, but it will be the same for Windows and similar for older versions of Photoshop.

First, we need to know what profile to use for your web images — that’s the sRGB IEC61966-2.1 profile. It is standard across many PC monitors and so is recommended for use on the web. To set your working space to this profile, open up the “Edit” menu, and click on “Color Settings…”

color settings

You’ll be presented with the following options:

working space settings

Look at the “Working Spaces” section and select the sRGB IEC61966-2.1 profile from the RGB drop-down. The other settings aren’t relevant here since we’ll only be working with RGB for web images.

Now you’ve got the working space set up correctly, but we’re not done. What you see now isn’t what you’ll see when you save the image for the web because what you see isn’t affected by your monitor settings — to see the “real” colors we need to use color proofing.

Click on the “View” menu and then on “Proof Setup”. You should see another selection. We want to see the image as it will appear on our monitor, so select “Monitor RGB” at the bottom.

monitor rgb

Finally, we need to activate color proofing as it is off by default. Click on the “View” menu again, and click on “Proof Colors” if there is no check already next to it.

proof colors

Once you click on it, it will be checked indicating that the colors are now being proofed using your monitor settings. That’s it, what you see now on your screen will be pretty much what you’ll get when you save the image.

People will still see the colors slightly differently across many devices and operating systems (for example, default OS X gamma differs to the standard Windows PC gamma, so images are a little brighter — if you are working on a Mac it is advised to set your gamma level to 2.2) but the output will still be consistent with your working space and will be ready for modern browsers that do use embedded color profiles.

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站:http://www.lingzhong.cn 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢!

分享到: 更多

Copyright ©1999-2011 厦门凌众科技有限公司 厦门优通互联科技开发有限公司 All rights reserved

地址(ADD):厦门软件园二期望海路63号701E(东南融通旁) 邮编(ZIP):361008

电话:0592-5908028 传真:0592-5908039 咨询信箱:web@lingzhong.cn 咨询OICQ:173723134

《中华人民共和国增值电信业务经营许可证》闽B2-20100024  ICP备案:闽ICP备05037997号