第二节 裁切网页效果图

说说：这次作业，先把要点总结一下，有不对或者补充的希望老师看看哈。另外，参考了老师给其他同学的点评，有几个不明白的地方，还请老师解答一下。谢谢～

笔记：

• 切片工具可以把一整张图片切成若干小图片，每个小图片可以编辑各自属性；
• 切片工具可以按照功能区域划分：如导航区，banner区，文本区，图案区；
• 切片完成后可以存存储为WEB格式；
• 图片中的白色部分可以不用处理；
• 导航区域可以按一整块切片后使用热点功能，也可以按单个切片；
• 纯色部分切片，可以划出1个像素的宽度即可；
• 切片完成以后，对每个切片进行命名，便于找到图像；
• 进行大范围切片的时候，一定是同一个属性设置的，比如都是广告或者导航；
• 切片都是矩形，所以切片的时候需要找到属性均匀的区域处理，比如形状和颜色没有太大变化的，或者水平和垂直方面变化不大；
• 确保切片中间不留小的缝隙；
  

提问：

• 作业当中的产品部分，老师说不是一整块的，还要细切，那要怎么区分哪些是可以整块切的，哪些是要细切的？
• 作业当中的产品部分，轮胎要单独切出来的话，它没有边框，是要自己估算着切吗？那这样的话就会把放大镜也切进去了。
• 在左侧和中间的导航里，里面的小三角是直接切出来吗？
• 整个图片外面有一层边框，我切的时候也算在内了，不知道这样对不对呢？
• 纯色部分，切1个像素，指的是参考尺上面的1个格子的距离吗？还是把图像放大后，一个小正方形的距离？（我看老师操作的是一个格子，不知道对不对哈。）
• 暂时这些吧，有想到再补充，谢谢老师哈～
  

上图：      

潜意式

1、首先代码加载肯定比图片快，能用代码编写出来的部分，就不用切图。因此根据代码能否写出来，决定切多大范围；
2、轮胎部分是一个产品图，跟它是否有边框没有关系，通常来说，在页面设计的时候，网页设计师会标记处图片的大小尺寸，这样咱们切片的时候可以直接参考尺寸切。放大镜肯定是不能切到一起的。从设计页面来看，放大镜应该是可以点击，然后放大图片的，需要单独切。
3、小箭头的切法，参考这个帖子，回答比较详细了：
http://bbs.qinxue.com/forum.php?mod=viewthread&tid=13729&highlight
4、边框线条不用切，可以直接代码写出来。
5、一个像素的话，在PS里边很容易看出，用矩形选区工具绘制选区时可以看到旁边有尺寸显示。也可以打开信息面板查看。这样就是宽1个像素，高30个像素

念安

潜意式 发表于 2015-11-17 17:41
1、首先代码加载肯定比图片快，能用代码编写出来的部分，就不用切图。因此根据代码能否写出来，决定切多大 ...

谢谢老师的回答～这样子清晰多啦。
有问题再继续请教哈。