第14章 创建页面的热点区域和切片.ppt

Click to edit Master title style,Click to edit Master text styles,Second level,Third level,Fourth level,Fifth level,*,第,14,章 创建页面的热点区域和切片,教学内容：,在,Fireworks,中，为图像设置链接区域是靠“切片”或“热点”工具来完成。因此“切片”或“热点”区域又被称为链接区域。它们不是以图像的形式存在，而是在图像导出成网页格式后，以,HTML,代码的形式出现。,教学重点,掌握切割工具的使用,掌握图像的输出与优化,掌握图像热区的创建,教学目标和基本要求,_,_,_,教学时间,：,本章共分,_,课时,教学方法,案例教学,多媒体教学,理论面授,教学素材,课程范例文件：,sample,第,14,章,练习文件：,exercise,第,14,章,本章各节课时分配,及链接,14.1,任务,56,切割公司首页,（）课时,14.2,任务,57,为图像添加热点,（）课时,14.3,综合实训,使用热点绘制网站封面页面,（）课时,本 章 小 结,思考与练习,14.1,任务,56,切割公司首页,如果网页上的图片较大，浏览器下载整个图片的话需要花很长的时间。切片的使用，使得整个图片可以分为多个不同的小图片分开下载，这样下载的时间就大大缩短了。在目前互联网带宽还受到条件限制的情况下，运用切片来减少网页下载时间而又不影响图片的效果。,14.1.1,简单讲评,切片就是将一幅大图像分割为一些小的图像切片，然后在网页中通过没有间距和宽度的表格重新将这些小的图像没有缝隙的拼接起来，成为一幅完整的图像。这样做可以减小图像的大小，减少网页的下载时间，还能将图像的一些区域用,html,来代替。,14.1.2,核心知识,切片工具的使用,切片是,Fireworks,中十分有特色的一个部分。切片将图像分割成多个小部分、并将每部分导出为单独的文件。,14.1.3,实际操作,步骤,2,选择工具箱中,“,切片,”,工具,。,步骤,3,将光标置于要创建切片的位置，按住鼠标左键拖动，绘制切片。,步骤,5,选择“窗口,优化”命令，打开“优化”面板。,步骤,6,在“优化”面板中选择文件格式，如图,14-9,所示，此时应根据文件类型选择不同的文件格式。,步骤,8,选择“文件,导出”命令，弹出“导出”对话框，在“导出”右边的下拉列表中选择,HTML,和图像。,14.2,任务,57,为图像添加热点,有时候在页面上显示一幅较大的完整图像同时将整幅图像中的不同区域分别映射到不同的链接上，这时使用传统的超链接设置方法就无法满足要求。这时可以在图像上创建热点，之后将热点分别同不同的链接相关联即可实现。,14.2.1,简单讲评,一般来说，一幅图像只能有一个超级链接目标，同一个图像的不同部分也可以链接到不同的文档，这就是热点链接。要使图像特定部分成为超级链接，就要在图像中设置“热点”。可以在一个较大的图像上建立多个热点区域，以链接到文本文件、图像等。,14.2.2,核心知识,-,图像热点工具的使用,从工具箱中的,“,Web,”,部分选择,“,矩形热点,”,工具或,“,圆形热点,”,工具，拖动热点工具，在图形的某个区域上绘制热点。按住,Alt,键可从中心点开始绘制。,14.2.3,实际操作,步骤,2,选择工具箱中的“矩形热点”工具,。,步骤,3,在要创建热点的位置按住鼠标左键拖动形成一个矩形选区。,步骤,4,拖动到合适的大小，释放鼠标。,步骤,5,在热点属性面板中出现热点属性设置选项。在文本框中输入,URL,地址，即单击该热点就会链接到该,URL,地址。在“替代”文本框中输入对该热点链接的说明。,14.3,综合实训,使用热点绘制网站封面页面,热点的作用是当光标经过热点区时，指针会变为手形，单击热点会打开相关的链接网页。这样的效果在浏览网页时是十分常见的。下面使用热点绘制网站封面页。,步骤,2,单击工具箱中的,“,文本,”,工具，添加文本,“,爵士岛咖啡，传承欧洲咖啡文化的精髓,”,，设置字体为隶书，,“,大小,”,为,25,，填充颜色为,#FF6600,。,步骤,3,单击工具箱中的“矩形热点”工具，绘制一个热点,。,步骤,4,选中热点区域，在属性面板中出现热点属性设置选项,。,步骤,8,分别在热点属性选项中的,“,替代,”,文本框中输入,“,合作流程,”,、,“,市场定位,”,、,“,加盟爵士岛,”,、,“,在线申请,”,，并且添加上链接。,本,章,小,结,在网页设计中热点被广泛的使用，热点是图像上带有超级链接的一块区域，同一幅图上可以有几个热点链接到不同的地址。切片可以将一幅大的图片分割开来，这样可以减小图像的大小，并且能创造交互的效果，还能将图像的一些区域用,html,来代替。,思考与,练习,1填空题,（,1,）在,Fireworks,中，为图像设置链接区域是靠,_,或,_,工具来完成。,（,2,）在目前互联网带宽还受到条件限制的情况下，运用,_,来减少网页下载时间而又不影响图片的效果。,（,3,）如果切片大小不合适，可以使用工具箱中的,_,工具拖动切片引导线来调整切片大小。,2,判断题,（,1,）如果网页上的图片较大，浏览器下载整个图片的话需要花很长的时间。热点的使用，使得整个图片可以分为多个不同的小图片分开下载，这样下载的时间就大大缩短了。（）,（,2,）,使用工具箱中的“指针”工具，可以移动图像上的切片对象。（）,（,3,）在源图形中标识出可作为导航点的区域后，就可以创建热点，然后为它们指定,URL,链接、弹出菜单、状态栏消息和替换文本。（）,3,问答题,（,1,）切片有哪些优点？,（,2,）创建切片的方法有哪些？,（,3,）,Fireworks,哪些热点制作工具？,