偶看新闻信一服饰专柜:5分钟制作出Web2.0风格的网页图标
来源：百度文库 编辑：偶看新闻 时间：2024/04/29 01:30:55
如图1所示，是不是惊讶于Web2.0网站图标之美？下面的方法，能让你在Photoshop中轻松套用这些网站的图标风格，并加上一些创意，快速构建出自己的Web2.0图标出来。
第1步：首先从http://www.hongkiat.com/blog/wp-content/uploads/web20.asl下载一个现有的样式文件。如果你使用的是Photoshop CS2简体中文版，可将下载的样式文件保存到Photoshop安装目录下的“.\Adobe Photoshop CS2\预置\样式\”文件夹中。
第2步：启动Photoshop，点击菜单“窗口→样式”调出样式面板，再单击面板右上角的箭头按钮，从弹出菜单中选择“载入样式”命令，从对话框中选择打开上面下载的web20.asl文件加入新的样式。再单击箭头按钮，从弹出菜单中选择“大列表”项。现在样式面板将如图2所示。
第3步：如图3所示，输入文字“CFan”，画一个圆角的黑色方框作为背景，右下角再添加两个装饰性的小圆点。每个元素都占独立的一个图层。
第4步：从样式面板中，将“mixd-label”样式依次拖放到背景、红色圆点、蓝色圆点图层上，这几个图层就被添加上一层好看的特效。再找到“mixd-font”样式，把它拖到“CFan”文字层上。现在整个图标的效果如图4所示。怎么样，好看吧！
上面是一个混合型风格的实便，接下来乘热打铁再制作一个Skype风格的图标：新建一个图像文件，用文字工具（快捷键为T）输入“CFanBlog”，字体设置为lucida Handwrit，大小为48点；选中这个文字图层，然后单击样式面板上的“skype”样式，文字立即变成如图5所示的效果，非常漂亮。
其他风格的图标，借鉴上面的操作步骤即可完成，这里就不一一介绍了。制作上面两个的图标，我前前后后用了不到5分钟时间，没骗你吧，是不是够快！
（本文编译自：http://www.hongkiat.com/blog/revealing-methods-of-drawing-web-20-logos/）
网络大补贴：更多创建Web2.0图标的教程
制作出好的网站图标，不是简单看一篇教程就能学好的。下面再给大家提供一些网上教程及资源，希望能助你更上一层楼。
不用下载另外的风格文件包，一样也能创建Web2.0风格图标。
网址：http://www.nicora.net/index.cfm?method=article&blogID=C88F54CC-D998-BFC0-D995-3823E52FA483
一个不错的创建Web2.0图标的教程，虽是英文网站，不过它是以视频的方式完成，很容易看懂。
网址：http://www.alleba.com/blog/photoshop-tutorial-how-to-make-a-web-20-style-logo.html
构成Web2.0风格图标的单个元素的制作技巧。
网址：http://www.photoshoplab.com/web20-design-kit.html
web 2.0网页颜色调板
网址：http://swissmiss.typepad.com/weblog/2006/10/web_20_color_pa.html