资源简介 班级网站建设教学设计 1教学目标 ⑴ 知识与技能:掌握在网页中表格、图片的使用方法,进一步体会表格所具有的实现网页布局的功能。 ⑵ 过程与方法:具有一定的观察、分析能力,能发现在美化网页过程中出现的问题,并通过实践学会解决问题。 能充分利用现有条件,主动查阅FrontPage 2000相关资料,进行自主学习。 ⑶ 情感态度与价值观:通过学习和实践,培养学生对网站建设的兴趣和主动探索精神。 通过与小组中其他同学密切配合,培养团队协作精神。 2学情分析 通过之前的教学活动可知,学生的掌握知识程度参差不齐,接受新知识的能力也有所不同。因此采用小组合作方式,照顾整个班级学生水平的差异,将不同层次的学生均匀地分散到各小组中,每组中由一位水平较高的学生担任组长,担当“小老师”角色,负责管理本组的学习探究活动,指导其他学生,共同完成学习任务,让不同层次的学生均有所收获。 3重点难点 重点:引导学生掌握网页布局与美化的常用方法,激发学生的求知欲。 难点:掌握使用表格进行网页布局时参数设置的方法与依据。 4教学过程 活动1【导入】学前评价 1、以下表述正确的是 A、网站是由一些互相关联的网页构成的,构成网站的网页地位是相等的。 B、建设网站,只能通过FrontPage 2000 来实现。 C、图片作为网页的元素,是作用是对相应的文字作补充说明、增加页面的美感。 D、在FrontPage 2000中,使用框架网页模板创建的主页,不能调整各个框架的大小。 2、合理、美观的网页布局,能给网页增加的美感,增强网页对受众的吸引力,增强信息交流的效力。关于网页布局,以下说法正确的有 A、使用框架,可以把浏览器窗口分割成不同的区域(框架),每个区域,每个区域(框架)可显示一个独立的网页,从而实现布局。 B、使用表格布局,可以对网页元素进行更加合理、精确的布局。 C、网页中使用图片即可实现对网页元素进行布局。 D、查看网页的源代码,如果网页使用了框架,则源代码中可搜索到特征字符串“【设计意图】通过评价来确定学生已经具备的基本素质,了解学生是否具备直接学习本节内容应该具备的最低知识和技能,给本节课教学提供参考。 活动2【导入】创设情境 回想我们曾经登录过的网站,其网页布局很多都是设计精美,使人赏心悦目。现在请大家登录林口县第四中学网站,进入“学校概览”页面,观察其图片与文字等网页元素的布局,想一想,这是如何实现的。【出处:21教育名师】 林口县第四中学http://www.lkxsz.com/com/index/index.jsp 学校概览页面http://www.lkxsz.com/com/schoolInfo/schoolInfo.jsp (登录信息技术课堂辅助网站,点击“导学”页面中给出的网址链接。) 欣赏此网页中运用的表格布局、图片美化的方法,引入本节课主题。 活动3【活动】下达任务 1、先请学生阅读教材119页任务三的提示板,理解表格布局的特点。 2、演示教材配套光盘提供的“我爱我校”网站,观察其主页及各个框架网页top1.htm、top2.htm、top3.htm,对所要实现的任务目标有所了解。 3、浏览网站路径下的图片文件,对图片文件名对应的文件内容有所了解。 图片文件名 宽度 (像素) 高度 (像素) 图片用途 活动4【活动】探究任务 分为两大步骤; 1、参照教材提示,由学生独立完成任务三的第1步和第2步,即top1.htm和top2.htm页面的制作。 2、参照教材提示,完成任务三的第3步至第5步,即制作二级子页、top3.htm页面的制作及框架高度的调整。 学生活动:学生分组,由组长负责,实现小组内协作学习,给基础较差的学生提供必要的协助。 教师活动:跟踪巡视学生完成操作任务的过程,针对发现的问题及时给予必要的提示,避免学生走不必要的弯路,提高课堂学习效率。 引导学生思考:在表格中插入图片时,图片的大小与表格的尺寸之间有什么联系?让学生知道表格尺寸是依照图片来设置的,图片大小按照网页需求而是事先精心设计的。 检查学生阶段作业,分析完成情况。 活动5【活动】组内讨论 ⑴ 在top1.htm中,表格第3行的宽度和高度是如何确定的? 提示(可选):注意使用的图像文件尺寸。 引导学生探究,尝试改变单元格宽度和高度来观察实际效果,从而得出明确的结论,进一步明确美化网页过程中,作为背景图片的大小与表格的尺寸之间的关系。 ⑵ 表格第3行指定了宽度和高度,为什么第1、2行没有指定宽度和高度? 引导学生发现其不同之处,通过探究得出如下结论:图片文件作为单元格背景,要求对单元格宽度和高度与图片尺寸一致,否则影响美观;单元格中插入图片,在不指定单元格宽度和高度的情况下,则单元格宽度和高度自适应于图片尺寸。 ⑶ 表格第1、2行是插入图片,第3行是将图片作为背景图片,这两种方式可互换吗?为什么? 引导学生发现其不同之处,通过探究得出结论。插入图片充满单元格后,不能在图片上重叠输入文本或嵌套表格所以,第三行必须将图片作为背景使用。 ⑷ (备选)表格第2行依次插入的3个图片文件Tm1.gif、Tm2.gif和Tm3.gif实际组成了一个完整的图,为什么不使用一个图片文件来呈现?这样作有什么有利之处? 引导学生使用Internet来探寻答案,解决问题。 ⑸(备选)如果将第二行的图片变为背景图片,该怎样做? 活动6【活动】组内交流 将尝试过程中的收获,包括解决问题的途径、方法、技巧进行组内交流;将尝试过程中的收获中遇到的问题与困惑进行组内交流,寻求解决问题的方法。 活动7【活动】成果展示 展示default.HTM主页的整体效果,进行自评、组内互评、教师点评。 对于完成效果不理想的学生,找出闪光点给予激励。 展开更多...... 收起↑ 资源预览