第四周（31-46课时）.doc

谷城中等职业教育中心学校电子教案20142015学年度第一学期网页制作课程电子教案 授课课题：超链接 授课教师：蒋红艳 NO： 16授课班级14春微机、14春商务授课日期授课类型讲授、演示学 时 数2教学目标1、 理解相关概念：热区文本、热区图片；2、 掌握超链接的分类；3、 掌握内部超链接和外部超链接的创建方法。教学内容超链接的特点、分类和创建方法重点难点文本超链接和图片超链接的创建方法教学方法演示、讲解学习方法观察、练习教学过程设计备注（时间分配、个性修改等）教学步骤及主要内容一、展示超链接的强大功能打开网址之间“360导航”，从这里打开“凤凰网”、“新浪网”，让学生感知网页间的跳转是超链接的功能。二、相关概念热区文本热区图片三、超链接的分类按热区对象分：文本超链接、图像超链接按链接对象分：内部超链接、外部超链接、锚记超链接四、演示操作1、文本超链接 站内文本超链接（拖动链接法） 本地站外文本超链接（浏览查找链接法） 互联网对象（输入网址链接）2、图片超链接 整张图片超链接（站内、站外方法同上） 图片热区超链接（用热点工具划分热区，站内、站外方法同上）课堂练习学生操作：1、 以“淘宝网”为热区文本，与建立超链接；2、 把一汽车图片链接到“时尚网站”首页index.html；3、 在一幅中国地图上，分别把“湖北”、“湖南”、“广东”、“上海”作为热区，与对应的各省政府网站建立链接。小结与作业课堂小结一、超链接的分类按热区对象分：文本超链接、图像超链接按链接对象分：内部超链接、外部超链接、锚记超链接二、创建链接的方法：1、文本超链接 站内文本超链接（拖动链接法） 本地站外文本超链接（浏览查找链接法） 互联网对象（输入网址链接）2、图片超链接 整张图片超链接（站内、站外方法同上） 图片热区超链接（用热点工具划分热区，站内、站外方法同上）本课作业本课教学后记（课堂设计理念，实际教学效果及改进设想）教研组长签字： 年 月 日20142015学年度第一学期网页制作课程电子教案 授课课题：文本超链接 授课教师：蒋红艳 NO： 17授课班级14春微机、14春商务授课日期授课类型实训课学 时 数2教学目标掌握文本超链接的创建方法。教学内容文本超链接的特点、创建方法重点难点文本超链接的创建方法教学方法演示、检查、指导学习方法上机实训教学过程设计备注（时间分配、个性修改等）教学步骤及主要内容一、 范例展示 二、 教师演示1、 新建站点“超链接练习”；2、 在站点内建立主页index.html；3、 打开主页，输入热区文本：交互式图像滚动公告透明层我的第一个网站4、 分别把上面的文字作为热区文本，与对应的站点内的主页建立一一对应的超链接。三、 分发素材把学生前两周完成的作业作为本次实训素材分发给大家，供他们完成今天的上机任务。四、 学生实训 五、 作业保存六、作业点评课堂练习小结与作业课堂小结一、超链接的分类按热区对象分：文本超链接、图像超链接按链接对象分：内部超链接、外部超链接、锚记超链接二、创建链接的方法：文本超链接站内文本超链接（拖动链接法）本地站外文本超链接（浏览查找链接法）互联网对象（输入网址链接）本课作业本课教学后记（课堂设计理念，实际教学效果及改进设想）教研组长签字： 年 月 日20142015学年度第一学期网页制作课程电子教案 授课课题：图片热区超链接 授课教师：蒋红艳 NO： 18-19授课班级14春微机、14春商务授课日期授课类型上机实训课学 时 数4教学目标1、掌握图片热区的创建方法；2、掌握整张图片超链接与图片热片超链接的创建方法；教学内容整张图片超链接与图片热片超链接的创建方法重点难点图片热片超链接的创建方法教学方法演示、指导、检查学习方法观察、练习教学过程设计备注（时间分配、个性修改等）教学步骤及主要内容一、范例展示二、教师演示1、创建站点，新建素材文件夹、index.html;2、把准备好的素材复制到素材文件夹中；3、打开主页，设置背景图像；4、在主页上输入文字、插入地图；5、在站点内创建子页：banzhu.html ，xiaohua.html ;6、把主页上的文字“主页”、“版主的话”、“校园笑话”分别作为热区文字，与对应的网页建立链接；7、新建子页：hubei.html, hunan.html, Beijing.html, shanghai.html，并编辑这些子页;8、用热点工具，在地图上把“湖北”、“湖南”、“北京”、“上海”划成热区，并把这些热区与对应的网站建立链接；三、学生实训四、作业保存、点评课堂练习小结与作业课堂小结图片超链接： 整张图片超链接（站内、站外） 图片热区超链接（用热点工具划分热区，站内、站外方法同上）本课作业本课教学后记（课堂设计理念，实际教学效果及改进设想）教研组长签字： 年 月 日20142015学年度第一学期网页制作课程电子教案 授课课题：锚记超链接 授课教师：蒋红艳 NO： 20授课班级14春微机、14春商务授课日期授课类型讲授、演示学 时 数2教学目标1、 理解锚记超链接的概念；2、 掌握锚记超链接的创建方法教学内容锚记超链接的创建方法重点难点锚记的理解、锚记位置的添加教学方法讲授、演示学习方法观察、练习教学过程设计备注（时间分配、个性修改等）教学步骤及主要内容一、复习文本超链接的创建图片超链接的创建二、范例展示 三、教师演示1、打开joke.html子页，把准备好的笑话文本导入进来，编辑排版好格式；2、把每则笑话的标题复制放到页眉位置；3、在每则笑话的正文处添加锚记；4、在每则笑话的结束处添加“返回”文字； 5、分别选择页眉处的笑话标题作为热区文字，把它与正文对应的笑话处的锚记建立链接；6、在页眉添加锚记，把每则笑话结束处的“返回”文字作为热区文本，与之建立链接。 课堂练习学生操作：用锚记超链接制作“校园笑话”子页。小结与作业课堂小结1、 锚记超链接的含义2、 锚记超链接的创建方法本课作业整理实训报告本课教学后记（课堂设计理念，实际教学效果及改进设想）教研组长签字： 年 月 日20142015学年度第一学期网页制作课程电子教案 授课课题：锚记超链接 授课教师：蒋红艳 NO： 21授课班级14春微机、14春商务授课日期授课类型上机实训课学 时 数2教学目标1、 理解锚记超链接的概念；2、 掌握锚记超链接的创建方法教学内容锚记超链接的创建方法重点难点锚记的理解、锚记位置的添加教学方法指导、检查学习方法观察、练习教学过程设计备注（时间分配、个性修改等）教学步骤及主要内容一、范例展示 二、分发文字素材三、学生实训 整理实训步骤，分发给学生，方便学生完成上机任务：1、打开joke.html子页，把准备好的笑话文本导入进来，编辑排版好格式；2、把每则笑话的标题复制放到页眉位置；3、在每则笑话的正文处添加锚记；4、在每则笑话的结束处添加“返回”文字； 5、分别选择页眉处的笑话标题作为热区文字，把它与正文对应的笑话处的锚记建立链接；6、在页眉添加锚记，把每则笑话结束处的“返回”文字作为热区文本，与之建立链接。 四、作业保存、点评课堂练习小结与作业课堂小结作业点评本课作业整理实训报告本课教学后记（课堂设计理念，实际教学效果及改进设想）教研组长签字： 年 月 日20142015学年度第一学期网页制作课程电子教案 授课课题：复习 授课教师：蒋红艳 NO： 22-23授课班级14春微机、14春商务授课日期授课类型上机实训课学 时 数4教学目标复习：创建站点、导航菜单、透明层、网页布局、超链接、CSS等操作教学内容复习本月所学知识点