第十二课 制作网站首页和框架 教案

文档属性

名称 第十二课 制作网站首页和框架 教案
格式 zip
文件大小 1.1MB
资源类型 教案
版本资源 川教版
科目 信息技术(信息科技)
更新时间 2018-11-13 16:09:08

图片预览

文档简介

第十二课 制作网站首页和框架(六上)
一、教学内容分析
  本课是四川省教育科学研究所编制的川版信息技术六年级上册的《第十二课 制作网站首页和框架》,内容主要分为两大块,一是认识网页编辑器FrontPage(理论部分),二是制作网站首页框架并加以美化(动手操作)。理论联系实际,动静结合,操作性强,对学生的动手能力要求较高。本课内容在全书中属于六年级上的重点,结构上处于“制作网站”单元(11——15课)中的第二课,是承上启下的一课,又是正式学习FrontPage软件的第一课,地位十分重要。
二、学生情况分析
本课教学对象是六年级的学生,在小学阶段是最高年级,在学校是大哥哥、大姐姐,有一定的思想,在一定程度上有竞争意识,大多数学生自尊心较强。经过三年多的学习,学生对信息技术这门学科并不陌生,已初步懂得了一些关于计算机的基础知识,能较熟练的进行计算机的键盘、鼠标操作。普遍对上信息技术课感兴趣,但两极分化非常严重,优生有一定自主学习能力,中等生在纪律约束下能跟上老师的步伐,差生已掉队,兴趣不在学习上,而是在打游戏。由于每周只有一节课,学生的遗忘性大。
三、教学目标
1、知识与技能
①理解个人网站首页的基本构成要素。
②了解制作网页的常用软件,认识FrontPage2003的界面各部分名称、按钮作用。
③掌握网页文本编辑和图片插入以及背景的设置方法,学会保存主页文件。
④理论联系实际,培养学生探究和动手的能力。
2、过程与方法
①首先让学生欣赏一些漂亮、有个性特色的首页,激发起学习兴趣。
②然后教师介绍网页制作工具FrontPage,让学生自主探究认识FrontPage的界面。
③本课教学以任务驱动为主线串起来,层层递进,让学生通过参考教材,小组互助学习,教师适当讲解点拨,自主学会知识与技能,实现首页的制作。
④通过展示、交流,大家对各组作品进行互评,找出优缺点。
3、情感、态度、价值观
①培养学生的审美能力和创造能力,在动手操作中能感悟美,甚至设计美。
②在小组合作学习中,培养学生的团队精神。
③培养学生爱四川、爱家乡,进而爱祖国,长大为国家做贡献的爱国主义思想。
四、重点难点
教学重点:1、理解个人网站的基本构成要素和网页框架布局。
2、学习FrontPage2003制作网页的一般方法(重点是文本格式、图片、背景)。
教学难点:
1、首页的艺术性与个性布局,色彩的搭配。
2、图片的插入和背景的设置。
五、教学方法
讲授法、观察法、自主探究、任务驱动、小组合作
六、教学准备:
多媒体网络教室、局域网、网络教室广播系统、教学PPT课件、学生机D盘上网站文件夹中上节课搜集到并处理好的制作个人网站所需的文本素材和图片素材,桌面上作为例子的一个简单网站首页。
七、教学过程
教学
环节
教 师 活 动
学生学
习活动
设计意图
导入
同学们,请大家打开书P86页,告诉老师今天我们这堂课要学习的是什么?
不错,回答正确。
下面我们先来欣赏两个优秀个人网站的首页
雨后池塘 http://www.yuhou.com/
花蝶谷 http://www.pqshow.com/student/
好看吗?
经过本课的学习,相信大家也会做出好看的个人网站首页。
翻书、看书
回答问题
第十二课 制作网站首页和框架
欣赏
感受美
好看
回答问题
充分利用教材,让学生说出课题以加深印象,知道学习内容。
激发学生的兴趣,调动起积极性。
鼓励学生
学习新知

环节(一)了解网页制作常用软件
你知道有哪些软件可以用来制作网页吗?
完成教材P86的表格填空
补充:很多字处理软件都可以设计网页,如word中,利用“另存为web页”就可以将文档保存为网页,有些图像处理软件如PhotoShop也可以制作网页,windows“记事本”也可以制作网页……
不过FrontPage和Dreamweaver却是最方便的网页制作软件,因为它们不仅可以制作网页,而且能方便地设计和管理网站,很适合入门学习。
这堂课我们就学习用FrontPage2003制作网站的首页。
环节(二)自主学习,认识FrontPage界面
一、布置任务
任务一:1、打开FrontPage2003
    2、试探FrontPage网页编辑器窗口界面上各部分的名称,了解各按钮的作用,并与Word对比。
    3、打开一个已经做好的网页,试探一下三种编辑视图模式按钮的效果。(教师事先下载一个简单的网站首页发送给学生,让学生自主操作)
二、交流问题
  1、请一个学生上教师机向全班演示打开FrontPage的方法
  2、师生问答,抽1个小组代表报告探究结果。教师课件展示FrontPage界面并辅助说明。重点指出新建、保存、插入、预览等菜单或按钮的位置和功能。
三、小结
  1、在桌面或开始——程序——Microsoft Office中找到FrontPage图标鼠标双击打开
  2、各部分的名称和Word基本一样,因为它们都是微软公司出品的Office软件大家庭的一员。鼠标放在各按钮上停留一下会显示出名称用法。
  3、设计视图适合初学者,代码视图适合专业人员,预览视图可看到我们制作的网页在浏览器中的显示效果。
环节(三)网站首页必备内容和框架布局
一般网站的首页既是封面,也兼作目录。
制作前一定要考虑好网页的整体布局和内容,个人网页的布局就像用Word办电子小报一样,没有固定的格式,
完全可以由我们自己大胆地进行设计。
下面我们来看一些首页设计的典型布局
课件出示
扬州凤凰岛
http://www.yzfhd.com/
杭州青年旅舍
http://www.517xbl.com/
艾艾在线
http://www.pqshow.com/cool/7910.html
人生驿站
http://www.cco8.com/
结合你看到的优秀个人网站首页或书上P88的内容,说说网站首页应当包含哪些主要内容?
应包括网站名称、主要栏目、主题介绍、作者姓名等内容。
你能用一个字形象地描述以上网站首页的布局吗?
常见的网页布局有“厂”字型、“口”字型、川”字形、“同”字型、“三”字型、“T”字型、“国”字型、“匡”字型、Flash动画型、标题与文本型、海报型……
等等。
教学过渡:
你准备选择哪一种布局方式来设计自己的首页?
环节(四)制作网站首页框架
一、布置任务
任务二:1、新建一个网页,在空白位置打字输入文本或将D盘上网站文件夹中上节课搜集到的首页文本素材用复制+粘贴的方法输入进来(基本要素不能少)
    2、仿照Word的操作,利用格式栏中的工具按钮设置文字效果,鼓励学生在设计时要展示
出自己的个性。
3、保存主页文件 首页应保存为index.htm或default.htm,保存的位置是上节课所规划的D盘网站文件夹。
    4、“预览”效果
二、交流讨论
  1、请一个学生上教师机演示如何改变文字默认效果
2、请一个学生演示怎样看自己的主页在IE浏览器中的效果。
3、利用网络教室广播系统展示一个小组的成果,大家进行点评。
三、小结
1、新建网页文件和改变文字效果都和Word中的操作一样
2、主页文件名和保存位置的文件夹名都应是英文或汉语拼音。
3、看“预览”效果可以用编辑模式工具栏中的点击“预览”按钮方法,还可以进入保存文件的文件夹,直接打开保存的主页文件。
环节(四)美化主页
教学过渡:
刚才大家做的网页色彩单一,而且只有文字,显得很单调,不太美观,怎样才能把我们做的网页打扮得漂亮一点呢?
常用的美化方式有添加背景、插入图片等。
一、布置任务
任务三:1、给网页加上合适的背景颜色
2、插入D盘网站文件夹中上节课收集到并处理后的图片素材,注意大小位置。
    3、保存并“预览”效果
二、交流讨论
1、请两个学生上教师机分别演示改变背景颜色和插入来自文件中的图片的操作方法
2、除了以上两种方法,要让网页更美观,还可以做哪些修饰?
三、小结
1、主页改背景颜色和插入来自文件中的图片的操作方法和Word中的操作差不多
2、格式——背景选项中还可以对网页进行添加背景图片、边框、插入背景音乐的操作
3、主页的其它美化方法有插入剪贴画、艺术字、自选图形、Flash影片等
  4、操作完成一定要记得保存
看书
找答案
回答问题
FrontPage
动笔填空
完成任务
自主探究
小组内互相小声交流、讨论
观看演示思考
判断对错
观看
倾听
倾听
观察
倾听
观看演示
欣赏美
思考
看书
回答问题
构思
看书
探究
动手操作
完成任务
小组内互相帮助
演示
观察
讨论
发表意见
倾听
看书
思考
回答问题
倾听
看书
自主探究
小组合作
完成任务
演示
观察
思考
讨论
回答问题
倾听
通过阅读教材解决问题,养成自主看书学习的好习惯
开拓学生的眼界
联系旧知识,让学生学会举一反三。
再现实践过程
解决问题
总结并概括知识点,为后面的学习打基础
提醒学生注意
打开学生思路
一问一答突破重难点
适当拓展
任务二是任务一认识FrontPage基础上的具体操作实践
通过具体任务的驱动让学生一步步搭建起首页框架
小组合作关注个体差异,培养团队精神。
再现实践过程
发挥小老师的作用
让差生跟上来
取长补短
概括知识点,加深学生理解。
抛出问题
寻找解决方案
任务三是在任务二基础上的深化
通过完成此任务,达到美化主页的效果
再现实践过程
发挥小老师的作用
让差生跟上来
不拘泥于课本知识
适当拓展
养成好习惯
作品展示
评价
选择二份小组作品进行全班集体展示、评价
其余作品组内互评
标准:
1、栏目分配和布局  25分
2、文字内容及效果  25分
3、背景色彩搭配   25分
4、图片使用情况   25分
85分以上优
70分以上良
60分以上及格
60分以下不及格
讨论
评价
师生共同学习
取长补短
提高学生评价和审美能力
总结
同学们,今天我们自己动手制作了一个首页,是不是很有成就感。其实制作网页的步骤很简单,先设计框架布局,再输入文字、插入图片,接着运用各种方法进行美化,最后保存。你都学会了吗?我们的家乡四川还不错吧?等你们长大后,建设美丽繁荣和谐四川的重任就要靠你们来实现,所以现在要好好学习哟。
倾听
思考
梳理要点
构建知识体系
进行情感教育
课外作业
上网寻找、欣赏优秀个人网站主页,仿照其风格制作一个介绍攀枝花的特色或反映学校、班级情况的主页。
浏览
搜集素材
动手制作
巩固知识,培养自学、探究能力
教学反思
总体感觉一堂课要完成以上内容时间上有点紧,如果是一节半课比较合适。网页布局这个内容教材上没有,又不能不讲,只能点到为止,不便展开。教案设计了以小组合作形式优生带差生,但在实际操作中恐怕有些差生还是难以完成作业任务。整体教学偏重于知识技能目标,在情感目标的达成上只是一笔带过,这一方面是时间的关系,另一方面也是大多数信息技术课的通病。
专家点评:
本课是学习“制作网站首页和框架”,内容包括认识网页编辑器FrontPage以及使用FrontPage软件来完成网站首页建设以及首页框架的构建。既要让学生认识、学习一种新软件,又要让学习学会用该软件完成首页的制作,教学任务重,学生学习起来有一定难度。
本课先从课题引入本课学习的目标,再通过学生对两个优秀个人网站的首页的欣赏,让学生对网站首页有一个直观的感性认识。逐步深入引导学生思考——制作网站首页所要用到的辅助软件有哪些?通过老师引导:得出FrontPage和Dreamweaver是较为方便的网页制作软件,因为它们不仅可以制作网页,而且能方便地设计和管理网站,很适合入门学习,从而让学生明白为什么本课要首先学习通过FrontPage设计网页的目的所在。
为引导学生更好地学习新软件,教师通过观察比较、自主探究、任务驱动等方法,通过让学生自己动手对三种编辑视图模式按钮的效果进行比较、观察,使学生懂得了FrontPage款软件与微软公司的其它软件具有相通性,其设计视图更适合初学者,而代码视图则适合网页制作专业人员,这为后面的网站首页设计作好铺垫,并且打消了学生的畏难情绪。最后通过各种网站首页布局的展示,教师与学生互动,在互动中让学生认识了常用的网站首页布局。
在教学过程中,教师首先对一些重要环节比如文件的保存位置、首页文件的命名进行了着重提示。随后,通过一个个小任务方式,充分调动了学生的学习积极性,并且在每一个任务后都有拓展和加深,这对部分学习能力较强的学生具有很好的引领作用,有助于学生自主学习能力的培养。
本课的作品展示环节设计很好,非常适合该年龄段学生的特点,通过展示学生的优秀作品,能够激发起学生的学习兴趣和创作欲望。有一个小的建议,对于学生的作品最好不以分数形式呈现,特别是一些表现欠佳的作品,也应以鼓励为主,或用委婉的说法暗示。另外,在今后的课堂教学中要加强对学生小组间的合作探究进行引导,培养学生的团队合作能力。