新手入门——网站欣赏与创建网页
一、教材与学生分析?
该教学内容为清华大学出版社出版的《信息技术》初中二年级下册第一单元《初建网站》的第一节。本节主要内容为二部分:一是通过欣赏站点,使学生了解和掌握网页设计与网站制作的基本知识;二是使用记事本作为网页编辑工具来编辑HTML代码并生成网页。本课作为网站制作的起始课,应确保每个学生都有一个好的开始,这样才能激发学生学习网页制作的兴趣,为今后学习打下良好的基础。?
初二年级学生在学习网站制作之前已经接触过网站,浏览过各式各样的网页。有少数学生只是在信息技术课堂上接触过计算机,更没有条件接触网络。由于学生的操作水平悬殊很大,在教学过程中即要考虑操作生疏的学生的接受能力,又要保护操作熟练学生的学习积极性。?
二、教学目标?
知识与技能:掌握浏览网页的方法;掌握互联网、网站、网页、首页等术语的含义,以及它们之间的关系;学会使用记事本作为网页编辑工具来编辑HTML代码并生成网页。
过程与方法:通过让学生浏览并介绍他们感兴趣的优秀网站,让学生掌握浏览网页的方法。结合启发、设问、打比喻等方法,使学生尽可能地自己总结出相关知识。布置练习任务巩固所学知识与技能。?
情感态度与价值观:培养学生的自学探究能力、合作竞争意识和创新精神;引导学生正确地理解网络用途,充分地利用网络为学习服务。?
三、教学重难点?
重点:掌握互联网、网站、网页、首页等术语的含义,以及它们之间的关系。?
难点:学会使用记事本作为网页编辑工具来编辑HTML代码并生成网页。?
四、?教学过程?
(一)、激发兴趣,导入课题?
师:你们最喜欢的在线小游戏是什么,最喜欢的游戏网站是什么??有好几个平时比较活跃的学生把手高高的举起来了,还有好几个已经在流利的说初他们喜欢的网站。甚至还有两个学生在为哪一个网站更好玩争论起来。?
师:请那个手举得最高的同学告诉我.?生:?4399?
师:你能把这个网站打开给大家看一下吗??用电子教室软件选择学生演示。学生很熟练的打开了该游戏网站。但在打开网页的时候有几个活跃的学生在议论。?
师:我来猜猜你们在说什么?是不是还有其他的浏览网页的方法呢??生1:可以在百度搜,然后点击需要的网页就可以了。?生2:还可以用导航网页直接点击打开。?
师:非常棒!这节课我们通过欣赏网站,来了解一些网页设计和网站制作的基本知识。?设计意图:通过小游戏网站讲解浏览网页的方法,吸引所有学生的注意力,从而提高了学习兴趣。如果不讲解打开网页的方法,会有一部分学生产生疑问,但是如果由老师演示,基础好的学生会因为太简单而失去学习动力,所以我选择让学生演示。这样安排既照顾到不经常接触网络的学生,又给操作熟练地学生一个展示自己的机会。?
(二)、自主探究,形象概括?
师:现在请大家打开IE浏览器,浏览“学生科技网”,(网址书上有)?
学生很快按照书上的网址,打开了“学生科技网”,并且不停地点击鼠标浏览网页上的信息。?
师:我听到大家点击鼠标的声音,看得出来大家都看得很仔细。老师经常可以听到你们议论互联网、网站、网页、首页,他们的含义是什么?不太清楚的可以在网上查一下,注意他们之间的联系与区别。?
在学生查找信息的时候,教师迅速把这几个术语写到黑板上。?师:查到的同学能用简短的语句概括一下吗???
生1:互联网是全球范围内的计算机互联网络,?是一个巨大的信息资源宝库。?
生2:互联网上我们能看到的一个页面就叫做网页。?
生3:?许多相互关联的网页构成了网站。??
生4:首页是进入网站看到的第一个网页,是网站的门面。??
师:网页由哪些元素组成??
生1:网页主要有文本、?图像。?生2:动画,音频、视频?生3:表格?
师:?小组讨论互联网、网站、网页、首页之间有怎样的关系?能不能用比喻的方式说出他们之间的关系?请各个小组长来概括。?
各小组经过讨论,说出了各自的看法,但都只概括了两个或三个。?师:谁能结合各小组形象的小比喻,概括一下他们之间的关系??
生:我把“互联网”比作大商场,进了商场才能购物。把“网站”比作商场里的店铺,把“网页”比作店铺里的柜台,把首页比作店铺华丽的门面。?
同学们给予这位同学非常热烈的掌声。?
设计意图:?
让学生借助网络自主学习,能调动学生的学习积极性,让所有的学生参与到学习中。把抽象的理论用简单的语言概括后,再让学生用比喻的方法来理解互联网、网站、网页、首页之间有怎样的关系,这样使深奥的理论知识变得通俗易懂。?
(三)我的第一个网页?
师:在互联网上我们看到大量制作精美、功能强大的网站。这么多网站,有没有一个网页真正属于你自己??
生:没有。?
师:同学们想不想有一个真正属于自己的网页呢??生:想!?
学生有些兴奋,下面有一点议论声。?师:今天我们就用最简单的记事本来制作出你的第一个网页。小学就学过记事本吧?请一个同学来告诉大家如何启动记事本。?
生:“开始”“ 程序”??“附件”???“记事本”?
师:非常棒!大家现在启动记事本。有问题的同学可以请小组长帮忙。?学生很快都启动了记事本。?
师:接下来复制并粘贴HTML代码然后保存文档扩展名为.html.用浏览器查看!同学们发现了什么?
师:接下来我把代码发给大家你们来看看会发生什么??教师用电子教室软件把录入好的代码分发给学生。?不到两分钟的时间就有同学做好了。?
师:请同学们用热烈的掌声鼓励我们班的前十名!?师:大家看到了些什么??
生:我看到了欢迎光临我的主页,这是我第一次做主页。?师:大家好不好奇这是怎样生成的呢??生:想?
师:那我们就来一起认识认识html这位新朋友!?
设计意图:因为我的学生基础比较差让其自行录入代码对他们而言比较困难费时费力,这样会使其失去兴趣,所以我选择直接让学生复制粘贴代码即可,让后教学生去读代码,初步认识HTML语言的结构。能为接下来修改代码部分的学习做好铺垫。?
(四)、推波助澜,拓展延伸?
教师演示作比较,引导学生思考扩展名对文件的影响,既包括其对文件图标的影响,也包括调用应用程序的影响,并引出HTML语言
师:刚才大家录入的代码就是HTML语言,它一直被用作WWW的信息表示语言。请同学们仔细观察你们的代码,?HTML语言有什么特点?
生:都是“成对”出现的。?
有的学生在笑。师:对,那几个“成对”出现的代码叫标签。每个标签的含义都不一样,对照你的网页,大家能不能猜出这些标签的含义?
现在因为代码都相同,所以大家的网页都是一样的。是不是觉得这个网页不是完全属于自己?大家试着通过修改、添加、删除代码,让自己的第一个网页和别人的都不同。?
设计意图:教师的对代码进行讲解,引导学生理解标签的含义及其与属性值的对应关系。如果直接让其修改,大部分学生会不理解,而降低了学习的积极性。这同时是对课本“创作天地”板块中的练习。?
在修改代码的时候,我听到有学生在问旁边同学“粉色的英文单词怎么写?”。?师:单词不会写了?上网查啊??
设计意图:原本我已经在网上查好了各种颜色的英文单词,可以直接分发给学生,但我想趁此机会引导他们正确认识网络的用途,并充分地利用网络为学习服务。?
五分钟过后,有改字体颜色的、有添加文字的、有改变字体的,同学们的网页都各有不同。?
师:下面请各小组成员看一下本组成员是如何修改的,以便借鉴修改。?在小组分享制作成果的过程中,课堂气氛特别活跃。?师:请同学们保存并提交你的第一个网页。?
在作业上传的过程中,教师挑出几个比较有代表性的网页,请学生为大家讲解HTML标签的含义(教师稍作补充即可)。?
设计意图:本课是学生第一次上传网页,因此要着力培养学生养成在保存网页至本地磁盘,然后将文件提交到教师机的习惯。这不仅便于教师评价,更便于学生之间互评。学生可以通过比较作品体验创造的快乐并且反思自身作品,迸发灵感,二次创作,这样在整个班级中将会产生更多的富有创意的优秀作品。?
五、教学反思?
?(一)、与曾经的课堂作比较?
曾经因为总是顾虑有一部分学生基础不好,我又想让每一个学生都能有一个好的开始,所以我选择以面面俱到教师演示的方式上过本节课。一堂课下来,基础好的学生,在不停地做小动作。特别是HTML代码部分,我准备了课件,详细列举了各标签的含义,认真讲解标签的含义及其与属性值的对应关系。一节课下来,我感觉非常累,而且教学效果不太理想。?
这次的教学我几乎没有进行演示讲解,让学生充分利用已经具备的技能去尝试解决新问题,结合启发、设问、打比方等方法,使学生尽可能地自己总结出相关知识,给学生提供创造的空间,从而变被动学习为主动探究。利用学生演示和拓展延伸部分实施分层教学,让部分基础较好的学生在完成基本任务之后也能有事可做,给学生创造展示和提高自己的空间。
学生在课堂上配合默契,课堂气氛比较活跃,学生参与的积极性非常高,我感觉很轻松就达到了预期的教学目标。?
(二)、创新之处?
1、用游戏网站导入课题?
通过小游戏网站讲解浏览网页的方法,吸引了所有学生的注意力,并且提高了学生学习兴趣。用小游戏做“诱饵”,如果哪组表现得好,进行奖励。?
2、让学生利用网络自学?
通在概括基本概念和查找颜色英文单词环节中,课前我已经整理好了相关资料,可以直接“把食物端给学生”但对学生而言,直接“端上来的食物”,没有自己“寻找到的食物”有诱惑力,所以我引导学生使用网络自己查找,趁此机会引导他们正确认识网络的用途,并充分地利用网络为学习服务。?
(三)、意外收获?
本课堂实践使我体会到,学生的自学能力是无穷的。有时我们在课堂上没打算讲的小细节他们都能发现。例如本节课让部分学生讲解代码标签含义的时候,一个学生尽然提到了“
是一条直线”。所以在今后的教学中,我会尽可能多的给学生提供展示和提高自己的空间,相信每节课都会有意外收获。
课件10张PPT。第1课 新手入门——网站欣赏与创建网页1、网站欣赏问题1:同学们最喜欢的游戏是什么?问题2:你们是怎样找到它的?(学生演示并欣赏)打开浏览器,输入http://www.student.gov.cn/欣赏“学生科技网”思考:1、网站中有什么?
2、网页中都由什么构成?
2、网页设计与网站制作的基本知识1、因特网国际互联网即Internet,他是全球性的、最具影响力的计算机互联网络,也是世界范围的信息资源宝库。功能:电子邮件收发、信息查询、电子新闻浏览、文件传输、语音与图像通信服务等!2、浏览器浏览器是指可以显示网页服务器或者文件系统的HTML文件(标准通用标记语言的一个应用)内容,并让用户与这些文件交互的一种软件。3、网页与首页
进入网站看到的第一个页面称为该网站的首页。
网页是因特网的基本信息单位,主要由文本、图像、动画、表格等一些基本元素构成。
4、网站
许多网页的集合,网页以一定的顺序系统地链接起来就构成了一个网站。
内容形式不同分为:门户网站、职能网站、个人网站、专业网站。
3、我的第一个网页步骤:1、执行“开始”→“所有程序”→ “附 件”→“记事本”
2、复制并粘贴HTML代码。
3、保存文件。(位置:D盘 文件名:**.html)
4、用浏览器查看文档4、读一读认一认神奇的HTML语言!
5、课堂练习:(1)将文件first.html用记事本打开,将文档中的第8行进行修改:
第一组:大小为10、颜色为黄色、字体为隶书。将“我”字换成自己的姓名!
第二组:大小为15、颜色为黑色、字体为黑体。将“我”字换成自己的姓名!
第三组:大小为12、颜色为绿色、字体为仿宋。将“我”字换成自己的姓名!
第四组:大小为8、颜色为红色、字体为隶书。将“我”字换成自己的姓名!(同学可根据自己爱好改动第十一行)
(2)执行保存
(3)查看并将完成作品上交
6、课后总结:1、因特网
2、首页
3、网页
4、网站网页是在互联网上看到的单个页面,网页的集合就构成了网站,进入网站后看到的第一个网页通常称为该网站的首页。谢谢!