网页设计与制作教案(三栏式,比较规范,内容详实,图文并茂).docVIP

项目名称：制作“名车展示网”（一） 授课时间： 授课地点： 授课班级： 授课次数及课时： 教学目标 【知识目标】 1、通过制作网页（而不是已往的浏览网页）了解网页、网站的概念。 2、了解链接的概念。 3、了解HTML代码中标签及属性的概念。 4、识记标签和属性的基本书写格式。 5、理解网页的本质及浏览器的功能。 【技能目标】 1、掌握建立站点和网页的方法。 2、掌握向页面输入文字，插入图片的方法。 【情感目标】 1、培养起对网站制作的兴趣。 2、培养与人协作的意识，锻炼与人协作的能力。 重点难点 【重点】 建立站点和网页的方法。 【难点】 站点和文件夹的对应关系。 项目分析 利用DW和提供的图片、文字素材制作“名车展示网”。内含一个导航页面（首页）和三个分别介绍三种名车的页面。此项目旨在让学生对网站的制作有一个感性的认识并培养他们对课程的兴趣，对页面的布局、美化不去涉及。 教学准备 三款名车的图文和文字素材 教学后记 在课堂上可以再多分配一些时间给学生自己去探索，有些知识点学生自己经过尝试可以自己获得，这样他们对知识的印象会比老师告诉他们来得更深。 教学过程 师生互动设计及设计意图 教学方法 一、展示将要完成的项目 1.展示教师制作好了的网站——名车展示网 2.进入网站的文件夹，引导学生观察网站的架构 【教师活动】 通过凌波展示网站（浏览），激发学生的学习热情和兴趣（汽车是学生比较喜欢的话题） 【学生活动】 观察 【教师活动】 进入网站文件夹，引导学生观察网站的架构，为下面的建立站点做铺垫。 提问：网页和图片分别怎样组织？ 【学生活动】 讨论，回答 【教师活动】 点评，总结 【教法】 通过演示，启发引导学生思考，引导学生自己得出结论。 【教法】 教师通过总结，对结论进行完善和强化。 二、演示建立站点的步骤，学生参照教师讲授自主建立网站 1.通过引导学生观察网站文件夹，使学生了解网站和网页的概念，进而理解网站的组织方式，理解建网站时一些步骤的意义。 2.演示建立站点的步骤 （1）建立好相关文件夹 （2）进入“站点定义为”对话框，设置相关选项 3.对操作中的难点和易错点进行再次强调 【教师活动】 先强调网站的架构方式，再演示用DW建立网站的步骤 【学生活动】 观察，理解，识记 【教师活动】 通过提问强化： 1.站点名称和实际的文件夹名称需要相同吗？ 2. 站点名称和实际的文件夹名称可以用中文吗？ 【学生活动】 操作，讨论→回答 【教师活动】 对以上的两个问题进行总结，以强化。 【教法】演示法 【学法】探索，讨论 【教法】归纳、总结  教学过程 师生互动设计及设计意图 教学方法 三、建立第一个网页（首页） 1.演示新建网页的方法，重点理解对话框中相关选项的意义。 2.强调注意点：新建网页后立即保存 3.演示输入四段文本，和word中输入文本进行比较，使学生感觉入门不难。 讲授回车产生的P标记 通过水平居中的align=“center”（“left”“right”）讲授标记中的属性的写法和作用 通过设置标题的大字体讲授h1~h6标记，并注意和p标记进行比较。 【教师活动】 演示、讲授如何新建一个网页。 提问：新建的快捷键？ 若学生回答不出，教师提示： 在word，excel中如何新建文件？ 尽量唤醒学生的记忆，如果学生确实不知道，在下课前再次强调。 【学生活动】 对教师提出的问题讨论，操作，再回答。 【教师活动】 演示在新建的网页中输入四段文本 【学生活动】 模仿教师的操作，完成网页中文本的输入 【教法】 启发（引导学生一步一步的思考，最终自己得出结论，让学生感觉结论本来就是自己思考获得的，而不是老师告诉自己的） 【学法】 模仿，通过模仿加深印象 四、建立一个奥迪汽车展示的页面 1.演示奥迪汽车页面的新建和保存 2.演示页面中图片的插入 3.学生自主完成文字的插入 【教师活动】 请一名学生演示网页的新建，重点注意观察学生是否按照之间教师的讲授，新建网页后立即保存。 【学生活动】 学生代表演示，其余学生观看。 【教师活动】 对学生代表的操作进行点评。 【教师活动】 演示插入图片的方法和步骤。 【学生活动】 观察、识记 【教法】 演示法 【教法】 归纳、总结 【学法】 根据已有经验自主学习  教学过程 师生互动设计及设计意图 教学方法 五、模仿奥迪页面，学生自主完成另外两个汽车页面的制作 1.布置任务： 模仿奥迪汽车页面的制作，自主完成另外两个页面的制作 2.请学生展示自己制作的页面 3.对学生的作品开展各种形式的评价 （1）自评 （2）同学互评 （3）教师点评 4.请学生根据评价对自己的作品进行修改和完善 【教师活动】 展示已经制作好的几个汽车的页面，让学生感觉到页面的相似之