3．确定布局类型 网页的布局类型有“国”字形、“厂”字形等。接下来是网站的主要内容，左右分列，最下面是网站的基本信息、版权声明等。“厂”字形布局的网页顶右面显示正文信息。展示型网站和个人网站的主页一般采用“封面”型布局。它是在精美的图片上添加简单的文字并链接到其他栏目。 4.认识制作工具 【操作演示】执行“开始” →“程序”→“Macromedia”→“Macromedia Dreamweaver 8”命令，再点击“文件”→“新建”，在弹出的“新建页面”窗口中执行“常规”→“基本页”→“HTML”命令后，单击“创建”即可进入Dreamweaver 8的操作界面。熟悉Dreamweaver 8 操作界面。 4．表格规划局部 【操作演示】执行“插入”→“表格”命令或点击插入栏的“表格”快捷，再选择“表格”，将表格设置为“3行3列”，将第一行和第三行的三个单元格分别合并为“标题栏”和“信息栏”。操作为选择一行中的三个单元格，点击属性面板中的“合并”按钮。将第二行的第一个单元格拆分成六行作为“导航栏”，操作为选中单元格，点击属性面板中的“拆分”按钮，在弹出的“拆分单元格”窗口中将行数设置成六行。第二行中间单元格及右边单元格分别作为“内容区”和“图片栏”。 三、课堂练习 自己想好一个网站主题，利用表格工具对网站首页进行规划布局。 四、本课总结 本节课，我们学会了如何规划一个网站，怎样去搜集和整理资料，以及了解网页一般的布局类型，初步熟悉了网页编辑工具Dreamweaver8，并利用表格工具布局网页。 教学 后记 认真思考、讨论，了解各缺点。 认真听讲，积极思考，并自己动手操作，掌握技巧和方法。 认真听讲并积极思考。自己动手操作，掌握技巧和方法。 为学生讲解一般网页的布局类型有哪些。 指导学生认识和熟悉8 Dreamweaver 网页编辑工具 指导学生用表格规划网页布局。 5’ 5’ 5’ “国”字形布局的网页最上面是标题、广告及导航栏，听讲，积极部为横条网站标志和横条图片，下面左面为主菜单，类型的优按要求完成作业。 组织学生进行练习，巩固学习效果。 10’ 认真听讲，积极思考。 对本节课所学知识进行总结。 5’ 科目 课时 课题 知识能力品德 信息技术 1课时 年级 课型 七年级 新授课 班级 时间 网页中的基本元素设计——设置网页背景、在网页中添加文字、图片 教 学 目 标 1．熟练使用Dreamweaver8。 2．学会用Dreamweaver8设置网页背景，为网页添加和编辑文字图片。 3．培养学生积极思考、主动探求知识的态度。 教学 重点 难点 板书 设计 示意 框图 重点： 用Dreamweaver 8设置网页背景、添加文字、图片的基本操作。 难点： 在网页中添加并编辑图片。 第九课 网页中的基本元素设计——设置网页背景、在网页中添加文字、图片 三十一、 设置网页、单元格背景 三十二、 添加和编辑文字 三十三、 在表格中插入图片 知识准备：计算机基础知识及Dreamweaver的基本操作技能。 教 学 硬件准备：多媒体教学工具。 准 备 软件准备：Dreamweaver 8。 教 学 过 程 教师活动 一、课前导入，任务介绍 小明完成了对“初258班----我们的大家庭”网站首页中板块内容和布局类型的确定，并用Dreamweaver8对网页进行了表格规划。规划后的页面并没有内容，这节课我们就和小明一起来为网页添加内容，设置背景，让网页变得漂亮起来。 认真引入课堂，3’ 阅读教材，让学生完成过积极思考。 渡。 学生活动 教师意图 时间 二、设置网页、单元格背景，为网页添加文字、图片。 1．设置网页、单元格背景 【操作演示】进入Dreamweaver 8界面后，执行 认真听讲， 指导学生 5’ “页面属性”→“浏览”命令，在“选择图像源文件”积极思考，设置网页、单元窗口中，找到背景图片后执行“确定”→“应用”命并自己动格背景。 令，就完成了网页背景的设置。 手操作，掌 要对一个单元格进行背景设置，先选中要设置的单元格，单击“属性面板”中“背景”后的文件夹图标，在“选择图像源文件”窗口中找到背景图片后执行“确定”就行了。 2．添加和编辑文字 【操作演示】在“标题栏”中输入文字“初258在属性面板上设置文字大小为“36”、“宋体”，“我们的大家庭”设置成“24”、“宋体”。同样，我们在“导航栏”、“内容区”、“信息栏”输入文字内容，并对其设置大小、字体。 3．在表格中插入图片 【操作演示】选定“图片区”单元格，拆分成2行，单击菜单栏中的“插入” →“图像”，在“选择图像源文件”窗口中找到需要的图片并插入，这样就轻松地实现了往网页中插入图片。 握技巧和方法。 认真听讲，积极己动手操作，掌握技巧和方法。 认真听讲，积极思考，并自己动手操作，掌握技巧和方法。 指导学生添加并编辑文字。 通过操作指导学生在表格中插入图片信息。 组织学生进行练习，巩固学习效果。 10’ 5’ 10’ 班——我们的大家庭”，选择文字“初258班——”，思考，并自三、课堂练习 根据上节课堂练习制作的布局表格，设置网页的背景，设置表格中单元格的背景；在表格中添加并编辑文字；在表格中插入并编辑图片。 四、本课总结 本节课，我们学习了设置网页、单元格的背景，在表格中添加和编辑文字以及在表格中插入图片等操作。这样，网页中就有了内容，网页也漂亮起来了，也为以后更深入地学习打下了基础。 按要求完成作业。 认真听讲，积极思考。 对本节课所学知识进行总结。 5’ 教 学 后 记
科目 课时 课题 知识能力品德 信息技术 1课时 年级 课型 七年级 新授课 班级 时间 让班级网页“动”起来----为网页添加动态元素和动态效果 教 学 目 标 1．学会用Dreamweaver8为网页添加动态元素和动态效果。 2．熟练使用Dreamweaver8，提高操作技能。 3．培养认真对待学习、积极思考、自己动手实践的学习态度。 教学 重点 难点 重点： 熟练运用Dreamweaver8为网页添加动态元素。 难点： 通过运动文本标识在网页中添加特殊的动态效果。 第十课 让班级网页“动”起来----为网页添加动态元素和动态效果 三十四、 准备素材 三十五、 添加动画、视频和音乐 三十六、 添加动态效果 三十七、 检查并保存网页 板书 设计 示意 框图 知识准备：计算机基础知识及Dreamweaver8的基本操作技能。 教 学 硬件准备：多媒体教学工具。 准 备 软件准备：Dreamweaver8。 教 学 过 程 教师活动 一、课前导入，任务介绍 小明想将有老师和同学照片的Flash动画添加到网页里播放，想将一些有趣的班级视频放到网页中，想在网页中加入一些好听的音乐。现在，我们就和小明一起来实现这些效果吧。 认真引入课3’ 阅读教材，堂，让学生积极思考。 完成过渡。 学生活动 教师意图 时间 二、为网页添加动态元素和动态效果 1．准备素材 准备动画素材：将相关图片和文字做出Flash动画，并要求保存为“.swf”格式的文件，如果使用动画图片，则图片格式要为“.gif”。 认真听讲，积极思考，并总 让学生了解网页支持动画、音 5’ 准备声音素材：网页支持“.wav”、“.mp3”、“.wma”结知识。 和“.midi”格式的声音文件，其他格式的声音文件需要工具软件转换格式后再使用。 准备视频素材：在系统中安装了默认插件的情况下，相对应的视频文件可以在网页中播放。 2．添加动画、视频和音乐 认真乐、视频的格式。 讲授添频和音乐的技能。 传授学生相关知识，通过操作演示，提高学生操作技能。 指导学生保存文档。 组织学生进行练习，巩固学习效果。 5’ 5’ 5’ 首先将素材都放到网站目录里相对应的文件夹。 观看演示，将动画插入到网页中 【操作演示】执行“插入” →“媒体” →“Flash”并自己动命令，找到相应的Flash文件并插入到网页中。选中手操作，掌Flash动画，可以在“属性面板”中进行属性设置。执行“插入” →“图像”命令，可以将动画图片插入到网页中。 将音乐插入到网页中去 【操作演示】执行“插入” →“媒体” →“插件”命令，选中相应的音乐就可以插入到网页中去了。 将视频插入到网页中去 【操作演示】执行“插入” →“媒体” →“Flash 视频”命令，选中相应的视频就可以插入到网页中去了。 3．添加动态效果 可以通过运动文本来为文字或图片添加特殊的动态效果。 握技巧和方法。 认真听讲，积极思考，并自己动手操作，掌握技积极思考，加动画、视【操作演示】选中文字，单击左上角的“拆分”巧和方法。 按钮，将视图切换为拆分视图后，在代码窗口的蓝色区域分别添加运动文本标识：。 4．检查并保存网页 在“文件”菜单中保存网页，按“F12”键后就可以查看效果了。 三、课堂练习 准备好需要用到的Flash、视频和声音素材，让学生将这些素材添加到上节课课堂练习制作的网页中去。 四、本课总结 本节课，我们学习了如何将动画、音乐和视频添加到网页中去，并学会了为文字或图片添加特殊的动态效果，使我们的网页更加漂亮、更加生动。 认真听讲，积极思考。 自己动手操作，掌握技巧和方法。 按要求完成作业。 10’ 对本节课所学知识进行总结。 5’