Frontpage教案

第一篇：Frontpage教案

作者：横溪中学 陈德星

《FrontPage网页制作》

一、教学目标：

1、知识与技能目标： a.掌握网页的基本操作；

b.掌握表格的使用及设置；

c.掌握文字的输入及其设置；

2、过程与方法目标：

通过老师的引导与学生的自主探索学习，掌握FrontPage各功能的使用；

3、情感态度与价值观目标：

培养学生自主探究，解决问题的能力；以及在设计网页的过程中，培养创新的精神。

二、教学重点难点：

重点：

1、掌握表格的使用及设置；

2、掌握文字的输入及其设置；

难点：掌握表格的使用及设置；

三、教学方法：

讲授法、任务驱动法

四、教学过程：

1、创设情景，导入新课

教师：在上课之前，先做一个调查，我们班有QQ的同学请举手！

作者：横溪中学 陈德星

学生：……

教师：很好，那么已经开通QQ空间的同学请举手！学生：……

教师：这样的形势，对于开展我们这节课有很大的帮助。我们这节课要学习的就是把每位同学的QQ空间在课堂上呈现出来。当然，可能有部分同学没有QQ，没有QQ空间的，也没有关系，这样的话更要好好学习这节课了，跟着老师的思路，一起搭建一个展示的平台。到时候，我们就比一比谁的空间更有创意更有吸引力，同学们有没有信心获胜？

学生：有……

教师：好的。这节课呢，我们就是要来学习通过FrontPage制作一个精简版的QQ空间。

2、探究学习，实践创新

教师：Frontpage的基本情况我们已经了解过了，他的界面跟我们以前学过的其他OFFICE组件都很相似，我相信大家待会通过自己的实践和摸索一定能够进一步的掌握。

接下来，就开始搭建我们的空间。

A、首先，我们的空间肯定必须有个落脚的地方，也就是说，每一个网站都必须有一个站点。

（新建文件夹，保存网页，网页标题、文件名等设置）； B、打开我们新建的网页，我们发现除了标题之外，什

作者：横溪中学 陈德星

么东西都没有，那么我们慢慢把它充实起来。搭建框架（表格、单元格、水平线等的设置）；

输入文字（文字的设置）；

插入图片（图片的设置）；

（示范完成后，学生根据提供的素材，根据自己的空间和创意设计出网页。）

3、作品评比，回顾小结

教师：很多同学都已经完成了自己的设计，刚才看到好几位同学做的非常的不错，我挑选了三位同学的作品，大家一起来投投票，看哪位同学的支持率最高！

（学生参与，评价……）

教师：当然，每一位同学用心完成的都是最好的。

我们来回顾一下这节课学习的知识点：

A、网页的新建和保存； B、表格的插入及属性设置； C、单元格属性设置；

D、文字、图片的插入及相应的设置； E、网页基本属性的设置；

第二篇：frontpage全套教案

frontpage全套教案

（一）第一节 启动frontpage2000建立站点和图片收集

一、教学目的：掌握站点的建立，学会软件的启动和素材的收集，了解站点的打开和关闭。

二、教学重点：创建站点，收集图片，启动frontpage2000。

三、教学时间：2课时

四、教学步骤：

1、启动FrontPage 2000 单击任务栏上的“开始”按钮,从“程序” 菜单中选择“Microsoft FrontPage”单击。

2、FrontPage 2000的界面说明

FrontPage 2000的界面可以分成菜单栏、工具栏、视图栏和主编辑窗口4大部分。①、菜单栏包括【文件】、【编辑】、【查看】、【插入】、【格式】、【工具】、【表格】、【框架】、【窗口】、【帮助】等10个菜单。工具栏单击【查看】菜单，选择【工具栏】，在出现的下拉菜单中列出了几种不同的②、工具栏，如果菜单项前面有一个对钧号“√”，表明在界在上已显示此菜单项。如果再单击一下，将取消这一项的显示。

③、视图栏中摆列着各种管理器的图标，这些管理器包括网页管理器、文件夹管理器、报表管理器、导航管理器、超链接管理器和任务管理器等。单击管理器图标以切换到相应的管理器。

④、主编辑窗口在编辑网页时，有3种显示方式，即普通、HTML和预览。普通显示方式是最常用的显示方式，一般是在此方式下工作。

HTML显示方式在需要直接编辑或查看网页文件的HTML代码时使用，一般是为了实现某种特殊效果（如在网页中动态显示时间）而经常使用。

预览显示方式在需要预先观察网页的显示效果时使用。当使用管理功能时，主编辑窗口相应地会显示各种任务下的文件或站点信息。什么是站点？

站点一般简写为“Web”，实际上就是把一些信息通过Web网页的方式相互链接起来，存放在一台被称为“服务器”的计算机中，别人可以通过Web浏览器查看网页信息。站点一般以国际通用的Internet地址来表示，例如：http://www.xiexiebang.com或http://www.xiexiebang.com”，按回车键。输入“很高兴能认识您，希望能和您交朋友！”，按回车键；输入“谢谢您参观我的网页，再见！”，按回车键。

4、字体设置

（1）、选定文字 选定文字的方法有两种：

①一种方法是将鼠标指针移到待选文字段的开头，按住鼠标左键，不要松手，然后向右下方拖动，将该段文字涂黑；

②另外一种方法就是用键盘上的光标箭头将插入点移到选定文字的开头，然后左手按着Shift键，右边按光标移动键（如←、↑、→、↓键），也可将所选定文字涂黑。（2）、修饰文字

修饰文字是指文字的字体、字型、大小（字号）、颜色、效果的设置。例：选定“这是我的第一个主页”文字后，设定文字属性的操作有以下两种： ①单击【格式】菜单项，选择【字体】后出现字体对话框；

②或单击鼠标右键，在弹出的对话框中单击【字体】选项，也将出现字体对话框。③这时在对话框中的字体设为“隶书”，字型为“加粗”，大小为“6（24磅）”，颜色为“红色”，效果为默认。单击【确定】按钮即可完成文字修饰。例中其他字体修饰的操作也类似进行。

5、保存网页

单击常规工具栏上的“

”，或单击【文件】菜单再选择【保存文件】，就可以把正在编辑的网页保存起来。或直接按Ctrl＋S键也可以保存网页。

如果你是在修改已经保存过的网页，修改过的网页将被重新保存。但如果是新建的网页，单击“ ”后会出现对话框。

在对话框中的【文件名】栏内输入网页的文件名（如“First”），单击【保存】按钮，该网页就会保存到当前的站点上。FrontPage 2000保存文件的类型主要有网页文件（.htm）、FrontPage模板（.tem）、文本文件（.txt）、超文本模板文件（.htt）等。

6、关闭网页

（1）、单击【文件】菜单并选择【关闭】，或直接按Alt＋F4键，如果此时网页文件未保存，就会出现一个提示对话框。

（2）、当单击对话框中的【是】按钮时，将出现保存网页对话框，输入网页文件名并单击【保存】按钮后，网页文件将被关闭；当单击【否】按钮时，该网页文件不保存并关闭；当单击【取消】按钮时，该网页文件不关闭，并返回主编辑窗口。

7、打开网页

（1）、单击“ ”工具图标，或单击【文件】菜单并选择【打开】，或直接按Alt＋O键，出现一个打开文件对话框。

（2）、在对话框中单击【查找范围】下拉列表框，选择文件路径。在文件列表区中列出被选中该文件路径下的所有文件。

（3）、选中一个文件，然后单击【打开】按钮，或直接双击该文件名即可打开文件。

8、预览网页

网页编辑完成后，可以用浏览器预览一下网页的效果。有两种预览网页的方式：

（1）、一种是单击FrontPage 2000主编辑窗口下面的【预览】标签，就打开一个FrontPage编辑器自带的浏览器，看完之后，单击【普通】标签，又切换到编辑状态。

（2）、另一种是单击【常规】工具栏的“ ”图标按钮（或直接按Ctrl＋Shift＋B键，或单击【文件】菜单并选择【在浏览器中预览】菜单项），将启动已安装好的浏览器并打开该网页。如果在预览之前没有把修改后的或新建的网页保存起来，则将弹出一个对话框提示你应该首先保存该网页。

注意：在预览窗口中看到的是网页在发布后的大致样式。要看到网页在www.xiexiebang.composer软件，修改完图片后，只要退出该软件，网页图片就会自动更新。【类型】：我们可以选择图片的类型，GIF或者是JPEG。在“质量”栏内一般设定为70-80就行了。

【替代表示】：如果当前图片较大，分辨率也较高，我们应该在【低分辨率】中选定一个备用的低分辨率图像，这样在一些浏览网页的低档机显示器不能显示高分辨率图片时，可以显示这个低分辨率的图片。此外，在“文本”栏内默认值为图片文件名加上文件长度，这是当

该图片不能显示时，这些说明文字会显示出来，也就常说的图片的别名。若要修改图片的别名时，在文本框内输入即可。

2、图像的外观

单击【图片属性】对话框中的【外观】选项卡。在这个对话框中，我们可以设置图片与文本之间的对齐方式、图片的边框粗细以及图片的大小等。布局栏：

单击【对齐方式】下拉箭头，出现一个下拉菜单，有多种对齐方式，在图文混排时非常有用，大家可以试试看。

利用【边框粗细】可以在图片周围加上一个指定宽度的边框。值为0时，边框不显示。设置【水平间距】和【垂直间距】的值，可以改变图片与相邻内容（如文字）之间的距离。默认情况下，浏览器中显示的网页图片是实际大小的图片。如果要改变图片的大小，则在对话框的【大小】栏中调整“宽度”、“高度”的值（单位为像素或百分比）。选择“保持纵横比”选项是防止尺寸修改后的图片出现太扁或太长的“变形”现象。

图片的定位，可以单击图片工具栏的图片定位按钮。图片可以随便移动，但在预览时常会与实际不一致。三）上机操作：

在网页中插入合适的图片。第四节 项目符号与编号列表

一、教学目的：学习使用项目符号，理清条理，理解做事步骤。

二、教学重点：编号列表，图片项目符号列表，多级列表。

三、教学时间：2课时

四、教学步骤： 一）编号列表

编号列表是在实际应用中最为常见的一种列表，编号列表的各列表项以某种形式的顺序进行排列。下面我们以一个实例说明。其操作步骤如下：

1、新建一个空白网页，输入“我的兴趣和爱好”标题，按回车键；

2、单击“ ”工具图标，在网页中出现“1.”，在这个编号后面输入“看书”；

3、按回车键后，在“2.”后面输入 “上网”；

4、重复上述步骤，直到出现编号“5.”。在其后面输入“踢足球”，然后按Shift＋回车键，再输入“打网球”，按回车键；

5、在编号“6.”行上按回车键，该编号就会在屏幕上消失了；

6、将网页文件保存起来，并在浏览器中浏览。

另外，在编号列表中，列表符号可以是数字，也可以是其他符号，这些符号有：（1）大写罗马数字：如Ⅰ.、Ⅱ.、Ⅲ.、Ⅳ.、„；（2）小写罗马数字：如ⅰ.、ⅱ.、ⅲ.、ⅳ.、„；（3）大写英文字母：如A.、B.、C.、D.、„；（4）小写英文字母：如a.、b.、c.、d.、„。当需要改变列表编号时，其操作过程大致如下：

1、将光标定位在一个列表所在行的任意位置。

2、然后单击鼠标右键，这时将弹出一个对话框，单击其中的【列表属性】选项，出现列表

属性对话框。（或者单击【格式】菜单，选择【项目符号和编号】菜单项亦可。）

3、此时在对话框中打开的是【编号】选项卡。

4、单击不同的选择框，然后单击【确定】按钮，就可以选择不同样式的项目编号。二）项目符号列表

与编号列表不同，在项目符号列表中各列表项都是通过一个特殊符号引出的。下面以一个项目符号列表的实例来说明。其操作步骤如下：

1、新建一个空白网页，输入“我喜欢看的文学名著”，按回车键；

2、或单击“

”工具图标，在网页中出现一个黑点列表符号，在列表符号后面输入“《三国演义》（罗贯中）”；

3、按回车键后，在下一行又出现一个黑点列表符号，依次输入“《水浒传》（施耐庵）”，按回车键；

4、重复上述步骤，直到把“《西游记》（吴承恩）”、“《神曲》（但丁）”全部输入计算机中；

5、在最后出现的黑点列表符号行上，再按一次回车键，该黑点就会在屏幕上消失了；

6、将网页文件保存起来，并在浏览器中浏览。三）图片项目符号列表

图片项目符号列表是一种特殊形式的列表，列表符号均由指定的图片引出列表项。在FrontPage2000中，用于列表的图片可以是软件自带的图片，也可以是你所指定的图片。下面我们以一个图片项目符号列表的实例操作进行讲述。具体操作过程如下：

1、新建一个空白网页，输入“21世纪的科学技术”，按回车键。选定这段文字，并设置为6号字、宋体、加下划线；

2、单击【格式】菜单项，然后选择【项目符号和编号】菜单项，出现项目符号和编号方式对话框，此时打开的是【图片项目符号】选项卡。

3、选择【指定图片】，单击【浏览】按钮，出现选择图片对话框。

4、单击对话框右下角的【剪贴画】按钮，就会弹出【剪贴画库】。选择并单击【Web符号】选项，从中选择一种图片（例中是“ ”），选中后单击“ ”插入剪辑按钮。网页上就会出现这个图片符号。

提示：如果要指定磁盘图片文件作为项目符号，则在【选择图片】对话框中单击“ ”按钮，出现一个选择文件对话框后，再选定硬盘目录上的一个图片文件，依次单击【确定】按钮后即可。

5、在图片符号后，输入“信息科学技术”，并按回车键；

6、重复上述步骤，直到把“生物科学技术”、“材料科学技术”等全部输入计算机中；

7、在最后的图片项目符号行上按回车键，该符号就会在屏幕上消失了；

8、将网页文件保存起来，并在浏览器中浏览。四）多级列表

前面分别介绍了几种列表方式。但在实际应用中，各种列表往往同时混合使用，有时还需要使用多级嵌套列表。

下面创建一个多级列表的实例。其操作过程如下：

1、从【样式】下拉菜单中选择“标题3”，输入“我最喜欢的电影”，按回车键；

2、单击“ ”工具图标，在编号“1.”后面输入“最喜欢的中国电影”，按回车键。接着再输入“最喜欢的外国电影”；

3、以下是“最喜欢的中国电影”嵌套列表的操作：

把插入点移到列表项目“最喜欢的中国电影”的末尾，按回车键，新出现编号为“2.”的空列表行；

连续两次单击“ ”工具图标（增加缩进），或连续按Ctrl＋M键，新出现的编号“2.”消失，后面的标号恢复正常。光标比上一行的位置缩进了两个字符，在光标位置出现了新的标号“1.”。

单击鼠标右键，这时将弹出一个对话框，单击其中的【列表属性】选项，出现列表属性对话框。此时打开的是【编号】选项卡。

在【编号】选项卡中选择大写罗马数字列表方式，然后单击【确定】按钮，列表符号变为“Ⅰ.”。接着输入“开国大典”，按回车键；输入“生死抉择”，按回车键；输入“花季雨季”。

4、以下是“最喜欢的外国电影”嵌套列表的操作：

把插入点移到列表项目“最喜欢的外国电影”的末尾，按回车键，新出现编号为“3.”的空列表行；连续两次单击“ ”工具图标（增加缩进），或连续按Ctrl＋M键，新出现的编号“3.”消失。在光标位置出现了新的标号“1.”。

单击鼠标右键，这时将弹出一个对话框，单击其中的【列表属性】选项，出现列表属性对话框。此时打开的是【编号】选项卡。

单击【无格式项目列表】选项卡，并从中选择方块符号列表方式。然后单击【确定】按钮，列表符号变为“ ”。接着输入“魂断蓝桥”，按回车键；输入“生死时速”，按回车键；输入“飘”。

5、在结尾的项目符号行上连续按回车键，直到该符号在屏幕上消失为止；

6、将网页文件保存起来，并在浏览器中浏览。五）、上机操作：

在网页上练习项目符号与编号列表

第三篇：frontpage网页制作教案

Frontpage网页制作导学案

青州一中

刘志韩

文件——新建——网页 【学习目标】

1、包括网页制作基础知识

2、站点的规划和创建

3、网页文本和图片的处理、表格和框架的应用 【学习重难点】

1、建立一个主题网站

2、建设一个网站的步骤

3、网页的美化与特效的制作 【课前预习】

思考一下多媒体信息集成的方式有哪些？

【自主学习】

1、在www中，________是信息的主要组织和表现形式。

2、用________语言编写的网页实际上是一种文本文件，以.HTML或者.HTM为扩展名，可以使用任何文本处理软件（如记事本、word等）创作或修改。

3、制作网页常用的软件有_________________和_________________。

4、网页文件的扩展名有哪些？

5、网站开发的基本过程：

网站的规划——（）——（）——网站的发布与管理——网站的评价 【合作探究与指导】

三、网站的制作

1、创建站点

文件——新建——站点（选择或创建存储站点的文件夹）

2、网页的创建与编辑

3、插入对象 水平线 图片 字幕 悬停按钮

4、创建超级链接

在对象上右击选择超级链接——选择链接的目标。

5、使用表格

表格——插入（在制作网页的过程中用表格来布局网页）

6、在站点中查看网页的编辑及网页之间的链接情况。

分步骤操作练习题：

1、新建一个站点，只有一个空白网页的站点。

2、在首页上插入“我最喜爱的明星”，然后进行修饰。

3、再新建一个空白网页。重新命名为“周杰伦”。

4、插入图片“周杰伦”，文本“周杰伦”，排版设置后保存网页。

5、再建立一张空白的网页，重新命名为“刘亦菲”。

6、插入图片“刘亦菲”，文本“刘亦菲”，排版设置后保存网页。

7、分别在首页和“周杰伦”“刘亦菲”网页建立超级链接。操作练习： 【拓展任务】

以环保为主题，利用文件夹“环保”中的素材，制作一个5页的网站。

【当堂检测】

1.在网页制作中，我们经常用下列（）办法进行页面布局。

A.文字

B.表格

C.表单

D.图片 2.使用浏览器访问网站时，第一个被访问的网页称为（）。

A.网页

B.网站

C.HTML语言

D.主页 3.网页中可使我们进行选择性浏览的称为（）。

A.文字

B.图片

C.声音

D.超链接

4.在FrontPage2000中，要建立同一个网页内的链接点，让你点选某一链接后，迅速跳到同一网页内的另一个特定位置，应采用（）链接。

A.单元格

B.表单

C.书签

D.表格 5.FrontPage 2000中，下述关于图片与链接的关系表述正确的是（）。

A.图片不能建立链接

B.一张图片只能建立一个链接

C.图片要建立链接需经过处理

D.通过设置热区，一张图片可建立多个链接 6.在FrontPage 2000“网页”视图模式下，单击“普通”标签后，在出现的“普通”窗口中，可直接进行（）。

A.网页编排

B.观察网页在浏览器中的效果

C.编辑HTML代码

D.下载图片 7.网页制作的超文本标记语言称为（）。

A.VB语言

B.HTML语言

C.BASIC语言

D.ASCII 8.在Frontpage2000网页视图方式下，单击（）标签可直接编辑HTML代码？

A.普通

B.HTML

C.预览

D.编辑 9.在FrontPage 2000中，我们想要文字左右交替移动的效果，是下列（）效果。

A.字体

B.DHTML效果

C.字幕

D.悬停按钮 10.在FrontPage 2000表格单元格中，（）项目不能输入。

A.表格

B.图形

C.背景

D.声音

作业：以我们寒假生活为主题，从互联网上搜索的素材制作一个网站。

【阅读材料】

网站设计

建立一个网站就像盖一幢大楼一样，它是一个系统工程，有自己特定的工作流程，你只有遵循这个步骤，按部就班地一步步来，才能设计出一个满意的网站。

一、确定网站主题

网站主题就是你建立的网站所要包含的主要内容，一个网站必须要有一个明确的主题。特别是对于个人网站，必须要找准一个自己最感兴趣内容，做深、做透，办出自己的特色，这样才能给用户留下深刻的印象。

二、搜集材料

明确了网站的主题以后，你就要围绕主题开始搜集材料了。常言道：“巧妇难为无米之炊”。要想让自己的网站有血有肉，能够吸引住用户，你就要尽量搜集材料，搜集得材料越多，以后制作网站就越容易。材料既可以从图书、报纸、光盘、多媒体上得来，也可以从互联网上搜集，然后把搜集的材料去粗取精，去伪存真，作为自己制作网页的素材。

三、规划网站

网站设计得成功与否，很大程度上决定于设计者的规划水平，规划网站就像设计师设计大楼一样，图纸设计好了，才能建成一座漂亮的楼房。网站规划包含的内容很多，如网站的结构、栏目的设置、网站的风格、颜色搭配、版面布局、文字图片的运用等，你只有在制作网页之前把这些方面都考虑到了，才能在制作时驾轻就熟，胸有成竹。

四、选择合适的制作工具

网页制作涉及的工具比较多，首先就是网页制作工具了，目前大多数网民选用的都是所见即所得的编辑工具，这其中的优秀者当然是Dreamweaver和Frontpage了，如果是初学者，Frontpage2000是首选。除此之外，还有图片编辑工具，如Photoshop、Photoimpact等；动画制作工具，如Flash、Cool 3d、Gif Animator等；还有网页特效工具，如有声有色等，五、制作网页

材料有了，工具也选好了，下面就需要按照规划一步步地把自己的想法变成现实了，这是一个复杂而细致的过程，一定要按照先大后小、先简单后复杂来进行制作。

六、上传测试

网页制作完毕，最后要发布到Web服务器上，才能够让全世界的朋友观看，利用这些FTP工具，你可以很方便地把网站发布到自己申请的主页存放服务器上。网站上传以后，你要在浏览器中打开自己的网站，逐页逐个链接的进行测试，发现问题，及时修改，然后再上传测试。

七、推广宣传

网页做好之后，还要不断地进行宣传，这样才能让更多的朋友认识它，提高网站的访问率和知名度。推广的方法有很多，例如到搜索引擎上注册、与别的网站交换链接、加入广告链等。

八、维护更新

第四篇：Frontpage练习

Frontpage复习题

一、选择题：

1、浏览器是浏览网页的软件，目前常用的浏览器是：(A．Outlook Express)

D．Foxmail

B．Internet Explorer C．Microsoft FrontPage

()

D：记事本

2、下列软件中，不是网页制作工具的是：

A：Access B：Dreamweaver

C：FrontPage

（）（3、下面哪一个不是网页的扩展名： A：.htm B：.html

C：.php D：.xls)

4、文字建立链接后，通常在文字的下方会产生

A：波浪线 B：下划线

C：着重号

D：以上都不对()

5、FrontPage保存的默认文件名为： A：文档1.xls B：book1.xls

C：newpage1.htm D：无标题.xls ６、表格边框线的粗细设置为（），在预览方式下表格线不可见。

A：1

B：2

C：

D：0 ７、新建网站默认路径是（）

Ａ：C:My DocumentsMy WebsMyweb

Ｂ：Ｄ:My DocumentsMy WebsMyweb Ｃ：C:My WebsMyweb

Ｄ：C:My Web ８、网站与文件夹的区别，下面的说法正确的是：（）

A:没有太大的区别

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语言编辑网页。()

10、主页的文件一般为：index.htm, index.html或default.htm、default.html

（）

第五篇：FrontPage全套教案（xiexiebang推荐）

Frontpage网页制作知识准备

教学目标：

1、通过对网站的赏析活动，进一步认识网站、首页，为网页制作做知识储备。

2、培养学生的合作学习能力、探究问题的兴趣与能力。

3、培养学生的鉴赏能力。

4、激发学生为祖国信息产业的发展作贡献的爱国情感。

教学重点：

1、首页的地位和作用

2、首页的功能模块

3、网站的形式、内容与主题之间的关系

教学难点：

正确理解网站的形式、内容与主题之间的关系

课时：1课时

教学步骤：

一、导入：

近年来，我国的信息产业飞速发展，人们的经济文化水平日益提高，越来越多的家庭拥有了个人电脑，网络也由昔日的谢玉堂前燕，飞入了寻常百姓家。足不出户，鼠标轻轻一点，你就可以浏览到世界各地的信息，就可以和世界各地的朋友们聊天，你还可以给世界各地的朋友们发E-mail。网络的确给人们带来了极大的快捷与方便。

作为一名初中生，你想不想也能在网上拥有自己的一片天空、一个家园呢？

今天我们就开始你网上家园的建设之路。

二、小组分工、合作学习：

（一）介绍基本概念

鉴赏一个网站，我们一般要从以下几个方面着手，一个是网站的主题，所谓网站的主题是指网站向大众或特定的人群传达的主要内容或建立网站的意图。第二个就是网站的首页。所谓网站的首页，就是指你打开一个网站后看到的第一页。下面

我们小组内分工合作，小组内讨论分析以下三个问题：

1、每个网站的主题是什么？。

2、首页在网站中有什么地位和作用？

3、首页有哪些功能模块？

（二）小组合作学习，初步探讨鉴赏网站的方法

学生之间相互讨论，探究问题的答案

多数学生得出结论，小组选代表汇报讨论成果

教师小结

一个网站必须有一个明确的主题，就好像我们写文章也要有明确的中心一样，否则，浏览者就会有不知所云的感觉。

第二个问题的答案显而易见，不再提问，教师直接小结提问学生一起回答。

首页是浏览者打开一个网站后第一眼看到的就是网站的首页，网站能不能吸引浏览者，在很大程度上取决于首页做得怎么样。

能不能用一个词来概括一下首页的地位与作用？

第三个问题，仍由小组选代表汇报结论

哪个小组来告诉大家你们讨论的结果？

教师小结：

首页一般有四个共有的模块，（1)徽标（logo）和网站的名称：

一般位于左上角，是一个形象化的标志，其作用类似于商品的商标。

（2)首页大标题（banner）：

一般放网站主题词或图片，商业性的网站放置广告条。

（3)导航栏：

就像一本书或杂志的目录一样，但比书籍或杂志的目录更为重要，因为书籍我们可以一页一页的从头向后翻，而我们的网页却不可以，只有有了清楚、明晰的导航，才能让浏览者知道自己身处网站的什么位置。

（4)版权和联系方式：一般放在网页的底部，主要功能是版权声明和听取浏览者的意见或建议。

（三）再次小组合作学习，深入领会如何鉴赏网站

鉴赏获奖的学生网页作品，激发学生的积极性与自信心同时更深入的学习如何鉴赏一个网站。

我给大家带来了几个获全国一等奖的学生网页作品，你可以在你的电脑D盘student文件夹下看到她们。

小组合作，讨论分析以下三个问题：

1、这些网站的首页的布局各有什么特点？（教师演示）

2、各网站的主题色和配色有什么特点？

3、网站的形式、内容与主题之间有什么关系呢？

小组讨论

汇报分别讨论成果

三、延伸：

接下来，同学们可以自由浏览一些其他的网站，把你认为较好的网站推荐给大家。

四、总结

下面我们来一起回顾一下这节课我们都学了哪些内容。

1、首页在网站中起着关键的作用，它主要有四个共有的模块：他们人别是Logo，Banner，导航，还有版权和联系方式；

2、首页的布局主要有三种样式，一种是“口”字型，一种是“厂”字型，还有一种是“POP”型；

3、网页的在色彩的选择上也要为表现主题服务；

4、网站的要有一个明确的主题，要以内容为核心，以形式为辅助，内容和形式共同为表现主题服务。

好，有了以上的知识作为奠基，你就可以充分发挥你的想象，好好描绘一下你的网站的蓝图了。

第二节 启动frontpage2003建立站点和图片收集

教学目的：

掌握站点的建立，学会软件的启动和素材的收集，了解站点的打开和关闭。

教学重点：

创建站点，收集图片，启动frontpage2003。

教学时间：

2课时

教学步骤：

1、启动FrontPage 2003 单击任务栏上的“开始”按钮,从“程序” 菜单中选择“Microsoft FrontPage”单击。

2、FrontPage 2003的界面说明

FrontPage 2003的界面可以分成菜单栏、工具栏、视图栏和主编辑窗口4大部分。

①、菜单栏包括【文件】、【编辑】、【查看】、【插入】、【格式】、【工具】、【表格】、【框架】、【窗口】、【帮助】等10个菜单。

工具栏单击【查看】菜单，选择【工具栏】，②、在出现的下拉菜单中列出了几种不同的工具栏，如果菜单项前面有一个对钧号“√”，表明在界在上已显示此菜单项。如果再单击一下，将取消这一项的显示。

③、视图栏中摆列着各种管理器的图标，这些管理器包括网页管理器、文件夹管理器、报表管理器、导航管理器、超链接管理器和任务管理器等。单击管理器图标以切换到相应的管理器。

④、主编辑窗口在编辑网页时，有3种显示方式，即普通、HTML和预览。普通显示方式是最常用的显示方式，一般是在此方式下工作。

HTML显示方式在需要直接编辑或查看网页文件的HTML代码时使用，一般是为了实现某种特殊效果（如在网页中动态显示时间）而经常使用。

预览显示方式在需要预先观察网页的显示效果时使用。当使用管理功能时，主编辑窗口相应地会显示各种任务下的文件或站点信息。

什么是站点？

站点一般简写为“Web”，实际上就是把一些信息通过Web网页的方式相互链接起来，存放在一台被称为“服务器”的计算机中，别人可以通过Web浏览器查看网页信息。站点一般以国际通用的Internet地址来表示，例如：http://www.xiexiebang.com或http://www.xiexiebang.composer软件，修改完图片后，只要退出该软件，网页图片就会自动更新。【类型】：我们可以选择图片的类型，GIF或者是JPEG。在”质量”栏内一般设定为70-80就行了。

【替代表示】：如果当前图片较大，分辨率也较高，我们应该在【低分辨率】

中选定一个备用的低分辨率图像，这样在一些浏览网页的低档机显示器不能显示高分辨率图片时，可以显示这个低分辨率的图片。此外，在”文本”栏内默认值为图片文件名加上文件长度，这是当该图片不能显示时，这些说明文字会显示出来，也就常说的图片的别名。若要修改图片的别名时，在文本框内输入即可。

2、图像的外观

单击【图片属性】对话框中的【外观】选项卡。在这个对话框中，我们可以设置图片与文本之间的对齐方式、图片的边框粗细以及图片的大小等。

布局栏：

单击【对齐方式】下拉箭头，出现一个下拉菜单，有多种对齐方式，在图文混排时非常有用，大家可以试试看。

利用【边框粗细】可以在图片周围加上一个指定宽度的边框。值为0时，边框不显示。

设置【水平间距】和【垂直间距】的值，可以改变图片与相邻内容（如文字）之间的距离。

默认情况下，浏览器中显示的网页图片是实际大小的图片。如果要改变图片的大小，则在对话框的【大小】栏中调整”宽度”、”高度”的值（单位为像素或百分比）。选择”保持纵横比”选项是防止尺寸修改后的图片出现太扁或太长的”变形”现象。

图片的定位，可以单击图片工具栏的图片定位按钮。图片可以随便移动，但在预览时常会与实际不一致。

（三）练习操作：

在网页中插入合适的图片。

FrontPage基本使用方法

教学目的：

1、学习了解FrontPage的基本使用方法

2、了解“模板”的使用

3、掌握FrontPage基本使用方法，制作一个简单的网页

教学重点：

文字、图片、超级链接、保存

教学难点：

超级链接

课时分配：

1课时

教学过程：

一、导入：

HTML语言难记难掌握，使用FrontPage可以远离HTML的烦恼，轻轻松松地制作主页。

二、启动FrontPage（学生动手）。

套用模板（老师演示，学生动手）。

选择“新建”，在众多样式中选择需要套用的模板。本节课选“普通网页”即空白网页。

三、网页属性（老师演示，学生动手）。

选择“文件”菜单下的“属性”，网页属性的主要内容有：标题、背景和文本颜色、超级链接设置。

标题任取。但为了区别超级链接是否被访问过，最好用大家约定俗成的颜色（没被访问的链接用蓝色，已访问过的链接用紫色，正在点击的链接用红色）。如果想加背景，可在“背景”中选beijing.jpg。

四、制作方法（老师演示，学生动手）。

1、标题：例如输入“欢迎浏览我班网页”。

2、文字：与WPS类似自己输入。

3、图片：“插入”→“图片”→合适图片；图片往往能起到画龙点睛的作用。

4、超级链接：超级链接是网页中最重要的功能，通过链接可访问其他网站和网页。

例如：让别人访问“我的简介”这个链接，可这样：选中“我的简介”→右击→URL→“链接到计算机上的文件”→个人简历.htm。

5、保存（学生动手）。

文件保存于“我的文档”中，文件名自定。

五、制作简易网页（学生动手）。

六、教师讲评。

小

结：本节学习网页制作最基本步骤，要想主页吸引人，以后将学习对文字、图片的排版布局、美化加工。