教案
第1课登堂入室 认识frontpage
第2课蓝图设计个人网站规划
第3课花园之匙创建个人网站
第4课美景装饰修饰首页
第5课卡通世界设置共享边框
第6课幻影移形创建横幅广告
第6课幻影移形创建横幅广告
第8课联合演出整合栏目
第9课作文乐园插入导航栏
第10课美文赏析在网页中插入书签
第11课小小戏迷建网页做导航
第12课动人影音在网页中插入音频和视频文件
第13课闪客一族创建框架网页
第14课动感flash在网页中插入flash
第15课成果分享检测与发布网站
第1课登堂入室 认识frontpage 教案
(一)教学目标:
1、理解网站,网页,首页(主页),导航,超级链接等术语。
2、掌握frontpage的启动/退出,了解frontpage窗口的组成。
3、掌握在frontpage中插入文字和图片的方法,并会保存网页。
4、了解frontpage的三种网页模式,会预览制作好的网页。
(二)教学设计与教学建议:
1、课堂引入分析:
在学习本册教材前,学生已经能够熟练上网,对网络世界有着强烈的好奇心和浓厚的兴趣,对于学生来说,网络上那些精彩的网页具有神秘的色彩,学生想不到有一天自己也可以制作网页。针对这种情况,在课堂的引入部分,教师可以这样设计:
首先出示几个用frontpage软件制作的网页,请学生欣赏,让学生讨论这是怎样制作出来的。然后用frontpage软件打开其中的一个网页,让学生观察窗口,并说一说这个窗口与学习过的哪个软件相似。由于frontpage与word软件在界面的风格上和功能上有很多相似之处,因此学生很快能在这个窗口中找到熟悉的面孔。此时,教师可以告诉学生,这个软件叫frontpage,与学习过的word软件同属于office软件家族的成员,但它的主要功能是制作网页。由于学生在word软件中对插入文字,图片进行编辑排版的操作非常熟练,因此可以采用自主探究的学习方式让学生认识frontpage。教师可以给出制作网页的素材,让学生尝试在frontpage中输入文字,插入图片。让学生在学习这个软件的初始,自己去探索这两个软件的相同与不同。
2、重点内容分析:
在学习本课前,学生已经掌握word软件的使用,而本节课是初步认识frontpage软件,因此本节课可以把重点放在让学生通过已掌握的知识来初步分析frontpage与word的相同与不同,这样可以减少学生对学习新软件的陌生感,尽快熟悉新软件,降低学习的难度,同时也培养了学生自主学习的能力。
相同:常用工具栏与格式工具栏中的大部分工具都一样,编辑文字和图片的方法一样。
不同:与word软件相比,frontpage窗口多了视图栏;在编辑区左下角有三种网页模式;保存网页文件时,图片是采用嵌入式保存的,即同一个网页中的图片和文字被分开保存。
当然,word与frontpage的不同还有很多,对比两种软件的不同可以贯穿在整册教材的学习中。用对比的方法学习,会让学生知道,很多软件的一些操作都具有相同的地方,掌握这种学习方法,会提高学生自主学习的能力,对学习新知识起到事半功倍的效果。
3、归纳提高分析:
本节课涉及到的知识可以归纳为以下几点:
(1)理解网站,网页,首页(主页),导航,超级链接等术语。
(2)frontpage是一种制作网页的软件,由于它与word同属于office家族的成员,与word软件在许多地方相似,如编辑图文等,以及它具有所见既所得的特点,因此很容易被掌握。共
(3)掌握frontpage的启动/退出,了解frontpage窗口的组成。
(4)frontpage有三种不同的网页模式:普通,预览和html。在普通模式下可以编辑网页,在预览模式下可以预览网页效果,在html模式下可以看到网页的html代码。
(5)掌握在frontpage中插入文字和图片的操作,并会保存网页。需要注意的是,网站中的文件夹和网页的名称通常使用英文,汉语拼音来命名。
(三)教学补充:
1、到下面几个网站去欣赏一些精彩的网页。请你观察网站的首页,看看首页上一般都包含哪些信息。
东方少年kids.eastday.com
雏鹰网www.chinakids.net.cn
e童网www.chinaertong.com
毛毛先锋网www.maokids.com
儿童综合网www.61web.com
2、在word软件中,利用"文件"菜单中的"另存为web页…"命令也可以把文档直接保存成网页。可以让学生制作一个图文并茂的word文档,并尝试着把它保存成网页,并在"ie"浏览器中浏览这个网页。
3、在frontpage中插入"来自文件"的图片时,与word有些不同:
执行"插入"→"图片"→"来自文件…"命令,弹出"图片"对话框,在这个对话框中提供了四种获取图片的方式,从计算机上选择一个文件
使用web浏览器来选择网页或文件
打开剪贴画库,
插入剪贴画
通过照相机或扫描仪获取图片
第2课蓝图设计个人网站规划 教案
(一)本课教学目标:
1、根据自己站点的主题,会对自己的站点进行规划,设计。
2、会通过多种途径收集资料。
(二)教学设计与教学建议:
1、课堂引入分析:
请同学们欣赏几个网站的首页,并以学习小组为单位讨论首页一般包含哪些信息。由此引出要规划个人网站,需要从哪几方面入手。
规划个人网站,主要包括网站名称,网站栏目及主要内容,还要考虑应准备哪些素材,收集的素材一定要围绕网站的主题。
由于制作一个网站工程比较大,可以采用小组分工合作的方式进行。组内的同学共同商讨确定网站名称,结构,然后分工收集相关资料,并进行分类汇总。通过这种方式不但可以节省时间,还可以培养学生合作的能力。
2、重点内容分析:
本节课的重点可以分为两点:
(1)规划网站。对于学生来说,建设一个网站,是一件比较浩大的工程,要完成这个任务,学生会感觉到无从入手,不知道怎么做,因此本节课的重点之一是规划网站。通过规划网站,让学生了解制作网站的过程。
规划网站的过程是:确定网站名称——规划网站的结构——收集素材。网站的名称相当于网站的主题,网站中的所有内容都要围绕这个主题来设计,所以确定了名称,也就确定了网站的大方向。网站的结构指的是网站中的网页存在的层次关系。一个网站是由很多网页组成的,网页之间存在着层次关系:主页是最顶层,主页的下一层是网站的各个栏目,各栏目又能细分,构成第三层,甚至更多层,如下图所示。
在制作网站前画出如上图所示的网站结构图,不但可以帮助我们规划网站结构,使网站层次分明,条理清楚,还可以确定各个网页的内容,方便大家思考各网页之间的链接方式。
(2)收集素材并进行分类保存。规划好了网站的结构,也就确定各个网页的内容,此时可以根据网站的结构收集相关的素材。收集素材的方法有多种,可以利用素材光盘,数码相机拍摄,网上下载等方法获取文字,图片,视频,声音,动画等资料。由于需要收集的资料很多,为了便于管理这些资料,我们可以把它进行分类整理,放在不同的文件夹中。分类的方法有两种:可以根据网站的栏目创建文件夹,把与栏目相关的素材存放在这个文件夹中,如针对书中图2.1的"卡通世界","心语日记","小小戏迷","闪客一族","作文乐园","动感地带"等创建相应的文件夹;还可以根据素材的类型创建文件夹,如"文字","图片","视频","声音","动画"等。经过以上这些准备工作,就可以创建网站了。共
3、归纳提高分析:
本节课涉及到的知识可以归纳为以下几点:
(1)在创建网站前,一定要对网站的内容,结构等进行规划,并画出网站结构图,使网站层次分明,条理清楚,并确定各个网页的内容。
(2)根据网站的结构收集相关的素材,收集素材的途径有多种,可以利用素材光盘,数码相机拍摄,网上下载等方法获取文字,图片,视频,声音,动画等资料。
(3)为了便于管理收集到的素材,我们可以把它进行分类整理,放在不同的文件夹中。分类的方法有两种,一是根据网站的栏目创建文件夹,二是根据素材的类型创建文件夹。
(三)教学补充:
1、看看在第1课教学补充提供的网站中都包含哪些信息,并试着列出这些网站的结构,最多有几层。
2、请规划设计自己的网站,并画出网站结构图。
3、根据网站结构收集相关的资料,并建立文件夹,将收集到的资料进行分类保存。
4、收集到的资料可以根据需要进行适当的修改。如获取的文字资料,可以在word软件中进行编辑修改;获取的图片资料可以用windows操作系统自带的画图软件进行修改,也可以用photoshop等专业绘图软件进行修改,加工;获取的声音资料,可以用windows操作系统自带的录音机进行修改,或用超级音频解霸等专业处理声音的软件进行修改;获取的视频资料可以用超级解霸,绘声绘影等软件进行加工处理。
第3课花园之匙创建个人网站
(一)本课教学目标:
1、理解网站站点的概念,掌握创建站点的操作。
2、会用表格规划网页的版面。
3、会在表格中插入文字和图片,会设置单元格中的文字格式,会设置文字和图片在单元格中的对齐方式。
4、会保存网页,并将网页中的图片保存到images文件夹中。
5、培养学生自学与合作学习的能力。
(二)教学设计与教学建议:
1、课堂引入分析:
创建站点对于学生来说并不是难点,如何规划网页的版面,对于学生来说难度更大。因此在课堂引入部分,可以这样设计:
首先教师可以准备两个内容一样的网页,一个是没有用表格规划版面的,一个是用表格规划版面的,让学生观察预览效果,比较哪一个更好;
其次,将制作这个网页的素材提供给学生,让学生自己尝试制作这样一个网页。学生在制作过程中会发现图文并不能按照自己的意愿随心所欲地摆在网页上,使得网页看起来很糟糕。随之会产生疑问:那个版面漂亮的网页是怎么做出来的
第三,教师再次出示利用表格规划版面的网页,动态出现表格线,让学生观察,学生就会看出版面是由表格规划的。而表格是学生在word软件中就已经学习过的,此时再让学生尝试在frontpage中插入表格,并在单元格中插入文字和图片。
由于学生在word软件中学习过表格的操作,对插入表格,设置单元格的格式操作比较熟悉,因此这部分可以采用让学生自主探究的方式学习。_
2、重点内容分析:
本节课的重点可以归纳为:
(1)创建网站站点:
在frontpage中提供了8种站点类型,我们可以根据需要选择不同的类型。需要注意的是,在"指定新站点的位置"框中,需要输入站点的位置和名称,如输入"d:\web","d:"表示位置在"d盘"上,"web"表示站点的名称,位置和名称之间用"\"隔开,不要错输入成"/"。
(2)用表格规划网页的版面:
创建站点对于学生来说是重点,但不是难点。如何规划网页的版面,对于学生来说难度更大。因此本节课的难点放在如何规划网页的版面上。共
可以应用表格很好地控制文字和图像在页面上出现的位置,把文字和图像规范地按照行或列对齐,使整个页面看上去紧凑而统一,非常美观大方。而表格对于学生来说并不陌生,在word软件中已经学习过,这就使学生感觉到制作网页的难度大大降低了。
尽管用frontpage制作网页对于学生来说是全新的知识,但由于frontpage与word同属于office家族的成员,在许多功能上有太多的相似之处,我们可以在这实行"拿来主义",把在word中学习到的表格知识拿到frontpage中,如插入表格,插入或删除行或列,合并或拆分单元格,设置行高或列宽,在单元格中插入文字或图片,设置单元格中文字或图片的对齐方式,对单元格中的文字设置字体,字号,字的颜色等操作,这体现了知识的迁移思想。
3、归纳提高分析:
本节课涉及到的知识可以归纳为以下几点:
(1)创建网站站点,选择"只有一个网页的站点"类型。
(2)通过"文件夹列表"打开要编辑的网页,了解网站的建设情况。
(3)用表格来规划网页的版面。根据网站结构对插入的表格进行拆分,合并单元格,设置行高,列宽,插入或删除行,列等。
(4)在单元格中插入文字和图片,设置单元格中的文字或图片的对齐方式,设置文字的字体,字号,颜色等。
(5)在frontpage中,当网页包含图像元素时,这样的网页被保存时,图片是采用嵌入式保存的,即同一个网页中的图像和文字被分开保存。通常要将所有的图片保存在images文件夹中,这样有助于使站点的结构更加清晰,便于管理。
(三)教学补充:
1、什么叫网站站点:
创建网站站点的操作并不难,难的是学生对于"网站站点"这个概念不理解。什么是网站站点网站站点就是一组内容相关的网页的集合体。打个形象的比喻,站点就象一本书,而网页就象书中的一篇一篇的文章。书把文章集中在一起,而站点把网页集中在一起。
2、文件夹列表:
创建站点之后,会在frontpage窗口出现一个新的列表框,叫做"文件夹列表",用来显示当前打开的站点中所有的文件和文件夹。通过"文件夹列表"框,我们可以清楚了解网站的建设情况。也可以利用文件夹列表为站点添加新的网页。单击〖常用〗工具栏上的〖文件夹列表〗按钮可以打开或关闭"文件夹列表"框。
3、在frontpage中插入表格与在word中插入表格,有些不同,如下图所示。
在word软件中插入表格
在frontpage软件中插入表格
在frontpage中,由于表格主要是为规划网页版面服务的,所以与word相比主要有以下几点不同:
(1)在插入表格对话框中,增加了"边框粗细"的设置。为了让用表格规划过的网页版面看起来更加美观,可以把"边框粗细"的值设置为"0",将表格的边框线隐藏起来。
(2)通常在指定宽度时,选用"百分比",并将值设置为"100",表示表格与页面同宽。
(3)可以调整"单元格边距"和"单元格间距"。
4、在制作网页时,要插入的素材图片很多,有些图片可以直接使用,有些图片则需要进行一些处理。在frontpage中的"图片"工具栏可以对插入的图片进行简单的处理,在word软件中也有类似的"图片"工具栏。对比两者的"图片"工具栏,我们会发现frontpage中的"图片"工具栏在处理图片上功能更强。
frontpage的"图片"工具栏
word的"图片"工具栏
第4课美景装饰修饰首页共
(一)本课教学目标:
1、能够打开保存的站点。
2、能够为网页设置背景颜色或背景图片,并为网页添加背景音乐。
3、能够在网页中插入组件,如滚动字幕和悬停按钮。
4、培养学生自学能力和小组合作学习意识。
(二)教学设计与教学建议:
1、课堂引入分析:
制作好的网页看起来整齐多了,但白色的背景使得网页看起来不太美观,静止的页面让网页的视觉效果不够吸引人。本节课的主要任务就是美化网页。因此在课堂的引入部分可以这样设计:
首先,教师可以让学生打开第3课制作的主页,想办法让自己的主页更漂亮。这个环节可以采用小组合作共同探究的学习方式,然后让做得漂亮的小组汇报探究学习的成果。
其次,教师出示一个带有"滚动字幕"和"悬停按钮"的网页,让学生观察,并说一说与自己制作的网页相比有哪些优点。讨论在生活中是否见过这样的效果。
学习在网页中插入"滚动字幕"和"悬停按钮",学生可参考教材或教师提供的学习资料进行自主学习,如果自学有困难也可采用小组合作的方式进行学习。这样可以兼顾到对知识技能掌握不同程度的学生,同时也体现了学生在课堂教学中得主体地位。
2、重点内容分析:
本节课的重点是美化网页,为网页添加背景颜色,背景图片或背景声音,插入滚动字幕和悬停按钮,让网页在视觉和听觉上更具冲击力。
让学生想办法使自己的主页更漂亮。在完成这个任务中,学生可能会想到用以下这些手段来美化网页:
(1)设置字体,字号,字的颜色。
(2)插入艺术字。
(3)为网页添加背景颜色或背景图片。
(4)设置表格的边框和底纹。
(5)设置单元格的边框和底纹。
为网页添加背景颜色和图片,与在word或powerpoint中的操作相似,因此只要告诉学生是在"网页属性"对话框中进行设置就可以了,让学生自己尝试做。本节课的难点放在插入滚动字幕和悬停按钮上。
在生活和学习中,学生经常在公交车,地铁,火车站,机场,银行,商场等地方看到"滚动字幕"。"悬停按钮"这种效果也很常见,如使用各种软件时,当鼠标指向工具按钮时,按钮的颜色会发生变化。当学生理解了什么是"滚动字幕"和"悬停按钮"之后,操作起来也就变得容易了。
3、归纳提高分析:
本节课涉及到的知识可以归纳为以下几点:
(1)打开保存的站点。
(2)插入组件——字幕和悬停按钮,可以使网页具有动态效果,网页更加生动。
(3)为网页添加背景颜色,背景图片或背景声音,可以增加网页的视觉和听觉效果。
需要注意的是:
(1)要想浏览网页经过修饰的效果,一定要先保存网页,再预览。
(2)字幕和悬停按钮的效果在"普通"网页模式下是看不到,在"预览"网页模式下可以看到。
(三)教学补充:
1、在"网页属性"对话框中为网页设置背景,是针对整个网页进行设置的。而实际上我们在因特网上看到的许多精彩的网页,不同的内容会有不同的背景,这是怎么做出来的呢其实非常简单,带有不同背景的网页是用表格规划的,每一个单元格都是一个独立的部分,只要选好单元格,设置单元格的底纹,就可以达到目的。效果如右图所示。
2、在网页中除了把文字做成悬停按钮外,还可以用图片制作悬停按钮,效果是鼠标悬停之前为一张图片,鼠标悬停之后换成另外一张图片。打开教材22页,按图4-8所示打开"悬停按钮属性"对话框,然后按下图所示操作:共
①单击"自定义"
②单击"浏览"
④单击"确定"
③选择图片
第一次通过"浏览"插入的图片是鼠标悬停前要显示的图片。
⑤单击"浏览"
⑦单击"确定"
⑥选择图片
鼠标悬停前
鼠标悬停后
第二次通过"浏览"插入的图片是鼠标悬停后要显示的图片
第5课卡通世界设置共享边框
(一)本课教学目标:
1、利用"文件夹列表"为站点创建新的文件夹。
2、利用"文件夹列表"为站点添加新的网页,并将网页保存到站点中指定的文件夹里,会更改网页标题。
3、运用"共享边框"制作一组风格统一的网页。
(二)教学设计与教学建议:
1、课堂引入分析:
通过第1单元的学习,学生已经掌握了一般网页的制作过程,会用表格规划网页的版面,由于只制作了主页,所以还体会不到网页之间可以跳跃访问的神奇。本节课将围绕网站中的"卡通世界"栏目利用"共享边框"制作一组风格统一的网页。为了让学生理解什么是"共享边框",什么是"网页标题",在课堂的引入部分,教师可以这样设计:
首先,出示一组利用"共享边框"制作的风格统一的网页,让学生通过ie浏览器欣赏,在欣赏的过程中教师提出要求:
(1)在ie浏览器的窗口中,网页的文件名是什么在什么位置可以看到在标题栏上显示了什么通过显示的内容你能知道什么。
(2)观察这组网页的内容,说一说它们有什么特点:
其次,教师更改其中一个网页的"共享边框"部分,让学生观察其他几个网页有什么变化让学生通过讨论归纳出"共享边框"的特点。
教师小结"网页标题"和"共享边框"知识点。
理解了什么是"网页标题"和"共享边框",操作也就变得容易了。教师可以准备一些学习资料和素材,让学生通过自主学习或小组合作学习的方式来进行本节课的学习,在学生自学的过程中,让学生及时反馈学习成果,学生遇到的共性问题,可以让已经解决问题的学生通过多媒体演示操作过程(提倡),也可以是教师演示操作过程。
2、重点内容分析:
本节课的重点可以归纳为两点:
(1)更改网页标题:
对于新建的网页,默认的文件名为new_page_1。htm,在进行保存的时候,与word软件有所不同的是多了一项"网页标题",这是一个非常重要的知识点,如果学生弄不清楚什么是"网页标题",那么在后面制作网站的过程中就会出现站点结构混乱的现象。
由于站点中的网页一般都是用英文字母或数字命名的,因此通过网页文件名不能直观看出网页的内容,如果将"网页标题"改成中文,则能够更清晰地反映网页的内容。在浏览网页时,浏览器的地址栏显示的是网页的文件名,而在标题栏中则会直接显示出网页的中文名,这使得站点结构变得更为清晰,为今后网站的建设带来极大的便利。如下图所示。
网页标题
网页文件名
(2)设置"共享边框":
本节课围绕网站中的"卡通世界"栏目,学习了利用"共享边框"制作一组风格统一的网页。对于学生来说,理解"共享边框"的概念是重点,也是难点,解决了这个问题,设置"共享边框"也就变得容易了。"共享边框"实际是多个网页共享的区域,或者说是公共部分,可以放置任何对象,如文本,悬停按钮或图片等。使用"共享边框"的好处是,当站点中的网页非常多时,其中一个网页的"共享边框"部分被修改了,其他与之共享的网页会同时改变,这会大大减少修改网页的工作量。共
3、归纳提高分析:
本节课涉及到的知识可以归纳为以下几点:
(1)利用"文件夹列表"为站点创建新的文件夹,文件夹的名称用字母来表示。最好是自己能看得懂的,如ktsj是"卡通世界"汉语拼音的声母。
(2)利用"文件夹列表"为站点添加新的网页,将网页保存到站点中指定的文件夹里,文件名用字母表示,网页标题用中文表示。这样在今后浏览网页时,浏览器的标题栏会直接显示出中文名,便于识别网页的内容,也便于以后进行网页间的链接。
(3)运用"共享边框"可以制作一组风格统一的网页。"共享边框"是站点上由多个网页共享的区域,可以放置任何对象,如文本,悬停按钮或图片等。当"共享边框"被修改了,所有共享这个区域的网页就会同时改变。
(三)教学补充:
1、关于网页标题:
由于站点中的网页一般都是用英文字母或数字命名的,因此通过网页文件名不能直观看出网页的内容,如果将"网页标题"改成中文,则能够更清晰地反映网页的内容,如下图中,在"文件夹"视图中,我们可以清晰地看到,在ktsj文件夹中有5个网页,通过标题,就能知道每个网页的内容了。
"文件夹"视图
网页标题:
如果在保存网页时,忘了更改网页标题了,可以通过网页属性再更改网页标题,操作过程如下图所示。
①选取网页文件右击
②单击"属性"
③输入网页标题
④单击"确定"
2、将网页中的图片保存到指定的文件夹中:
网页中的图片默认的保存位置是站点文件夹下,如果要改变图片保存的位置,操作过程如下图所示。
3、共享边框:
"共享边框"是站点上由多个网页共享的区域,可以出现在网页的顶端(类似于页眉),底端(类似于页脚),左边或右边。
①单击"改变文件夹"
②选择保存的位置
③单击"确定"
第6课幻影移形创建横幅广告
(一)本课教学目标:
1、学会利用组件"横幅广告管理器"在网页中插入横幅广告。
2、学会在网页中插入水平线分割网页。
3、学会利用设置表格或单元格背景色的方法为网页添加背景。
4、学会为悬停按钮设置超级链接。
(二)教学设计与教学建议:
1、课堂引入分析:
通过前面的学习,学生已经掌握了一般网页的制作过程,会用表格和共享边框规划网页的版面,由于制作的网页都是静态的,且网页之间没有建立链接关系,所以还体会不到网页的神奇。本课围绕"卡通世界"栏目,学习在网页中插入横幅广告和水平线,并在网页之间建立超链接关系。frontpage不仅仅是一个网页的编辑器和站点管理器,还具有强大的多媒体功能,它的一个组件"横幅广告管理器"能够使多张画面自动切换,大大增添了页面的动感,这是非常吸引孩子的一个内容。在课堂的引入部分,教师可以这样设计:
首先播放一段拍摄的影片资料,内容是一些繁华的商业街上有大幅的广告牌,上面的画面是动态,总是几张图片在循环播放,让学生讨论这些广告牌有什么优点把生活实际直接引入课堂。
然后请学生欣赏几个带有横幅广告效果和水平分割线的网页,在欣赏的过程中教师提出要求:
(1)在网页上你看到了什么效果,你认为这样制作出来的网页效果如何。
(2)点击网页上的悬停按钮,你发现了什么。
教师小结"横幅广告","水平线","超链接"知识点。
在接下来的教学环节中,教师可以准备一些学习资料和素材,让学生通过自主学习或小组合作学习的方式来进行本节课的学习,在学生自学的过程中,让学生及时反馈学习成果,学生遇到的共性问题,可以让已经解决问题的学生通过多媒体演示操作过程(提倡),也可以是教师演示操作过程。共
2、重点内容分析:
本节课的重点可以归纳为两点:
(1)创建横幅广告:
横幅广告效果对于学生来说并不陌生,在生活中很常见,如在一些
繁华的商业街上有大幅的广告牌,上面的画面是动态,总是几张图片在循环播放,不但使有限的空间容纳更多的广告信息,动态的画面更吸引人的眼球。
在网页中插入横幅广告,实际上就是利用"横幅广告管理器"这个组件在网页上开辟一个区域,不断地循环播放一些图片,目的有两个,一个是增加了网页信息的容量,一个是产生动态效果,使网页更具吸引力。
在制作过程中需要提示学生注意以下几点:
①插入的图片尺寸尽量保持一致。
②每幅图的显示时间以2~3秒最为合适。
③最多可以插入9张图片。
④要保存之后才能预览到效果。
(2)利用"悬停按钮"制作超链接:
利用超链接,可以实现在网页间进行跳跃式的访问,这是网页的一大特点。在网页中建立链接关系需要提示学生注意以下几点:
①两个网页间是可以相互访问的,有去有回。在建立超链接时,应先通过"文件夹列表"打开甲网页,在"普通"网页模式下建立与乙网页的超链接,然后再通过"文件夹列表"打开乙网页,在"普通"网页模式下建立回访甲网页的超链接。最后通过预览验证两个网页能否相互访问。在网页多的情况下,这样做可以防止漏掉链接关系。
②可以通过网站结构的规划图,理清网页间的链接关系,尤其是悬停按钮与网页间的对应关系。
3、归纳提高分析:
本节课涉及到的知识可以归纳为以下几点:
(1)使用组件"横幅广告管理器"在网页中插入一组能够不断循环播放的图片,并且可以设置图片出现的时间,切换效果。横幅广告的区域可以用鼠标拖动直接放大或缩小。
网站结构规划图:
(2)在网页中插入水平线,可以使网页的版面结构更加清晰。水平线的长度,颜色,粗细等可以通过"水平线属性"对话框进行设置。
(3)利用"悬停按钮"设置超链接,控制网页的跳转。要理清网页间的链接关系,尤其是悬停按钮与网页间的对应关系。
(三)教学补充:
1、裁剪图片:
在制作横幅广告时,图片的尺寸应尽量保持一致。如果需要的素材图片尺寸不一致时,可以通过frontpage的"图片"工具栏中的"裁剪"工具对图片进行裁减。裁剪的过程如word中相同。
①选取图片
④再单击"裁剪"工具
②单击"裁剪"工具
③鼠标指向控制点拖动选定裁剪范围
裁剪后效果:
需要注意的是,如果插入的图片格式为gif动画文件,则不能用"裁剪"工具进行裁剪。
2、设置横幅广告超链接:
设置超链接的方法有多种,除了可以对悬停按钮设置超链接外,还可以对网页中的文字,图片,滚动字幕和横幅广告设置超链接。下图所示的是对横幅广告设置超链接的过程。
③选取链接目标文件
①双击横幅广告,打开属性对话框
②单击"浏览"
④单击"确定"
第6课幻影移形创建横幅广告
(一)本课教学目标:
1、学会利用组件"横幅广告管理器"在网页中插入横幅广告。
2、学会在网页中插入水平线分割网页。
3、学会利用设置表格或单元格背景色的方法为网页添加背景。
4、学会为悬停按钮设置超级链接。
(二)教学设计与教学建议:
1、课堂引入分析:
通过前面的学习,学生已经掌握了一般网页的制作过程,会用表格和共享边框规划网页的版面,由于制作的网页都是静态的,且网页之间没有建立链接关系,所以还体会不到网页的神奇。本课围绕"卡通世界"栏目,学习在网页中插入横幅广告和水平线,并在网页之间建立超链接关系。frontpage不仅仅是一个网页的编辑器和站点管理器,还具有强大的多媒体功能,它的一个组件"横幅广告管理器"能够使多张画面自动切换,大大增添了页面的动感,这是非常吸引孩子的一个内容。在课堂的引入部分,教师可以这样设计:共
首先播放一段拍摄的影片资料,内容是一些繁华的商业街上有大幅的广告牌,上面的画面是动态,总是几张图片在循环播放,让学生讨论这些广告牌有什么优点把生活实际直接引入课堂。
然后请学生欣赏几个带有横幅广告效果和水平分割线的网页,在欣赏的过程中教师提出要求:
(1)在网页上你看到了什么效果,你认为这样制作出来的网页效果如何。
(2)点击网页上的悬停按钮,你发现了什么。
教师小结"横幅广告","水平线","超链接"知识点。
在接下来的教学环节中,教师可以准备一些学习资料和素材,让学生通过自主学习或小组合作学习的方式来进行本节课的学习,在学生自学的过程中,让学生及时反馈学习成果,学生遇到的共性问题,可以让已经解决问题的学生通过多媒体演示操作过程(提倡),也可以是教师演示操作过程。
2、重点内容分析:
本节课的重点可以归纳为两点:
(1)创建横幅广告:
横幅广告效果对于学生来说并不陌生,在生活中很常见,如在一些
繁华的商业街上有大幅的广告牌,上面的画面是动态,总是几张图片在循环播放,不但使有限的空间容纳更多的广告信息,动态的画面更吸引人的眼球。
在网页中插入横幅广告,实际上就是利用"横幅广告管理器"这个组件在网页上开辟一个区域,不断地循环播放一些图片,目的有两个,一个是增加了网页信息的容量,一个是产生动态效果,使网页更具吸引力。
在制作过程中需要提示学生注意以下几点:
①插入的图片尺寸尽量保持一致。
②每幅图的显示时间以2~3秒最为合适。
③最多可以插入9张图片。
④要保存之后才能预览到效果。
(2)利用"悬停按钮"制作超链接:
利用超链接,可以实现在网页间进行跳跃式的访问,这是网页的一大特点。在网页中建立链接关系需要提示学生注意以下几点:
①两个网页间是可以相互访问的,有去有回。在建立超链接时,应先通过"文件夹列表"打开甲网页,在"普通"网页模式下建立与乙网页的超链接,然后再通过"文件夹列表"打开乙网页,在"普通"网页模式下建立回访甲网页的超链接。最后通过预览验证两个网页能否相互访问。在网页多的情况下,这样做可以防止漏掉链接关系。
②可以通过网站结构的规划图,理清网页间的链接关系,尤其是悬停按钮与网页间的对应关系。
3、归纳提高分析:
本节课涉及到的知识可以归纳为以下几点:
(1)使用组件"横幅广告管理器"在网页中插入一组能够不断循环播放的图片,并且可以设置图片出现的时间,切换效果。横幅广告的区域可以用鼠标拖动直接放大或缩小。
网站结构规划图:
(2)在网页中插入水平线,可以使网页的版面结构更加清晰。水平线的长度,颜色,粗细等可以通过"水平线属性"对话框进行设置。
(3)利用"悬停按钮"设置超链接,控制网页的跳转。要理清网页间的链接关系,尤其是悬停按钮与网页间的对应关系。
(三)教学补充:
1、裁剪图片:
在制作横幅广告时,图片的尺寸应尽量保持一致。如果需要的素材图片尺寸不一致时,可以通过frontpage的"图片"工具栏中的"裁剪"工具对图片进行裁减。裁剪的过程如word中相同。
①选取图片
④再单击"裁剪"工具
②单击"裁剪"工具
③鼠标指向控制点拖动选定裁剪范围
裁剪后效果:
需要注意的是,如果插入的图片格式为gif动画文件,则不能用"裁剪"工具进行裁剪。共
2、设置横幅广告超链接:
设置超链接的方法有多种,除了可以对悬停按钮设置超链接外,还可以对网页中的文字,图片,滚动字幕和横幅广告设置超链接。下图所示的是对横幅广告设置超链接的过程。
③选取链接目标文件
①双击横幅广告,打开属性对话框
②单击"浏览"
④单击"确定"
第8课联合演出整合栏目
(一)本课教学目标:
1、熟练掌握运用悬停按钮和图片制作超级链接。
2、会设置已有网页之间的导航结构。
3、培养学生小组合作学习意识。
(二)教学设计与教学建议:
1、课堂引入分析:
经过前几节课的学习与制作,"卡通世界"栏目的五个网页已经制作完成,且"卡通世界"栏目的kt。htm与站点的主页已经建立了超链接关系。本节课的主要任务就是在"卡通世界"栏目的五个网页之间建立超链接,让这五个网页可以相互访问,并进一步让学生领略使用"共享边框"的好处,充分体会网页间跳跃访问的神奇。要想完成好这个任务首先要理清网页之间的关系,以免在链接时发生错误,因此在课堂的引入部分可以这样设计:
首先,教师可以让学生画出网页间的结构图,如下图所示,然后演示在"导航"视图中建立网页间的结构图的过程,让学生体会哪种方法更方便,并学会利用"导航"视图创建导航结构。
然后根据图所示的网页关系,制作超链接。在制作的过程中教师提出要求:
(1)将卡通世界kt。htm中共享边框的四个悬停按钮制作成指向kt1,kt2,kt3,kt4网页的超链接。
(2)预览kt。htm网页,单击悬停按钮访问其他网页,你发现了什么为什么会这样
学生讨论之后,教师小结"共享边框"的作用。
教师提出任务,让学生在kt1,kt2,kt3,kt4等网页中利用图片制作指向kt网页的超链接。并提出要求:
(1)比速度。
(2)比方法,看谁采用了与别人不同的方法。
(3)最后看谁能实现上图中所有网页间的相互访问。
网页结构图:
学生在制作过程中可参考教材或教师提供的学习资料进行自主学习,如果自学有困难也可采用小组合作的方式进行学习。这样可以兼顾到对知识技能掌握不同程度的学生,同时也体现了学生在课堂教学中占具主体地位。请完成任务好的学生介绍经验。
2、重点内容分析:
本节课的重点是在"卡通世界"栏目的五个网页之间建立超链接,让这五个网页可以相互访问,并进一步让学生领略使用"共享边框"的好处,充分体会网页间跳跃访问的神奇。
当学生将卡通世界kt。htm中共享边框的四个悬停按钮制作成指向kt1,kt2,kt3,kt4网页的超链接后,在预览网页的链接效果时会发现问题:
(1)由kt网页跳转到kt1,kt2,kt3,kt4中的任意一个网页后,kt1,kt2,kt3,kt4这四个网页可以相互访问,并不象在学习第6课时强调的:在建立超链接时,应先通过"文件夹列表"打开甲网页,在"普通"网页模式下建立与乙网页的超链接,然后再通过"文件夹列表"打开乙网页,在"普通"网页模式下建立回访甲网页的超链接。这是因为悬停按钮被放置在了"共享边框"中,只要在其中一个网页里设置好超链接,其他网页也同时共享了这个设置,由此学生进一步领略使用"共享边框"的好处。
(2)因为kt1,kt2,kt3,kt4四个网页没有指向kt网页的超链接,因此无法跳回到kt网页中,要想快速解决这个问题,只需要在kt1,kt2,kt3,kt4其中的一个网页的"共享边框"中设置返回kt网页的超链接就可以了。共
3、归纳提高分析:
本节课涉及到的知识可以归纳为以下几点:
(1)将几个网页共有的超链接放在共享边框里,可以大大简化创建超链接的工作。
(2)可以对图片设置超链接。
(3)在"导航"视图中创建栏目的导航结构。打开"导航"视图,通过"文件夹列表"将网页文件直接拖动到"导航"视图中合适的位置,待虚线相接,释放鼠标即可。在导航结构中只显示网页的中文标题,这样有利于网站结构更加清晰。
(三)教学补充:
在frontpage窗口中,可以同时打开多个网页文件。在"文件夹列表"中,通过网页文件的图标,就能知道有多少网页文件处于打开状态,如。
这几个网页处于打开状态
这几个网页处于关闭状态
第9课作文乐园插入导航栏
(一)本课教学目标:
1、熟练掌握在新建的专用文件夹中建立新的网页,并更改"网站标题"。
2、能够在"导航"视图中创建栏目的导航结构。
3、能够在网页中添加导航栏,并通过导航栏建立网页间的超链接关系。
4、能够利用导航栏链接浏览网站。
(二)教学设计与教学建议:
1。课堂引入分析:
在第2单元,学生已经掌握了利用悬停按钮和图片制作超级链接的操作,由于网页之间的超链接需要一个一个独立设置,经常会出现漏掉的现象,导致个别网页不能访问,为了能够更方便快捷地在多个网页之间建立超链接,本课将学习一种更便捷的建立超链接方式:在"导航"视图中创建栏目的导航结构,并利用导航栏制作超链接。
在课堂的引入部分,教师可以这样设计:
首先给出一定的时间,让学生按要求完成以下任务。(因为通过前两个单元的学习,学生具备的知识完成这些任务并不困难,为了节省课堂时间,教师也可以将做好的半成品通过局域网传给学生,让学生在此基础上完成后面的任务。教师可以根据学生情况自行安排。)
(1)创建栏目文件夹zwly。
(2)在文件夹"zwly"下新建7个网页文件,文件名和网页标题对应关系如下:
zw——作文乐园
zw1——人物写真
zw2——成长足迹
zw3——读后有感
zw4——多彩生活
zw5——鸿雁声声
zw6——游踪览胜
(3)在"导航"视图中建立导航结构(给出结构图)。
其次,学生要在有限时间内让这7个网页可以相互访问,还可以与主页相互访问,可以用悬停按钮,图片或文字进行超链接(不限制)。
规定的时间结束,检验学生完成情况,结果没有一个学生按时完成任务。此时教师引出本节课的学习任务,介绍一种更方便快捷的超链接方法——导航栏。
接下来,让学生参考教材或教师准备的学习资料通过自主学习或小组合作学习的方式来进行本节课的学习,在学生自学的过程中,让学生及时反馈学习成果,学生遇到的共性问题,可以让已经解决问题的学生通过多媒体演示操作过程(提倡),也可以是教师演示操作过程。
最后总结利用导航栏建立超链接的方法与其他方法相比有什么优势。
2、重点内容分析:
本节课的重点可以归纳为两点:
(1)在"导航"视图中创建栏目的导航结构:
在"导航"视图中,创建站点的导航结构,主要是为了确定网页之间的关系。打开"导航"视图,通过"文件夹列表"将网页文件直接拖动到"导航"视图中合适的位置,待虚线相接,释放鼠标即可。在导航结构中只显示网页的中文标题,这样有利于网站结构更加清晰。创建导航结构,既可以先制作好网页再组织导航结构,也可以先建好导航结构,再编辑共