Ips林志颖网页制作报告.docVIP

学 生 实 验 报 告 课程名称 网站美工设计基础 实验成绩 实验项目名称 网页效果图制作 批阅教师 王旋 实验者 孙迪 学号 20510811135 专业班级 电商1111 实验日期 2013.6.4 一、实验预习报告（实验目的、内容，主要设备、仪器，基本原理、实验步骤等）（可加页） 1.教学目的：制作出网页效果图。 2.教学重点：photoshop 综合技术的应用。 二、实验基本原理 1.利用Photoshop软件进行设计； 2.按照实训内容中的提示分步骤完成。 三、实验主要仪器设备及耗材 教5-101实验室计算机 四、实验主要操作步骤 可自由发挥，题材不限制，提供参考教程（见网页效果图制作参考） 二、实验过程记录（包括实验过程、数据记录、实验现象等）（可加页） （这里只填写关键相应截图，并根据实验步骤标号，附带一定的文字说明） 步骤一：首先新建文档,大小为1200px*800px，对其进行一定颜色的添加，然后再打开一张图片，将其大小也调整为1200px*800px，然后将这张图片放在新建图片下方，给新建图片设置一定的透明度，将背景图片显示出来； 步骤二：在图片上添加文字效果； 添加图片效果； 步骤三：在基本工具那一栏中点击“设计”，然后保存图片； 步骤四：创建切片编号，在切片三中，点击右键，选择划分切片，然后水平划分为四个区域； 最终划分好切片编号； 步骤五：将编号为2的切片的URL设置为# 步骤六：将编号为3的导航的切片进行如下设置，同理操作编号6,7,10； 步骤七：对编号为1的切片选择菜单图层——新建基于图层的切片，并将名称设置为image，将URL设置为image.html，将目标设置为_black； 步骤八：点击文件，储存为web和设备所用格式； 步骤九：选择双联，再选第九个切片，然后点击预设； 步骤十：选择一些图片点击优化； 步骤十一：对剩下的切片进行如下设置； 步骤十二：进行储存； 步骤十三：预览网页； 三、实验结果分析（可加页） 问题1：查阅相关资料结合课程，说说网页设计的一般步骤 答：新建一个画布——在新建的画布上构建网页整体样式——将要设计的界面使用切片工具裁成小的便于编辑的模块——对各个模块进行切片编辑，优化等——另存为web格式； 问题2：说明photoshop制作网页的优势所在 答：Ps制作网页相对于我们所学的DW编写代码来说要方便很多； 对于图片那大小的调整等要便利很多； Ps制作网页可以对网页进行优化，总体来说，就是方便很多。 1