第2次课 网页与动态图形.pptVIP

第13章 网页和动态图形;一、常用概念; 二、GIF动画;13.4.1 过渡和调整 “过渡”命令大大减少了创建动画效果所需的时间。 13.4.2 过渡样式 13.4.3 位置过渡 13.4.4 过渡变形文字;13.4.5 逐帧动画 在photoshop中准备一系列的图片，并有序地进行图层排列，在photoshop或ImageReady中通过显示和隐藏图层，得到一系列动画的效果，我们称之为“逐帧动画”。 它的最大特点就是每一帧多需要通过手动进行调整。;三、透明背景图像制作;四、优化用于WEB的图像;JPEG格式：可保留照片和连续调图像的亮度和色调的广泛细微的多种变化，并且被大多数浏览器支持的格式。 GIF格式：使用8位颜色，在保留锐化细节的同时可以有效压缩颜色。例如线条稿、标志或文字的图解，也可以使用GIF格式创建动画，被大多数浏览器支持。 PNG-8格式：与GIF格式相同，不被所有的浏览器支持，避免使用该格式。 PNG-28格式：与JPEG格式相似，还可以支持背景透明和背景杂边，也不能被所有的浏览器支持。;优化图像;五、将图像存储为网页的HTML格式;六、图像映射和切片;1.图像映射;（1）、打开要编辑的图像，然后执行“文件”“在ImageReady中编辑”命令，弹出Adobe ImageReady”编辑窗口。 （2）、使用矩形/椭圆/多边形图像映射工具，在图像上要定义的区域拖移，绘制出相应的选框。 （3）、执行“窗口”“图像映射”命令，打开图像映射面板，设置链接属性 创建映射名称：在面板中名称中输入该映射的名称。 创建URL:在面板中URL的中输入要进行链接的网页或网站的地址。 相对URL和绝对URL，(如果是绝对的URL，一定要 包括正确的协议的网址：如) 设定打开目标：在目标选项中，输入新网页打开的位置。 -blank:在新的窗口中显示链接文件。 -Self：在原网页中显示链接文件，为默认选项 设定ALT文本框：为图像或映射区域的代替文本，当把鼠标放在该区域时，Alt文本会出现。 （4）、存储为HTML格式;2、图像切片;;（1）使用切片工具创建切片;（2）使用图层创建切片;（3）从参考线创建切片;;七、网页模板制作;网页的组成; 实例8-1这是一个流行服装网站的首页，如图18-42所示。首页模板主要应用参考线对页面??划分区域进行布局，并依靠参考线的位置绘制不同的对象元素，同时应用滤镜效果设置页面的视觉立体、阴影等特殊效果,设置完成后，并利用切片工具对网页进行切片，以便再Dreamweaver CS3对页面进一步修改。;1、新建一个1024*768像素，分辨率为120像素/英寸，白色背景的的文档。 2、显示标尺，根据设计要求，拖拉出参考线布局页面。 3、根据参考线布局，绘制不同的选区，并填充不同的颜色。 ; 5、绘制网站图标。选择【多边形】工具，绘制一个六边星形，设置属性和调整效果如图所示。 6、调整多边形的直角点为平滑点，效果如图所示 7、 选择【文本】工具，设置属性为宋体、34号字，填充为白色。在标题栏图标的右边输入“FASHION ONLINE”，如图18-50所示。;9、创建导航链接。进入IMAGEREADY,选择【矩形热点】工具，在导航条的各个导航项图层上创建图像热点建立超级链接。;实训