八年级下学期网页制作教学设计(共14页).doc

上传人:飞****2 文档编号:13771020 上传时间:2022-05-01 格式:DOC 页数:14 大小:82.50KB
返回 下载 相关 举报
八年级下学期网页制作教学设计(共14页).doc_第1页
第1页 / 共14页
八年级下学期网页制作教学设计(共14页).doc_第2页
第2页 / 共14页
点击查看更多>>
资源描述

《八年级下学期网页制作教学设计(共14页).doc》由会员分享,可在线阅读,更多相关《八年级下学期网页制作教学设计(共14页).doc(14页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。

1、精选优质文档-倾情为你奉上信息技术教学设计授课时间2232.28课 题网页入门课 型新授教学方法讲练教具教学目的:1、认识网页的基本工作界面。2、学会如何创建站点,网页及如何保存网页。教学重点、难点:学会如何创建站点,网页及如何保存网页。教学步骤一、导入上过网的同学们一定浏览过许多站点,那些图文并茂的网页一定让你流连忘返。你知道那些网页是怎么制作出来的吗?你也想学会制作网页吗?那就让我们从制作一个简单的“悉尼奥运”网页开始吧。制作网页的工具很多,这里咱们介绍FrontPage2000。二、新授1、启动FrontPage2000.开始程序 Microsoft FrontPage2000.2、工作

2、界面介绍菜单栏 工具栏 编辑区 视图栏 网页察看方式 状态栏重点讲解:文件夹列表的功能。3、个人站点的创建A、看教学光盘B、生练习C、巩固练习(师要求学生按要求做:新建一个“个人站点”)D、学生探讨:如何新建网页?(1、在文件“菜单”中新建2、在工具栏中的新建按钮。)E、谈话:如何保存网页呢? 讲解:“文件”“保存”在出现的对话框按要求进行设置即可。三、练习四、小结教学回顾:这节课对于学生来说,相对比较简单,但也比较重要,因为是入门,通过这节课的观察,学生的效果还是不错的。信息技术教学设计授课时间3.23.6课 题网页入门详解课 型新授教学方法讲练教具教学目的:1、掌握FrontPage 20

3、00软件的启动和退出方法;2、了解什么是网页以及它所包含的主要元素;3、了解FrontPage 2000中的几种视图方式及其功能。教学重点、难点:掌握FrontPage 2000软件的启动和退出方法;教学步骤导入新课在上面的课程中我们已经学会了通过浏览网页方便地获取信息。然而,有的同学会问,我们自己能不能设计、制作出自己的网页,并在网上发布呢?当然可以了,接下来我们就来学习如何制作网页。我们这里主要介绍采用FrontPage这一网页制作软件来进行网页制作。首先我们来了解以下有关网页制作的基础知识。一、网页及其组成提问 首先,同学们,你们认为什么叫网页呢?(教师先提出一些与教学内容有关的实际问题

4、,让学生想想如何解决,以任务激发学知识的主动性。) 学生回答 在网上看到的一些画面。总结对了,我们把通过浏览器在WWW上看到的每一幅画面都称为网页(Web page)。网页是全球广域网上的基本文档,用HTML语言编写。我们也看到了,有的网页上只有文字,有的有图片,有的还有动画。那么,我们要做的网页上包含的元素主要就有:文字、图片、声音、动画、影像以及链接等。通过这些的有机组合,就形成了包含各种信息的网页。最初,人们用HTML语言在文本编辑中制作网页。二、常用的网页制作工具HTML语言是超文本标记语言(Hypertext Markup Language)的英文缩写,只有熟练掌握HTLM语言的专业

5、人员才能用它制作网页。FrontPage系列软件的问世,将人们从HTML代码中解放出来,用它来制作网页就像在文字处理软件中编排多媒体文档一样,非常直观。目前使用较多的网页制作软件除了FrontPage外,还有Flash、Dreamweaver等。接下来我们来看看如何进入FrontPage 2000。FrontPage 2000的启动演示单击“开始”按钮,将指针依次指向“程序”/“Microsoft FrontPage”单击即可。提问请同学们观察一下它的窗口,看看和我们刚学过的Word窗口比较一下。(上课时,教师先提出一些与教学内容有关的实际问题,让学生想想如何解决,以任务激发学知识的主动性。带

6、着这一问题听讲更能激起他们的学习热情。通过设置一些悬念,再让学生用计算机去解决,他们会觉得学习计算机确实管用,能够解决实际中的问题,从而也提高了学习的积极性。)学生回答窗口的左边多了几种视图方式。讲解对了,FrontPage 2000的窗口和我们学过的Word窗口基本相似,都是由菜单栏、工具栏、状态栏和编辑区组成的,只是,在FrontPage 2000窗口的左边出现了几种视图方式。他们分别是:网页、文件夹、报表、导航、超链接和任务这六种。接下来我们来分别介绍这六种视图方式和他们的功能。2. FrontPage 2000的视图方式(1)网页讲解它是我们制作网页时最常使用的视图方式,可以用来创建、

7、编辑和预览网页,既有所见即所得的特性。(2)文件夹讲解它是显示站点内容的组织方式,用于管理站点中的文件和文件夹。跟Windows资源管理器相似,在“文件夹”视图中可以创建、删除与移动文件和文件夹。“文件夹”视图将工作区分为左右两部分,左侧显示网站中所有文件夹,单击任一文件夹,右侧的工作区将显示该文件夹下的内容。(3)报表讲解用来分析站点内容。如计算站点中的所有文件大小、显示出哪个文件没有链接到其它任一文件、指出慢速或过期的网页、以工作或是它们被分配的人和其他等方式来把文件分组。(4)导航讲解用来创建、显示、打印和更改网站导航结构的视图。在这个视图中可以清晰地看到整个网站的组织结构和文件组成,拖

8、曳水平分割线可以改变上下窗口的相对大小。(5)超链接讲解显示来自站点的每一个超链接。该视图方式以图形的方式显示网站中个文件之间的链接情况,网页之间的链接通过箭头来标志。(6)任务讲解任务视图列出了站点中要完成的任务。总结本节只是简单介绍一下个视图方式的作用和功能,它们的具体作用我们在以后的网页制作过程中再加以介绍。至于退出FrontPage2000,和我们关闭其它应用程序的窗口一样,只要单击“关闭”按钮就可以了。 FrontPage2000的退出作业:熟悉FrontPage2000网页制作工具环境。 (计算机是一门实践性很强的学科,只有通过上机实践,才能发现问题,才能更准确地理解计算机、更灵活

9、地应用计算机。同时,在实践的过程中,老师可以了解学生的掌握程度,发现学生中普遍存在的问题,合理布置学习任务。实践中,特别是对于一些动手能力差的学生,要鼓励他们不怕犯错误。)教学回顾:学生能基本掌握所学知识!信息技术教学设计授课时间3.93.13课 题网页制作课 型新授教学方法合作、探讨教具教学目的:1、通过学生相互间的合作来获取新知。如:设置网页背景,超链接等2、培养学生间的相互合作关系。教学重点、难点: 培养学生间的相互合作关系教学步骤一、生互相探讨1、启动FrontPage2、创建空白网页单击菜单栏“文件”|“新建”|“站点”,选择“新建”模板中的“空站点”。3、插入文本文件单击菜单栏“插

10、入”|“文件”,利用打开的“选择文件”对话框选择教学光盘实例库第五章中“悉尼奥运”文件插入。4、修饰文字设定字体、字号、颜色,页末输入“华夏风流”。5、设定背景颜色在编辑区单击鼠标右键,打开“网页属性”|“背景”选项卡,单击颜色列表框的箭头,设定背景颜色。6、预览单击“预览”,进行预览;若不满意,可再单击“普通”进行修饰。7、保存单击“文件”|“另存为”命令,在打开的“另存为”对话框中输入文件名,保存类型为“Web”页,单击“更改”按钮,在打开的“设置网页标题”对话框中输入“27届奥运”,单击“确定”。试一试:创建第二个网页“华夏风流”,方法同上。8、创建超链接。要求:把第一个网页链接到第二个

11、网页,第二个网页又能链回到第一个网页。9、预览单击“预览”,观察用鼠标单击“华夏风流”时,能否跳到该网页;单击“返回上页”时能否返回“27届奥运”网页。试一试:新建两个空白网页,文件名分别为“ page_3”和“ page_4”,网页标题分别为“历史见证”和“奥运历史”。并把其相应的文件插入其中,然后建立网页间的超链接。二、小结你学到了什么?(生自己说)教学回顾:这节课完全是放给学生来做的,目的是想让他们通过自己的学习来发现新知,一节课下来,发现学生的自学能力不是太强。信息技术教学设计授课时间3.163.20课 题插入图片及修饰图片课 型新授教学方法讲练教具教学目的:1、学会在网页插入图片。2

12、、学会设置图片属性,图片边框等操作。3、学会制作与设置图片缩约图。教学重点、难点: 制作与设置图片缩约图教学步骤一、复习回顾二、新课1、插入图片A、讲解:其实在FrontPage中插入图片与在Word中插入图片一样,(操作)“插入图片来自文件”。B、生练习操作。2、设置图片属性A、讲解:在所插入图片上右击键选择图片属性,会出现设置图片属性窗口,在其出现的窗口中有三个选项卡:常规、视频、外观。可根据不同的需要的来设置。B、生自己试着来做C、生按师要求来设置图片要求:1、边框粗细为2。 2、转化为GIF格式。3、图片工具栏的使用A、重点讲解:文本工具、绝对定位工具、自动缩约图工具B、了解热点工具。

13、C、学生自己做D、学生按教师的要求来做要求:1、把图片制作成自动缩略图。 2、把图片绝对定位拖到最右边。三、巩固练习四、小结本节主要讲解了图片的设置,在这节里你应该重点学会设置图片属性,图片边框等操作;学会制作与设置图片缩略图。教学回顾:这节课大部分时间是通过教师讲解的,但一节课下来,效果不是太明显的,可能是由于速度太快了吧。信息技术教学设计授课时间3.233.27课 题创建超链接课 型新授教学方法讲练教具教学目的:学会怎样进行超链接(1、学会怎样链接到网页2、学会怎样链接到计算机中的某一个文件)教学重点、难点: 超链接的方法教学步骤一、复习回顾1、新建站点2、保存网页(并更改标题)3、对图片

14、的修饰及设置(要求:插入一副图片,并将其边框粗细设置为2,将其绝对定位,并在其上添加文字)二、新课1、生自己做(要求:新建一个空站点,并在其站点下新建至少两个网页,在新网页中插入文字和图片。)2、谈话:在前面咱们所学的Word、Excel中都学过超级链接,大家都还记得吗?其实在FrontPage中也有超链接,方法跟咱们以前学过的一样。来看一下。3、师讲解:A、首先选中文字或图片。B、单击工具栏中的超链接按钮或“插入”菜单中的“超链接”。C、在名称里单击所要链接的网页,如果要链接到某一个文件,单击“右下角的第三个按钮”,从计算机中选择一个文件。4、生自己练习。三、生巩固练习四、师小结这节课我们主

15、要学习了超链接,其实对于这个咱们已经很熟悉了,关键是根据来链接,到底选择什么。教学回顾:学生对超链接已经并不陌生了,通过这节课的学习,学生大部分掌握了超链接。信息技术教学设计授课时间3.304.3课 题设置网页背景和背景音乐课 型新授教学方法讲练教具教学目的:1、学会怎样添加背景音乐。2、学会设置网页背景。教学重点、难点:学会怎样添加背景音乐及设置网页背景。教学步骤一、复习回顾实际操作:超链接二、新课1、添加背景音乐A、谈话:当你打开某个网页时,可能会听到动听音乐声,这是怎么做出来的呢?这节课咱们就来揭开它的奥秘。B、讲解:在网页的编辑区击右键,在弹出的快捷菜单中选择“网页属性”,之后会打开网

16、页属性的窗口,在“常规”选项卡中有一项“背景音乐”,单击其后面的“浏览”按钮,选择一个背景音乐。C、在“循环次数”里可以设置循环的次数。2、生练习3、设置网页背景A、谈话:为了使网页更加美观,通常都需要设置网页的背景,怎么来设置呢?B、讲解:在网页的编辑区击右键,在弹出的快捷菜单中选择“网页属性”,之后会打开网页属性的窗口,在“背景”选项卡根据需要来设置,可以用图片来作为背景,也可以用颜色来作为背景。C、生练习三、师检查练习结果叫生上台演示四、小结教学回顾:信息技术教学设计授课时间4.64.10课 题框架网页课 型新授教学方法讲练教具教学目的:1、学会怎样新建框架网页。2、学会保存框架网页。教

17、学重点、难点: 学会如何来保存框架网页。教学步骤一、巩固练习叫生上台演示操作上节课的内容,具体为:1、新建一个空站点。2、保存当前的网页。3、新建一个空白网页并保存。4、给第一页设置背景。5、给第二页设置背景音乐。二、新课1、导入谈话:制作网页时,在很多时候要用到框架网页,如:书上的例子(出示成果),但具体何为框架网页?看书P105页。2、识记框架网页并检查效果。3、讲授框架网页。A、新建框架网页(1)方法:单击“文件|新建|网页”,然后在出现的窗口中选择第二个选项卡框架网页,根据需要来选择类型。(2)生自己练习B、保存框架网页(1)谈话:框架网页与普通网页的保存方法不同,具体应为:(2)讲解

18、:当你单击保存后,在出现的对话框中看右下角的预览里的提示,其实框架网页是由好几个网页组成的,看清预览里的提示是保存哪个网页的,然后根据要求来选择保存位置与文件名。(3)生自己练习。三、巩固练习叫生登台演示四、小结教学回顾:这节课内容不多,80%的学生掌握较好!信息技术教学设计授课时间4.134.17课 题练习课 型复习教学方法讲练教具教学目的:通过本节课的综合练习,使学生进一步熟练掌握以前学过的操作。教学重点、难点: 熟练以前的操作教学步骤具体要求:把“网上邻居|USER|新建文件夹”中“C试题”文件夹拷贝到“D盘”下,并将其改成自己的名字,然后再进行操作。1、在FrontPatg中新建一个“

19、横幅和目录”的框架网页。2、在横框中新建一个“欢迎光临我的网站”的字幕。3、将字模方向设置为左,表现方式为滚动条,背景颜色为蓝绿色。4、将字模的字体设置为隶书,加粗,36磅。5、在左框中输入目录文字:“珍珠港事件”、“中途岛大海战”、“英吉利海峡的空中战”、“西线的静坐战”。6、在右框架把C试题文件夹中的文件test.txt按“以HTML方式处理”形式插入。7、将C试题文件夹下的图片London.gif插入文字的右下方,并将其绝对定位。8、在右框架网页中将C试题文件夹下的Circusl.wav作为其背景音乐。9、将C试题文件夹下的图片Cat-0096.jpg设置为左框架网页的背景。10、将整个

20、框架网页保存到姓名文件夹下,其中整个框架保存为ddd.htm横幅保存为h.htm,左框架保存为z.htm,右框架保存为y.htm。教学回顾:题完成的不是太好,可能与上课时练习较少有较大的关系吧。信息技术教学设计授课时间4.204.24课 题插入表格课 型新授教学方法讲练教具教学目的:1、网页中用表格定位方法,输入文字。2、对表格的行列的编辑及修饰。教学重点、难点:表格行列的编辑及修饰。教学步骤一、复习回顾二、引入我们在Word、Excel中都学过插入表格,在FrontPage中也可以插入表格,并且还可以用表格来定位。三、新课1、插入表格A、讲解:依次单击菜单栏的“表格|插入表格”,之后会打开插

21、入表格的对话框,在出现的对话框中设置所需表格的行列即可。B、生练习2、行列的编辑A、讲解:同在Word、Excel中一样,也可以对行列进行编辑,如插入行(列),删除行(列),合并单元格,拆分单元格等操作,方法也同其一样。B、师示范C、生练习3、行列的修饰A、讲解:在表格内右击,在出现的快捷菜单中选择“表格属性”,在其出现的对话框中可以进行设置,具体可根据实际情况来确定,其中在出现的快捷菜单选择“单元格属性”,可以设置单元格的一些属性。B、生练习四、师小结教学回顾:能基本掌握所学知识。信息技术教学设计授课时间4.274.30课 题表单和文本框课 型新授教学方法讲练教具教学目的:1、学会如何插入表

22、单和文本框。2、会对表单和文本框进行其属性设置。教学重点、难点:表单和文本框的属性设置。教学步骤一、复习回顾二、新课1、插入表单方法:单击“插入|表单|表单”。2、插入文本框A、单行文本框方法:单击“插入|表单|单行文本框”。属性设置:在其上双击(或击右键在右键菜单中选择“表单域属性”),在名称里输入此文本框的内部名称,在“初始值”里输入此文本框默认的选项,在宽度里输入此文本框的宽度,在TAB顺序里输入1至999的数值,表示按下TAB的顺序,在密码域里可以选择“是与否”,单击“验证有效性”可以设置此单行文本框的有效性。B、滚动文本框方法:单击“插入|表单|滚动文本框”。属性设置:在其上双击(或

23、击右键在右键菜单中选择“表单域属性”),在名称里输入此文本框的内部名称,在“初始值”里输入此文本框默认的选项,在宽度里输入此文本框的宽度,在TAB顺序里输入1至999的数值,表示按下TAB的顺序,在行数里输入滚动的行数,单击“验证有效性”可以设置此单行文本框的有效性。3、生练习三、巩固练习四、师小结教学回顾:学习情况较好。信息技术教学设计授课时间5.45.8课 题发布站点课 型新授教学方法讲练教具教学目的:了解并知道怎么发布站点。教学重点、难点:了解并知道怎么发布站点。教学步骤一、引入主页做完后,需将它发布到Internet上,才能让别人浏览到。下面我们来学习如何发布站点。二、预备知识发布站点

24、,就是将我们在自己计算机制作的站点,上传给Internet上的某个网站的WWW服务器。在发布站点之前,首先要向选定的网站申请主页空间。申请后,我们会得到一个主页地址、账号、口令。在Internet上申请主页空间一般需要缴纳一定数量的租金,但也有许多站点可提供免费主页空间。三、发布站点步骤:1、打开“发布站点”对话框在“网页”视图中打开“悉尼奥运”站点,从“文件”菜单中选择“发布站点”,打开“发布站点”对话框。2、输入Web服务器网址在“指定发布站点的位置”文本框中,输入Web服务器分配给的地址,单击发布。3、输入账号、口令当站点发布向导询问账号、口令时,输入在申请主页空间时得到的账号、口令,单

25、击“完成”。4、完成发布。四、生自己练习教学回顾:教学效果较好。信息技术教学设计授课时间5.115.15课 题复习课 型复习教学方法讲练教具教学目的:进一步熟悉Frontpage,掌握它的点滴知识。教学重点、难点:表格行列的编辑及修饰。Frontpage复习题一、选择题:1、浏览器是浏览网页的软件,目前常用的浏览器是:()AOutlook Express BInternet Explorer CMicrosoft FrontPage DFoxmail2、下列软件中,不是网页制作工具的是:()A:AccessB:Dreamweaver C:FrontPageD:记事本3、下面哪一个不是网页的扩展

26、名:()A:.htmB:.htmlC:.phpD:.xls4、文字建立链接后,通常在文字的下方会产生()A:波浪线B:下划线C:着重号D:以上都不对5、FrontPage保存的默认文件名为:()A:文档1.xlsB:book1.xlsC:newpage1.htmD:无标题.xls、表格边框线的粗细设置为( ),在预览方式下表格线不可见。 A:1 B:2 C: 3 D:0、新建网站默认路径是():C:My DocumentsMy WebsMyweb::My DocumentsMy WebsMyweb:C:My WebsMyweb:C:My Web、网站与文件夹的区别,下面的说法正确的是:()A:

27、没有太大的区别 B:网站下会有网页,文件夹则不能有网页。:网站目录下将自动建立private和images两个子目录。、在组件-插入字幕时,字幕没有哪种表现方式( )A: 滚动条 B: 幻灯片 C: 交替 D: 淡化二、判断题1、网页一般由文字与图片组成,还可以包括声音、影像和动画等。( )2、利用Frontpage2000的组件可以非常方便地制作留言板。( )3、网页文件的扩展名是“.html”或“.htm”,还有“.asp”、“.php”等。 ( )4、web服务器必须有固定的IP地址,因此一般拨号上网的计算机不能作为WEB服务器.( )5、记事本可以制作一个简单的网页。 ( )6、HTML就是制作网页的超文本标识语言。()、网页中可以插入flash动画、gif图片。()8、在预览状态网页是不可以修改的。()9、在网页制作过程中,可直接用HTML语言编辑网页。( )教学回顾:有一半多学生做到会80%对。专心-专注-专业

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 教育专区 > 教案示例

本站为文档C TO C交易模式,本站只提供存储空间、用户上传的文档直接被用户下载,本站只是中间服务平台,本站所有文档下载所得的收益归上传人(含作者)所有。本站仅对用户上传内容的表现方式做保护处理,对上载内容本身不做任何修改或编辑。若文档所含内容侵犯了您的版权或隐私,请立即通知淘文阁网,我们立即给予删除!客服QQ:136780468 微信:18945177775 电话:18904686070

工信部备案号:黑ICP备15003705号© 2020-2023 www.taowenge.com 淘文阁