网页图片设计技巧：制作清晰可见像素图片

详细操作

绘制边缘清晰的「 形状图层 」

我们通常在PS里绘制矩形时会用 「矩形工具」，这样产生的是矢量的形状图层，它的好处是我们无论放大缩小时都保持矢量属性，但当我们放大视图看时还是有虚边（上图），这些虚边虽然在绘制大的图形时影响不太大，但当我们绘制很小的像素级图标时，就会很明显了。

解决方法是选中下图列出的 「对齐像素」选项，当我们再绘制同样的矩形时，放大视图看边缘就清晰可辨了（下图）。其中的原理是：我们屏幕显示的图像是由无数个像素组成的，也就是说像素是图形的最小单位，通常当我们绘制的图形不是整数像素时，比如宽是20.5像素，那0.5的像素小于1像素，PS就会以虚边显示。当选中[对齐像素]选项时，我们绘制的宽、高将都是整数了。

旋转图形时保持边缘清晰

当我们以矩形的中心点90度旋转时，得到的矩形缺失了两个边。这是什么原因呢？得知这个矩形的长是奇数、宽是偶数。当以中心点旋转时像素不能整分，所以得到这种结果。解决办法是，可以选矩形的四个角的任一顶点为中心点旋转，或者使矩形的长宽都为奇数或偶数值。如果我们的操作是旋转并缩放图形，最好是旋转完按确定，再进行缩放。不要连续操作完再确定，这样得到的结果会比较清晰。

AI粘入PS时保持边缘清晰

当我们以矩形的中心点90度旋转时，得到的矩形缺失了两个边。这是什么原因呢？得知这个矩形的长是奇数、宽是偶数。当以中心点旋转时像素不能整分，所以得到这种结果。解决办法是，可以选矩形的四个角的任一顶点为中心点旋转，或者使矩形的长宽都为奇数或偶数值。如果我们的操作是旋转并缩放图形，最好是旋转完按确定，再进行缩放。不要连续操作完再确定，这样得到的结果会比较清晰。

有时当我们在AI里绘制了图标后，粘到PS里就会出现如下图的虚边，这是有两种原因造成的，一是在AI里新建文件时没有选中[对齐像素网格]选项（只有AI CS5以上版本有这个选项），这样绘制的图标的各个数值不为整数的情况，粘到PS里就会出现虚边。再一个是选中了 「对齐像素网格」选项粘到PS中依然出现虚边，这是要在粘之前在PS中建一个与图标大小相同的选区，再粘进来就OK了，因为PS中粘贴板中的图标粘入到视图时，图标是以被粘入视图的中心点定位粘贴的，这样粘贴的位置可能不是整数值，所以会出现虚边，这时我们要建一个同样大小的选区，再粘就没问题了。还有粘贴时选 「形状图层 」，这样以后的可编辑性会比较强。

用户类似问题：

问题1：请问制做网页图片的分辨率一般设为多少

网页图片的分辨率一般设为72px/inch。 图片分辨率设置的越高，图片文件越大，显示速度就会越慢。如果是出图打印则不同，一般都设置为300px/inch。 >>详细

问题2：用photoshop设计网页首页时，设置多少精度出来的网...

Photoshop制作网页效果图的几个注意点： 第一点：新建文件尺寸大小； 制作网页效果图，首先就是要新建文件，那么要建多大的合适呢？这可不是随便乱定的，一般我们是要根据目前绝大部分显示器的最佳分辨率来定。在比较早些时候，17英寸为主流显示... >>详细

问题3：网页设计---分辨率是多少？

这个宽高没错，把分辨率调为72。一般平面像名片、VI、包装盒这些分辨率是300，喷绘有150或者200的。网页分辨率大多都是72。 >>详细

问题4：PS制作小像素图片时如何让字体变得清晰

1、使用宋体字体。 2、将设置消除锯齿的方法那儿设置为：无。 这样设置后，即使字体缩小到12点仍然相当清晰，其他字体缩放到这么大小会不同程度模糊。 >>详细

问题5：网页设计的时候针对图片有什么要求？

网页设计与一般的平面设计对图片的要求不同，网页中图片不需要很高的分辨率，因此在制作网页图片时有很大的自由空间。但在网页中使用图片时，上海志勋网络提醒您，有以下几点应该注意。 1、图片文件的大小是我们上海志勋网络网页设计人员必须考... >>详细