制作网页FrontPage精.docx
《制作网页FrontPage精.docx》由会员分享，可在线阅读，更多相关《制作网页FrontPage精.docx（18页珍藏版）》请在冰豆网上搜索。
制作网页FrontPage精
制作网页——FrontPage2000
◆单元概述
Internet作为一种新兴的信息传播媒体和信息资源宝库，它吸引了越来越多的人。
我们不但可以获取最快捷、最准确的信息，还可以利用这个新的媒介来宣传自己。
在本单元中，我们将应用FrontPage软件，制作一个以青春校园为主题的网站——小荷才露尖尖角。
为了使制作的网页激动人心、丰富多彩，我们要在网站的网页里添加文字、图片、音乐等媒体，还要为网站规划结构。
在网站与网页的创作过程中，我们将学习规划网站结构，创建、编辑网站中的各个网页，设置网页中的共享边框、导航栏和网页主题，最后我们要作品发布到Internet。
在本单元的学习中，我们要充分利用教师提供的样例，认真观察与分析样例中网站的结构与网页的组成，但不要受样例的束缚，及时完成每一个学习任务。
相信同学们一定会制作出高水平的作品。
◆单元重点
1．主要技术重点：
网页制作
2．相关技术重点：
技术应用、运行环境、程序设计、Internet
3．软件：
MicrosoftFrontPage2000、网络浏览器
第l课进入FrontPage世界
◆课程描述
在本节课中，我们将了解网站、网页、主页的关系，通过观察网页，了解网页的组成，创建一个新站点。
◆教学目标
1.了解网站与网页
2.认识MicroSoftFrontPage2000
3.创建一个新的站点
◆教学过程
Ø复习与导入
1．复习上学期所学的内容：
1）信息技术基础知识（信息与信息技术，计算机组成，信息安全）；
2）windows2000（美化桌面，窗口与对话框，资源管理器，文件和文件夹）；
3）网络知识（网络基础，IE看世界，信息搜索，电子邮件，网上交流）
2．导入新课
在本单元中，我们将学习网页制作技术，通过学习能够制作一个漂亮的网页，而在本节课中，我们则了解网站与主页，初步认识FrontPage2000，并创建一个新站点。
Ø任务与活动
第一任务了解网站与网页
1．活动与探索
打开IE浏览器，观察与思考问题：
网站与网页的关系；网页与主页；怎样从主页进入到其它页面?
2．了解常用的网页制作软件（FrontPage，DreamWeaver）
第二任务初识FrontPage2000
1．活动：
启动FrontPage2000，观察FrontPage2000窗口的组成。
（标题栏；菜单栏；工具栏；视图栏；信息栏；网页编辑区。
）
第三任务创建新站点
1．教师演示创建站点的过程
第1步：
“文件”→“新建”→“站点”。
第2步：
在“新建”对话框中选择“只有一个网页的站点”。
第3步：
在“选项”的下拉菜单中输入新站点的存放位置。
（默认保存位置为“C:
\MyDocuments\Mywebs”，默认的网站名称为：
myweb、myweb2、myweb3……，要修改网站名称和位置可直接输入。
）
第4步：
单击“确定”完成站点的创建。
2．学生操作：
创建新站点，注意保存在D盘。
教师作巡回辅导，解决学生中存在的问题，尤其是保存位置。
3．了解站点的保存、删除和站点内的文件管理
Ø反馈与矫正
解决学生中存在的问题，特别是站点保存位置。
展示学生新建的站点。
Ø课堂小结
通过本节课的学习，我们认识了FrontPage2000，熟悉了它的我们用FrontPage2000创建一个新站点。
具体要求掌握FrontPage2000的启动；FrontPage2000窗口组成；用FrontPage2000创建一个新站点
教学随笔：
第2课为网站奠基
◆课程描述
了解创建网站的流程并制定自己小组的计划，围绕自己的主题收集资料，确定网站中网页的结构。
◆教学目标
1．规划网站，确定网站中网页的结构
2．围绕网站的主题收集主题
◆教学过程
Ø复习与导入
1．复习：
上一节课我们学习了站点的创建，大家回忆一下：
如何创建一个新网站？
2．活动：
打开上一节课创建的站点。
上一节课虽然创建了一个新站点，但这个站点也许是空的，要开发一个丰富多彩的网页，需要准备大量的资料，如文字、图片、声音、电影等，还需要网页的结构，这也开发网页前期的基础工作，本节课做的工作就是“为网站奠基”。
Ø任务与活动
第一任务制定站点创作计划
1．在教师指导下，把学生分成创作小组。
2．商讨各组各人的分工。
选出各创作组小组长，职责到人，确定网站主题。
第二任务设计网站的结构
各小组参考如下网站结构图，进行自我设计。
活动：
打开IE浏览器，浏览网页，了解网站的结构。
要求各组拿出类似的结构图。
第三任务收集资料
在各小组组长的协调下，通过网络，来收集创作网页所需的各种资料，如文字、图片、声音、电影等。
Ø反馈与矫正
教师对各小组网站结构设计进行指导。
展示各小组的网站结构图。
对各组进行评估。
Ø课堂小结
本节课主要是为以后网站的创建做准备工作，各组设计了网站结构，并为网页制作所需的资料进行了收集。
教学随笔：
第3课在网站中创建网页
◆课程描述
本节课要在导航视图中创建网页，并能根据需要及时增删网站中的网页，为了使网页具有相同的风格，还需要应用共享边框。
◆教学目标
3．学会在导航视图中创建网页
4．掌握网站结构的编辑
5．设置共享边框
◆教学过程
Ø复习与导入
上节课我们为创建网站做了大量的准备工作，回顾各组设计的网站结构。
本节课要在导航视图中创建网页，并能根据需要及时增删网站中的网页，为了使网页具有相同的风格，还需要应用共享边框。
Ø任务与活动
第一任务：
按站点结构创建各个网页
教师稍加演示，让学生开始创建网页。
第1步：
打开站点。
第2步：
单击“视图”栏中的“导航”按钮
，切换到“导航”视图。
第3步：
将“主页”改命，如“小荷才露尖尖角”。
第4步：
在主页之下建立其他网页
按照站点结构依次建立其他的网页。
第二任务：
编辑网站结构
第1步：
在网站中添加一个新网页。
选择“文件”→“新建”→“网页”命令，在“新建”对话框中“常规”标签中选择“普通网页”。
第2步：
将新网页保存在代表站点的文件夹里。
选择“文件”→“保存文件”命令，在“另存为”对话框中选择站点文件夹，单击“确定”按钮关闭对话框。
第3步：
删除一个网页。
第三任务：
设置共享边框
1．共享边框的意义：
将网页分成上、左、右几个区域，在网页上保留特定的区域，作为所有网站中网页的共享区，我们可以在这些区域放置导航栏、特定商标或者版权声明等，让网页有统一的风格。
2．操作过程
第1步：
选择“格式”→“共享边框”命令。
第2步：
在“共享边框”对话框中勾选“所有网页”、“上”、“左”、“包含导航按钮”等选项。
3．学生在教师指导下进行设置
Ø反馈与矫正
教师进行辅导，解决学生中存在的问题，对学生网页进行点评。
Ø课堂小结
本节课进行了如下操作：
学会在导航视图中创建网页；掌握网站结构的编辑；设置共享边框。
教学随笔：
第4课漂亮网页一点通
◆课程描述
在本节课中，我们要了解在网页中输入、编辑文字的方法，并掌握如何在网页中插入图片和设置网页的背景图案。
◆教学目标
6．学会编辑网页文本
7．掌握在网页插入图片
8．掌握网页背景的设置
9．掌握保存带有图片的网页
◆教学过程
Ø复习与导入
复习上节课的内容
引入：
图片在网页中扮演着重要的角色，在网页中如何导入图片，这是我们本节课的重点内容。
Ø任务与活动
第一任务：
编辑网页文本
1．教师演示插入文字的方法。
2．学生分组在网页中输入文字
第二任务：
在网页中插入图片
1．插入图片的方法
2．活动：
在学校服务器上放置图片素材，让学生上网下载，选取图片到网页中。
第三任务：
保存带有图片的网页
当我们在网页中插入了图片后，为方便管理，FrontPage会在保存时出现提示，主动询问我们是不是要把插入的图片保存到这个站点中，建议你选择“确定”，这样我们发布网页时，就不会发生无法显示图片的情况。
第四任务：
设置网页的背景
格式——背景
活动：
学生浏览图片，设置网页背景。
Ø反馈与矫正
对学生辅导，展示学生作品。
Ø课堂小结
在本节课中，我们要了解在网页中输入、编辑文字的方法，并掌握如何在网页中插入图片和设置网页的背景图案。
教学随笔：
第5课导航栏与套用主题
◆课程描述
了解网页中导航栏的作用，并能在网站的网页中设置导航栏。
掌握网页“主题”的设置方法，并能改变网页中已有的“主题”。
◆教学目标
10．了解导航栏的意义
11．掌握导航栏的设置
◆教学过程
Ø复习与导入
复习上节内容：
编辑网页文本；在网页中插入图片；设置网页的背景；保存带有图片的网页。
出示样例，导入新课：
导航栏与主题
Ø任务与活动
第一任务：
认识导航栏
了解网站结构图：
第二任务：
设置导航栏
第1步：
启动FrontPage2000，打开站点。
第2步：
在网页上部的共享边框中，右键单击“编辑些导航栏属性……”等文字，在快捷菜单中选择“导航栏属性”。
第3步：
在“导航栏属性”对话框中，勾选相应的选项，单击“确定”关闭对话框。
第4步：
设置好导航栏的内容后，在网页中即可显示出来。
第三任务：
使用主题设置统一风格
第1步：
选择“格式”→“主题”命令。
第2步：
在弹出的“主题”对话框中选择你喜爱的主题。
Ø反馈与矫正
在分组操作的基础上，解决学生存在的问题
展示学生的作品。
Ø课堂小结
认识导航栏；掌握设置导航栏的方法；了解并使用主题设置统一风格。
教学随笔：
第6课整齐的表格
◆课程描述
掌握利用表格有效地规划网页上的信息，将文字、图片精确定位，并为表格或单元格设置背景。
◆教学目标
12．学会在网页中建立表格
13．掌握表格的编辑
14．制作一个课程表的网页
◆教学过程
Ø复习与导入
复习上节课内容：
新建站点；网站结构；共享边框；在网页中插入图片、背景；在网页中插入导航栏；网页主题。
2．在网页中，表格的使用非常多，如何在网页中插入表格呢?
下面我们将学习如何在网页中插入课程表。
出示样例——网页中的课程表，引入新课。
Ø任务与活动
第一任务建立表格
第l步：
打开站点
第2步：
插入表格
第3步：
在表格内输入课程名
了解如何建立表格
第二任务表格的编辑
第1步：
合并单元格
第2步：
插入一列；一行
第3步：
删除多余的行；列
活动：
在网页中插入课表。
第三任务美化表格
表格属性的设置
第l步：
为表格设置背景
第2步：
隐藏表格的边框线
Ø反馈与矫正
Ø课堂小结
本节课我们学习了在网中创建表格；对表格进行了基本编辑；了解如何美化表格；学会制作一个课程表的网页。
教学随笔：
第7课飞跃空间的超级链接
◆课程描述
通过建立指向页面的链接、指向站点的链接、指向电子邮件的链接，使我们的网页更具有魅力，另外还要掌握如何编辑修改链接。
◆教学目标
15．了解超级链接
16．掌握网页超级链接的创建
17．学会链接到其它网站或信箱
18．掌握超级链接的编辑
◆教学过程
Ø复习与导入
复习上节内容：
掌握在网中创建表格；掌握表格的基本编辑方法；美化表格；学会制作一个课程表的网页
我们发现：
在网页中有导航或超级链接，如何创建呢?
Ø任务与活动
第一任务建立网页超级链接
网页中虽然有导航栏，但还可以再建立其他的超级链接到指定的网页。
第1步：
打开站点。
第2步：
在“文件夹列表”框中选择网页。
第3步：
选择“插入”→“超链接”命令，在“创建超链接”对话框中选择要链接的网页名称。
第二任务链接到其它的网站
教师演示链接步骤。
第三任务创建邮件程序链接
在网页中插入文字，如“给我写信”，选中文字后，创建超级链接，链接到某一个电子信箱上，如zhangdeju@
第四任务超级链接的编辑
超级链接的编辑涉及到创建、修改与取消。
Ø反馈与矫正
在学生充分操作的基础上，对学生进行巡回辅导，解决存在的问题。
展示学生作品。
Ø课堂小结
本节主要学习超级链接、超级链接的创建、链接到其它网站、链接到电子信箱、重新超级链接。
教学随笔：
第8课创意大考验
◆课程描述
本节课要在网页中加上移动字幕、横幅广告、背景音乐等动态效果，为原本静态的网页增添活力。
◆教学目标
19．学会在网页加入移动字幕
20．在网页中加入背景音乐
◆教学过程
Ø复习与导入
上节课我们学习了超级链接的创建。
问：
如何创建超级链接？
都可以在哪些对象上创建？
大家上网浏览网页时可能看到移动字幕、广告，还可以听到动听的音乐，这在FrontPage2000中能不能实现呢？
Ø任务与活动
第一任务在网页中加入移动字幕“欢迎光临！
”
1．教师演示制作步骤：
第1步：
打开站点。
第2步：
将插入点光标移到要加入字幕的位置。
第3步：
选择“插入”→“组件”→“字幕”命令，在“字幕属性”对话框中输入文字“欢迎光临！
”，设置表现方式为“滚动条”，文本对齐方式为“顶边对齐”，选择适当的背景颜色。
第4步：
切换至“预览”窗口，观察我们设置的滚动字幕。
2．学生操作练习。
第二任务在网页中加入广告
在浏览别人网页时，经常会看到一些活动的广告图片。
我们可以通过横幅广告管理器，在网页中加入广告。
操作步骤：
第1步：
打开站点，选择网页。
第2步：
选择“插入”→“组件”→“横幅广告管理器”命令，在“横幅广告管理器属性”对话框中，选择适当的广告宽度和高度、过渡效果。
第3步：
在“横幅广告管理器属性”对话框中添加图片文件。
第4步：
切换至“预览”窗口，观察我们设置的横幅广告。
第三任务在主页中加入背景音乐
第1步：
选择合适的MIDI音乐文件。
第2步：
打开网站，选择网页。
第3步：
在主页中加入背景音乐。
在网页中单击鼠标右键，在快捷菜单中单击“网页属性”。
在“网页属性”对话框中，单击“背景音乐”的“浏览”按钮。
在“选择文件”对话框中寻找并选择音乐文件。
Ø反馈与矫正
学生分组操作，教师作巡回指导，解决学生中存在的问题。
展示学生作品。
Ø课堂小结
本节课主要学习了：
在网页加入移动字幕、广告，在网页中加入背景音乐。
选定学生回顾如何操作。
教学随笔：
第9课发布站点
◆课程描述
网页创作完之后，如何让更多的人浏览到自己的网页？
这就需要申请一个域名空间。
◆教学目标
21．测试网站
22．申请免费主页空间
◆教学过程
Ø复习与导入
我们在前一段时间主要是制作网页，在网页中加入文字、图片、音乐、广告、移动字幕、创建超级链接等，当我们制作完成之后，如何IE浏览器中预览？
如何发布出去？
今天，我们要申请一个免费空间，把我们的首页发布上去。
Ø任务与活动
第一任务继续完成网页的制作
第二任务测试网站
第1步：
启动FrontPage2000，打开站点。
第2步：
选择“查看”→“报表”→“站点总览”命令。
第3步：
在出现的站点总览画面中，我们可以清楚地看到有关我们站点的各项信息。
第4步：
用IE浏览器打开自己的网页进行查看。
打开存放自己网站的文件夹，并双击“index.htm”文件即可打开自己网站的主页。
第三任务了解发布站点所需的条件
条件一：
获得一个存放网页的空间。
现在，有很多ISP（因特网服务提供商）提供免费的主页空间。
如果想获得更好的服务，也可以向一些ISP申请收费的主页存放空间，当然对我们来讲，申请一个免费的主页空间就足够了。
条件二：
能通过某种方式与Internet连接。
第四任务申请免费主页空间
第1步：
启动IE浏览器。
第2步：
查找提供免费个人主页服务的网站。
如“派尔电子邮局”：
第3步：
地址栏内输入：
。
第4步：
在“派尔电子邮局”的网页中，单击“点击此申请建站”。
Ø反馈与矫正
指导学生申请免费空间。
Ø课堂小结
如何申请免费空间，其方法如同申请免费信箱一样。
教学随笔：
第10课综合实践
◆课程描述
通过前面九节课的学习，我们已经了解到有关建立网站和设计网页的基础知识。
但是，要制作一个专业性的网站，这些知识是远远不够的。
◆教学目标
1．培养学生综合运用知识的能力；
2．培养学生协作学习的能力；
3．培养自我评估的能力。
◆教学重点
网站设计与自我评估
◆教学过程
Ø复习与导入
回顾所学的知识：
在网站中创建网页；在网页中插入图片、设置背景；航栏与主题；网页中的表格；超级链接；在网页中插入组件；发布站点等。
今天，我们将综合以前所学的知识，独立建立一个简单的个人站点。
Ø任务与活动
一般情况下，建立一个站点需要以下几个步骤：
1．新建一个站点。
2．在站点中增加网页。
3．在网页中放入文字、图片、加入动态图象、超级链接等。
4．在IE浏览器中打开网站，进行测试。
5．发布网站。
三.第一任务建立一个班级网站
1．网站中网页的数量不少于4张。
2．采用某种主题。
3．要采用导航栏。
4．要求网页至少有两种不同的背景图案。
5．至少有一张网页有背景音乐。
6．其中一张网页要设置有文字及图片的超链接。
7．其中一张表格采用表格进行内容的编排。
8．其中一张要有动态字幕或横幅广告。
第二任务自我评估
Ø对学生作品进行综合评估。
Ø自我评估
教学随笔：
升级会员 