《《网页设计综合应用技术》模块三.ppt》由会员分享,可在线阅读,更多相关《《网页设计综合应用技术》模块三.ppt(25页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。
1、模块三模块三 网站首页设计网站首页设计 网页设计综合应用技术网页设计综合应用技术学习目标掌握Photoshop中常用工具的使用,能进行图片的编辑和图像的绘制 掌握Photoshop中路径、图层、蒙版技术,能对图像进行合成处理 了解Photoshop切片的技巧 掌握Dreamweaver站点的建立、管理和维护 掌握Flash基本动画的制作 学习内容工作任务一工作任务一 素材图片的编辑和图形绘制素材图片的编辑和图形绘制 工作任务二工作任务二 图像合成图像合成工作任务三工作任务三 图像切片图像切片工作任务四工作任务四 建立建立Dreamweaver站点站点 工作任务五 Flash banner的制作
2、工作任务一工作任务一 素材图片的编辑和图形绘制素材图片的编辑和图形绘制图像的调整切割类工具的使用 选区的操作 图层面板的应用 文字的应用 画笔工具的使用 路径 工作任务一工作任务一 素材图片的编辑和图形绘制素材图片的编辑和图形绘制图像的调整“图像大小”对话框“画布大小”对话框 工作任务一工作任务一 素材图片的编辑和图形绘制素材图片的编辑和图形绘制切割类工具的使用 利用裁剪工具,可以删除不需要的部分,以调整图像的整体结构图,利用裁剪工具,可以删除不需要的部分,以调整图像的整体结构图,也可以裁切特定的区域,另外,也可以完全改变图像样式。使用裁剪工也可以裁切特定的区域,另外,也可以完全改变图像样式。
3、使用裁剪工具后,在图像上拖动,会显示边框,边框中显示小的锚点,边框内的具后,在图像上拖动,会显示边框,边框中显示小的锚点,边框内的图像是留下的图像,变暗的部分则为被裁剪掉的区域图像是留下的图像,变暗的部分则为被裁剪掉的区域 切割工具属性栏 工作任务一工作任务一 素材图片的编辑和图形绘制素材图片的编辑和图形绘制选区的操作选区的创建创建简单规则选区 不规则选区工具的使用 选区的编辑移动选区 取消选区 羽化选区 修改选区 变换选区 工作任务一工作任务一 素材图片的编辑和图形绘制素材图片的编辑和图形绘制图层面板的应用图层是图像信息的平台,是构成图像的重要组成单位,在一个图图层是图像信息的平台,是构成图
4、像的重要组成单位,在一个图层上作图不会影响其他图层。图层面板是由图层、图层混合模式、层上作图不会影响其他图层。图层面板是由图层、图层混合模式、不透明度、提供锁定功能的部分以及快捷图标构成不透明度、提供锁定功能的部分以及快捷图标构成 图层面板工作任务一工作任务一 素材图片的编辑和图形绘制素材图片的编辑和图形绘制文字的应用字符面板“变形文字”对话框文字工具属性栏工作任务一工作任务一 素材图片的编辑和图形绘制素材图片的编辑和图形绘制画笔工具的使用画笔工具属性栏工作任务一工作任务一 素材图片的编辑和图形绘制素材图片的编辑和图形绘制路径路径是指通过钢笔工具绘制出来的线段或曲线,它是矢量式的线条,路径是指
5、通过钢笔工具绘制出来的线段或曲线,它是矢量式的线条,可为其填充颜色、描边或转换为选区等处理可为其填充颜色、描边或转换为选区等处理 路径面板 钢笔工具属性栏 工作任务二工作任务二 图像合成图像合成首页效果图内页页眉效果图工作任务二工作任务二 图像合成图像合成蒙板的使用用于保护图像中被屏蔽的区域,让该区域的图像不受用于保护图像中被屏蔽的区域,让该区域的图像不受任何编辑操作的影响,而且还可以反复操作任何编辑操作的影响,而且还可以反复操作 快速蒙板图层蒙版 矢量蒙版 剪切蒙板工作任务二工作任务二 图像合成图像合成滤镜的使用滤镜主要应用于实现图像的各种特殊效果,使用时在滤镜菜单中执行滤镜主要应用于实现图
6、像的各种特殊效果,使用时在滤镜菜单中执行这些相应的命令这些相应的命令滤镜在计算过程中将占用相当大的内存资源,在处理一些较大的图像滤镜在计算过程中将占用相当大的内存资源,在处理一些较大的图像文件时,速度比较慢文件时,速度比较慢 切割图片输出文件工作任务三工作任务三 图像切片图像切片工作任务三工作任务三 图像切片图像切片切片是使用切片是使用 HTML 表或表或 CSS 图层将图像划分为若干较小的图像,使得图像在图层将图像划分为若干较小的图像,使得图像在网络传输中的速度更快,减少浏览者的等待时间,这些图像可在网络传输中的速度更快,减少浏览者的等待时间,这些图像可在 Web 页上重新页上重新组合。切片
7、除了加快传输速度外,还可以制作动态效果、优化图像以及创建链接组合。切片除了加快传输速度外,还可以制作动态效果、优化图像以及创建链接 切片工具 切片的创建方法 切片的相关属性 切片的原则 切片类型工作任务三工作任务三 图像切片图像切片切片的相关操作 切片的输出 图像的优化 切片的输出 工作任务四工作任务四 建立建立Dreamweaver站点站点 dreamweaver界面工作任务四工作任务四 建立建立Dreamweaver站点站点 定义站点静态站点的定义 动态站点的定义 创建与管理站点资源 编辑和管理站点 检查与修复网站 工作任务五 Flash banner的制作banner广告条工作任务五 F
8、lash banner的制作Flash基础 Flash工作界面 工作任务五 Flash banner的制作Flash动画制作的一般过程 创建创建Flash文档文档 设置文档属性设置文档属性 制作动画制作动画 保存文档保存文档 测试与发布影片测试与发布影片 工作任务五 Flash banner的制作动画的种类及制作方法 逐帧动画是在时间轴上依次绘制每个关键帧的内容,而逐帧动画是在时间轴上依次绘制每个关键帧的内容,而不是由不是由Flash计算得到,然后连续依次播放这些画面,利计算得到,然后连续依次播放这些画面,利用人眼的视觉暂留特性,产生动画效果用人眼的视觉暂留特性,产生动画效果 补间动画也叫过渡动画,制作若干个关键帧画面,由补间动画也叫过渡动画,制作若干个关键帧画面,由Flash计算计算生成各关键帧之间的各个帧,使画面从一个关键帧过渡到另一个生成各关键帧之间的各个帧,使画面从一个关键帧过渡到另一个关键帧关键帧,补间动画又分为动作补间动画和形状补间动画,补间动画又分为动作补间动画和形状补间动画 小结Photoshop中的画笔、矩形、钢笔等工具进行图形绘制 变形命令缩放、旋转、扭曲、倾斜对象 蒙版对图像进行处理、合成 滤镜增加图像特效 使用切片分割图像并导出为web网页格式 利用Dreamweaver搭建网站站点 采用Flash制作动画 网页设计综合应用技术网页设计综合应用技术