欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  科技

使用photoshop生成网页的方法

程序员文章站 2023-11-19 14:11:16
使用photoshop生成网页的方法...

很多人在设计网页时选择photoshop,而不是dreamweaver,因为ps它的图像处理技术更加强大。在ps中设计好网页后,需要将它生成网页,一般情况下,还需要使用dreamweaver来进行网页的修改。

方法:

1、在这里,我借用百度经验的主页来给大家演一下(嘻嘻)。打开photoshop,打开设计好的图片。

使用photoshop生成网页的方法

2、一般来说,我们需要使用切片工具将它分为几个区域。一方面网页不至于过大而难以加载,另一方面也方便在dreamweaver中按区域来修改。

使用photoshop生成网页的方法

3、将图片、文字等按照自己的设计需求来分割。在这里我就粗略的切一下。切完后也可以及时修改区域的大小。

使用photoshop生成网页的方法

4、我们选择文件,存储为web格式。

使用photoshop生成网页的方法

5、这时会跳出来一个窗口,你可以在其中在此简单修改每个区域的画质等。不需要的话则直接点储存。

6、比如,其中的百度经验图标需要高像素,我们就选择该切片,在右侧的属性中修改。

使用photoshop生成网页的方法

7、不需要画质高的图片,也可以修改,这样可以方便加载出来。

使用photoshop生成网页的方法

8、储存时一定需要注意,要选择“html和图像”。它弹出的警告不需要理会,直接点确定就可以。一般来说,主页是index。

使用photoshop生成网页的方法

9、储存完好,网页便生成了,同时还有包含有其中切片的文件夹。

使用photoshop生成网页的方法

10、这时的网页也只是图片,用dreamweaver打开,修改,可以加上链接、地图等。