绿茶软件园
资讯首页 > 软件教程 > 美图制作 > 怎样用Photoshop切片工具分割图片

怎样用Photoshop切片工具分割图片

作者:佚名 来源:绿茶软件园 2012-03-28 09:02:34

教你用Photoshop切片工具分割图片,相信不少网友在浏览网页的时候,都会遇到网速不够、想要看的图片迟迟不能读出的情况。而且网页设计员在放高分辨率的清晰图片时,也会顾虑浏览器下载图片的漫长等待消磨网友的耐心。这次的PS教程将为大家带来有效的解决办法——利用Photoshop切片工具将图片分割。

  这样的好处在于,从网页中显示的图片是由几个小图构成,当浏览网速不畅的时候,网友将会先看到一些小图,从而避免因为图片庞大,而匆匆将网页关掉。这个方法对于想要改善网店浏览体验的,增加顾客量的店长来说可是不得不学。下面马上开始这次PS教程!  

  1.打开要分割的图片,点击工具栏的切片工具。

PS基础教程:Photoshop简单介绍切片工具
图01

  2.在要切片的图片上切一个框,如图所示。

PS基础教程:Photoshop简单介绍切片工具
图02

  3.点击鼠标右键,选择划分切片。

PS基础教程:Photoshop简单介绍切片工具
图03

  4.设置如图,水平划分为4,垂直划分为3。

PS基础教程:Photoshop简单介绍切片工具
图04

  5.效果如图所示。

PS基础教程:Photoshop简单介绍切片工具
图05

  6.将图片划分好后,我们点击工具栏下面的ImageReady键计入IR状态下编辑图片。

PS基础教程:Photoshop简单介绍切片工具
图06

  7.点击文件,将优化结果存储为HTML格式。

PS基础教程:Photoshop简单介绍切片工具
图07

  8.命名为秘密花园,如图所示。

PS基础教程:Photoshop简单介绍切片工具
图08

  9.存在电脑桌面或其他文件夹,会出现一个HTML格式的网页,我们打开另一个文件名为Image的文件包,里面就是我们刚才分割好的小图片。

PS基础教程:Photoshop简单介绍切片工具
图09

  10.如图所示,就是我们刚才分割好的12张Gif格式图片。

PS基础教程:Photoshop简单介绍切片工具
图10

  11.我们打开这些小图片时会返现默认为索引颜色。这时选择图像>模式>RGB颜色,就可以对这些小图片进行处理了。

PS基础教程:Photoshop简单介绍切片工具
图11

  12.我们在做网页的时候,使用分割好的小图片有利于网页的浏览速度。

PS基础教程:Photoshop简单介绍切片工具
图12

返回顶部