1第四单元制作“心情日记”网页任务三制作媒体日记网页一、提出任务1.任务目标在网页中插入多媒体内容。2.解决的问题通过完成本任务认识多媒体视频文件和FLASH动画文件在网页制作中的重要作用,学习运用多媒体文件美化和丰富网页。3.本任务所涉及原有知识要点完成本任务所涉及原有知识要点有:在网页中插入图像、编辑图像,使用框架结构布局页面。二、教学目标1.知识目标⑴了解多媒体文件的分类。⑵了解视频文件在网页制作中的作用⑶掌握在网页中插入视频文件。⑷了解FLASH动画在网页制作中的作用⑸掌握在网页中插入FLASH动画。2.能力目标能够在网页中插入多媒体文件并进行参数设置。3.情感目标通过参加科学探究活动,初步掌握在网页制作中使用多媒体文件的方法,并加深对多媒体文件的理解。使学生增强自信心,对学习产生兴趣。三、教学分析与准备1.教学重点⑴多媒体文件的分类⑵在网页中插入视频文件。⑶在网页中插入FLASH动画。2.教学难点⑴在网页中插入视频文件。⑵在网页中插入FLASH动画。3.教学方法任务驱动学习、协作学习和探究学习相结合4.课时安排2课时。5.教学环境多媒体网络教室。四、教学过程(组织课堂、复习知识、教师引领完成任务占1学时;举一反三占1学时。)教学环节及手段教学内容备注组织课堂复习知识集中学生注意力,准备上课。通过提问考察学生对框架集掌握情况。1.框架集的作用?2任务流程导入任务分析任务完成任务2.上前演示使用框架集在一个网页中显示几个网页的内容。学生分组讨论下列问题。1.什么是媒体文件?2.媒体文件有哪些?3.列举日常生活中的媒体文件。学生回答上述问题,教师总结,从而引导学生学习媒体文件。浏览包含多媒体文件的网页,吸引学生兴趣。通过前面的学习已经系统的了解了图形图像在网页制作中的应用,但是还没有使用过媒体文件,本任务将系统学习多媒体文件在网页制作中的应用。提出任务:在网页中插入视频文件在“媒体日记”链接的网页“main5.html”中,插入一段视频文件。在上部框架页面“top.html”中,插入Flash动画作为装饰,美化页面。1.布局“媒体日记”页面运行DreamweaverCS5,在“文件”面板中,选择并打开上一任务创建的网页文件“main5.html”,通过“页面属性”设置网页上、下边距为0像素,背景色设置为“#EEF0FF”,其他采用默认值。选择菜单栏“插入”菜单的“表格”选项,插入一个宽366像素、2行2列的表格,表格边框为0。设置第一行高20像素,第二行高272像素,第一列宽17像素,第二列宽349像素(第二列列宽可以不设)。在第一行、第一列单元格中插入“D:\mysite\diary\diaryimages”文件夹中“point1.gif”图像,在第一行的第二列中输入文字“媒体日记”,文字大小为12像素。然后合并第二行的两个单元格。2.插入媒体插件在“文档窗口”中,用鼠标在表格第二行内单击,选择菜单栏“插入”→“媒体”→“插件”选项,弹出“选择文件”对话框,如课本图4-16所示。选择“D:\mysite\diary\media”文件夹中的视频文件“ljsy.mpg”,单击“确定”按钮。结合插入媒体菜单讲解有哪些媒体文件可以应用在网页设计中。3.插入FLASH动画文件在顶部框架页插入Flash动画。在DreamweaverCS5中,打开“D:\mysite\diary”文件夹下的网页学生可以利用帮助、课本、互联网查找答案。力求通过任务导入,吸引学生学习兴趣。教师引导,学生讨论、分析。3知识总结举一反三任务目标启发思路分组完成任务学生自评或互评教师点评总结布置作业“top.html”,将插入点放到图像“biaoti.jpg”的右边,选择菜单栏“插入”→“媒体”→“Flash”选项,在弹出的“选择文件”对话框中选择“D:\mysite\diary\media”文件夹中的Flash动画文件“top.swf”,单击“确定”按钮。保存网页“top.html”,按F12键预览插入FLASH文件后,FLASH背景与网页背景不协调。为此,在“文档窗口”中,单击选中刚插入的Flash动画,然后单击“属性”面板中的“参数”按钮,弹出“参数”对话框,设置“参数”为“wmode”,“值”为“transparent”,表示背景为透明。然后单击“确定”按钮,完成插入Flash及其参数设置,保存页面。多媒体文件包含Flash动画、Shockwave、Applet、ActiveX和插件等,每一类文件都有其相应的可设置参数,用于设置多媒体文件的各种属性。“wmode”是动画模式参数,“wmode”值设置为transparent代表显示Flash动画时,背景为透明。通过完成本任务学习了视频文件和FLASH动画在网页制作中的应用。创建网页“practice4-7.html”,在网页中插入“插件”,播放本单元素材“举一反三”文件夹中的“Boo.wav”。回忆使用哪个菜单、选项可以插入插件?本题应插入那个插件?每个插件可以插入什么类型的多媒体文件?把不同层次的学生分在一组中,鼓励同学积极讨论完成任务。小组间互相观看运行效果,并相互评论。教师对学生完成情况及评论进行总结,对完成任务的表扬,对没有完成任务的鼓励,并帮助他们分析没有完成的原因。1.如何在网页中插入声音文件,插入的声音文件和网页的背景音乐有什么区别?2.创建一个网页“practice4-8.html”,效果如图JYFS4-5所示,在网页下方插入“插件”,播放本单元素材“举一反三”文件夹中的“piantou.avi”。3.创建网页“practice4-9.html”,在网页中插教师作为引导者和组织者,学生分组上机操作,完成相应任务并进行评价。4入“插件”播放本单元素材“举一反三”文件夹中的“background.mid”,要求设置循环播放。要点提示:在“插件”的属性面板添加参数“loop”,值为“-1”。