《中职《网页制作》课程教案8章.docx》由会员分享,可在线阅读,更多相关《中职《网页制作》课程教案8章.docx(5页珍藏版)》请在优知文库上搜索。
1、网页制作课程教案授课教师:课题章节/名称应用框架制作电子书课时2主要教学方法四步教学法教 学 目 标识标 知目(1)理解框架集和框架的关系。(2)掌握创建框架集的方法。(3)掌握制作各框架中的页面的方法。(4)掌握创建超链接、保存框架集的方法。能力 目标(1)能够使用DreamWeaVerCS6制作“HTML教程”网页。(2)能够不断学习、触类旁通。(3)能够解决软件使用过程中遇到的问题。情感 目标(1)具有勤奋学习的态度,严谨求实的工作作风。(2)具有良好的心理素质和职业道德素质。(3)具有一定的科学思维方式和判断分析问题的能力。(4)具有良好的软件应用与解决问题的能力。教学 重点与难点重点
2、(1)制作各框架中的页面。难点(1)框架集和框架的关系。(2)制作超链接时“目标”的选择。媒体 教具 (或主 要工 具材 料等)课本、PPTs 素材和 DreanlweaVer CS6教学过程修改栏 (时间 分配)教学内容师生互动1.介绍本章知识点、重点、难点和教学计划。导入新课:案1.教师演示详细 步骤。5分钟例综述、窠例分析。2.教师指导学生2.8.1.3实现步骤:1.创建框架集创建本地站点名为KJ。操作。打开DreamWeaVer CS6,单击“新建”类别的“HTML”3.学生提问,教师 回答。8分钟按钮。选择菜单中的“插入”、“HTML” I “框架” I4.教师提问,学生“上方及左侧
3、嵌套”。回答。3.选择“文件” I “保存全部”。首先保存的是框架集文5.教师反馈学生 学习情况。8分钟件,命名为index, html随后保存main, html。在各框架内单击,选择“文件” I “保存框架”分别保存为top.html和 left, html04.2.制作各框架中的页面(1)制作顶部页面。步骤:在8分钟顶部框架内插入1*1表格,边框、边距和间距都为0,单击“确定” o单元格和表格都设置为居中对齐。在单元格中插入图片,调整框架边框高度。8分钟5.(2)创建左页面。步骤:将光标定位于左边框内,单击“页面属性”按钮,将左边距和上边距都设为Opx,按“确定。6.打开“框架”面板,可
4、选择相应的框架和框架集。选中左10分钟右框架的框架集,在属性面板中的“列”设置为200像素。插入一个5*2的表格,宽度为200像素,边框、边距和间距都为0,单击“确定”。在表格内插入图片和文本。选中图片的列,设置宽为44px,高为40px。7.(3)制作右侧主页面。步骤:将光标定位于右面的框架内,5分钟插入1*1的表格,宽度为80乐单击“确定”。表格设置为居中对齐。在表格内拷贝文本Inain. txt。8.(4)创建链接子页面。步骤:新建一个目录pages,在其中新5分钟建页面LhtmIo编辑Lhtnl1,插入一个1*1的表格,宽度为80%,单击“确定”。将表格设置为“居中对齐”,将文本 插入
5、其中。9.把 Lhtnll 复制重命名为 2. html、3.html、4.html、 5. htmlo修改文本内容。10. 3.创建超链接。步骤:选中文本“HTML入门”将其链 接到l.html,在“目标”中选择mainframe。同理,将 其他文本添加链接,“目标”设为mainframe。在“框 架”面板中单击做框架,在“属性”面板中设置“滚动” 为否,勾选“不能调整大小”选项。4.保存框架集。选择 “文件” I “保存全部”。IL对本次课进行归纳总结,5分钟8分钟3分钟作业 布置制作“HTML教程”网页学思 教反亮点:对于一些容易出错或者不太理解有什么区别的知识点都进行强调和演 示异同。
6、如框架集和框架的关系、制作超链接时“目标”的选择、保存框架集和 框架的方法等,这是很容易混淆和不易理解的内容,将其放在一起比较和分析。 首先用通俗易懂的语言向学生讲解其含义,再与容易混淆的内容进行对比和注意 事项的强调,通过演示使学生加深理解。网页制作课程教案课题章节/名称第八章实战演练课时2主要教学方法四步教学法教 学 目 标知识 目标(1)理解框架集和框架的关系。(2)理解iframe标记的内容的含义。(3)掌握制作各框架中的页面的方法。(4)掌握创建超链接、保存框架集的方法。(5)掌握链接的设置和嵌入内嵌框架的方法能力 目标(1)能够使用DreamWedVerCS6制作“DW学习网”网页
7、。(2)能够不断学习、触类旁通。(3)能够解决软件使用过程中遇到的问题。情感 目标(1)具有勤奋学习的态度,严谨求实的工作作风。(2)具有良好的心理素质和职业道德素质。(3)具有一定的科学思维方式和判断分析问题的能力。(4)具有良好的软件应用与解决问题的能力。教学 重点 与 难点重点(1)用表格布局页面。(2)链接的设置。难点(1)框架和框架集相互之间的联系。(2)链接的设置。(3) iframe 标记的内容的含义媒体 教具 (或主 要工 具材 料等)课本、PPT、素材和 Dreamweaver CS6教学过程修改栏 (时间 分配)教学内容师生互动1.复习上一堂课的知识。1.教师演示详细 步骤
8、。3分钟2.介绍本节课的重难点,展示DW学习网的完成效果,讲解 制作方法。演示具体的操作步骤:创建站点,设置页面2.教师指导学生 操作。16分钟属性。插入表格,设置表格属性,在表格中插入logo 和 banner (P150)。3 .学生提问,教师 回答。4 .教师提问,学生3.插入表格,输入导航文字。插入表格,输入内嵌框架 代码,讲解内嵌框架代码的含义(P150) 0回答。5.教师反馈学生 学习情况。14分钟4 .制作链接分页面aa. html、bb.html、cc.html。设置 aa.html页面属性,嵌入框架代码,讲解内嵌框架代码含 义。修改 bb. html 和 cc. html 的 SrC 值(P150) 5 .制作教程的目录项,制作各目录项的链接,讲解相应内 容页与框架的关系(P151)。6 .制作详细内容页,保存所有打开的文档,完成制作。7 .对本次课进行归纳总结,18分钟18分钟18分钟3分钟作业 布置制作“DW学习网”网页学思 教反因为书本上有错误、步骤不够详细并且框架关系复杂较难理解,所以采用分 段演示的方式引导学生突破难点,完成这个网页的制作。教学过程中注重观察和 询问学生是否领悟知识点,如果没有再进一步耐心讲解直至弄懂。反复的讲解难 点可以加深学生的印象和理解。