1、第第8章章 网网 页页 制制 作作第8章 网 页 制 作8.1 网页概述8.2 HTML语言基础8.3 使用FrontPage制作网页8.4 网站发布与测试习题8第第8章章 网网 页页 制制 作作8.1 网网 页页 概概 述述8.1.1 网页基本组成网页基本组成1文本文本文本是网页展示信息的主体，它能够准确地表达信息的内容和含义。为了克服文字外观单调的缺点，在网页中通过设置文字的颜色、式样、底纹等属性改变其外观，以突出要显示的内容。第第8章章 网网 页页 制制 作作2图片图片图片的主要用途是对网页进行装饰以表达制作者的个人情调或网站的风格，另外也用于展示用文字难于表达或不能准确表达的信息，如对
2、产品的展示。网页中可以直接使用的图片格式有JPEG、PNG和GIF。3超链接超链接超链接可以说是万维网的灵魂，是万维网得以流行的主要因素。它是从一个网页的热点指向目的端的指针。通过它用户可以快速地找到并打开所需的资源，而并不需要知道此资源的具体位置(URL地址)。第第8章章 网网 页页 制制 作作4表格表格表格在网页中用于控制信息的布局方式。其主要用途包括两个方面：一是用行和列的形式来布局文本和图像以及其他列表化数据；二是使用表格来精确控制各种网页元素在网页中出现的位置以及对网页进行布局。5表单表单表单是用户和Web服务器交互的基本工具。表单由不同功能的表单域组成，用户可以通过这些表单域输入文
3、本、选择选项、上传文件等，网页制作者可以通过表单来收集用户的信息、反馈意见等。第第8章章 网网 页页 制制 作作6视频和音频视频和音频随着网络技术的不断发展以及用户对网页表现力的要求不断提高，视频和声音已逐渐成为重要的网页元素。通过视频和声音可以给用户传递更为丰富的信息。7其他网页元素其他网页元素网页中除了以上提到的几种元素外，还有一些其他元素，包括Java Applet、ActiveX、CSS、JavaScript等，它们不仅能点缀网页，使网页更加活泼，而且重要的是可以扩展网页的功能，在网上娱乐、电子商务等方面有很重要的应用。第第8章章 网网 页页 制制 作作8.1.2 常用网页制作工具常用
4、网页制作工具1文本编辑器文本编辑器网页文件是一个纯文本文件，因此，用任何一款文本编辑器都可以编辑网页。需要注意的是，在保存网页时，网页扩展名必须为.html或.htm。使用文本编辑器编辑网页时，只有制作者对标记的功能及其属性非常了解，才能顺利地完成网页的编辑。常用的文本编辑器有Windows自带的记事本、Editplus、UtraEdit等。第第8章章 网网 页页 制制 作作2专用网页制作工具专用网页制作工具常用的专用网页制作工具有：(1)Microsoft公司的FrontPage。FrontPage是目前最常用的中文版网页制作工具之一，它简单易学，提供网页向导、网页编辑、表单与框架页技术，在
5、音频与视频插件、动态HTML技术、数据库连接等方面表现得都非常出色，用户可以在向导的指引下，简单而快速地完成网页的制作。第第8章章 网网 页页 制制 作作(2)MacroMedia公司的Dreamweaver。Dreamweaver是一款非常优秀的所见即所得的网页编辑工具。它是第一套针对专业Web页设计师的视觉化Web页开发工具，利用它可以轻而易举地制作出跨越平台限制和浏览器限制的充满动感的Web页。它支持最新的CSS(层叠样式表)、层(Layer)和XML(可扩展标记语言)。它附有站点管理功能，通过这个功能可以方便地设计、管理多个站点；另外还有FTP功能，可以方便地将站点上传或下载。第第8章
6、章 网网 页页 制制 作作8.1.3 网站网站所谓网站(WebSite)，就是作者或网站管理员根据一定的规则，将内容相关的网页、图片、视频和音频等信息集合在一起，存放在一台Web服务器中供用户浏览。简单地说，网站就是相关网页的集合，就像一个报亭供读者来浏览信息，而报亭中的报纸就好比网站中的网页。网站通过Internet为用户提供浏览网页的服务。第第8章章 网网 页页 制制 作作8.2 HTML语言基础语言基础8.2.1 HTML概述概述HTML的全称是Hyper Text Markup Language，即“超文本标记语言”，它是用于建立网页的一种语言，其目的是将存放在一台计算机中的文本或图形
7、与另一台计算机中的文本或图形方便而有机地联系在一起，形成有机的整体，而不用考虑具体信息是在本地计算机还是在网络上的其他计算机中。第第8章章 网网 页页 制制 作作1HTML标记语法标记语法HTML是一种描述语言，用于描述网页内容的显示格式。标记就是进行格式描述的最基本元素，HTML通过不同的标记及其属性来告诉浏览器指定的内容如何显示。第第8章章 网网 页页 制制 作作在HTML中，所有的标记符都用尖括号括起来，并且一般都成对出现，即包括开始标记符和结束标记符，其目的是定义标记符所影响的范围。结束符和开始符的区别是结束符的前面有一个斜线。例如：黑体显示，标记的作用范围只影响和之间的文字，而不会影
8、响标记符以外的文字。第第8章章 网网 页页 制制 作作标记的一般格式：格式化对象说明：标记名：由一个或多个英文字母组成，指明“格式化对象”基本的显示格式。属性：更详细地控制“格式化对象”的显示格式。属性可以指定多个，每组属性名和属性值之间用一个或多个空格分隔；也可以不指定，而使用默认属性值。第第8章章 网网 页页 制制 作作2网页的基本结构网页的基本结构一个Web页实际上对应于一个HTML文件，HTML文件以.html或.htm为扩展名，它是一个纯文本文件。一个Web页的基本结构如下：第第8章章 网网 页页 制制 作作 Web页基本架构 第第8章章 网网 页页 制制 作作3制作一个简单的网页制
9、作一个简单的网页下面介绍使用记事本创建第一个简单的网页。例8-1 创建第一个网页。启动记事本软件，在记事本中输入如下代码：我的第一个网页 第第8章章 网网 页页 制制 作作静夜思床前明月光，疑是地上霜。举头望明月，低头思故乡。第第8章章 网网 页页 制制 作作在保存文件的对话框的“保存类型(T)：”中选择“所有文件”，“文件名”设定为“first.htm”，保存到桌面上，然后双击此文件便会看到如图8-1所示的结果。第第8章章 网网 页页 制制 作作图8-1 第一个简单网页第第8章章 网网 页页 制制 作作8.2.2 HTML标记标记1页面属性设置页面属性设置页面属性主要指网页的背景颜色或背景图
10、片、网页中整体字体的颜色及超链接的颜色等。这些项目通过标记的属性来设置，具体属性使用方法如下：第第8章章 网网 页页 制制 作作(1)Bgcolor=色彩单词或色彩值，用于设置背景的颜色。(2)Background=图片所在路径及图片名，用于设置背景的图片。(3)Text=色彩单词或色彩值，用于设置网页中文字的整体颜色 第第8章章 网网 页页 制制 作作在设置背景图片后，背景色将不再起作用。背景图片的大小不能控制，当图片较小时，浏览器会在水平和垂直方向重复图片，使其充满整个浏览器的窗口。网页中可以使用的图片格式有JPG、PNG和GIF。如图8-2所示的效果由例8-2产生，图8-3为背景图片。第
11、第8章章 网网 页页 制制 作作图8-2 页面设置第第8章章 网网 页页 制制 作作图8-3 背景图片第第8章章 网网 页页 制制 作作2文本标记文本标记(1)段落标记。标记用于创建一个段落，在和之间的内容将以段落的格式显示。(2)标题标记。用于在正文中显示不同级别的标题，n取值为16的整数表示6级标题，为最大号标题，向下依次递减。每个标题为一个段落。(3)水平线标记。的作用是在标记所在的位置插入一条水平线，将上下文内容分为两部分。标记的属性及功能如表8-1所示，它用于控制水平线的显示效果。第第8章章 网网 页页 制制 作作表表8-1 标记的属性及功能标记的属性及功能第第8章章 网网 页页 制
12、制 作作(4)对齐属性align。align属性用来设定段落、标题及水平线的对齐方式，其取值为left(左对齐)、center(居中对齐)和right(右对齐)，缺省为左对齐。(5)行标记。的作用是在段内插入一个换行符，产生一个新行。没有结束标记。第第8章章 网网 页页 制制 作作(6)字体标记。标记用于设定标记之间的文本的字号(size)、颜色(color)及字体(face)。字号的取值为17的整数，值越大字越大；字体直接指定字体的名称即可，如“宋体”、“Time New Roman”等。例8-3 文本标记及其属性示例。其效果如图8-4所示。第第8章章 网网 页页 制制 作作图8-4 文本标
13、记及属性示例第第8章章 网网 页页 制制 作作3使用图像使用图像图像标记的作用是在网页中插入一个图片，它没有结束标记，一般格式为：src属性是必选的，它用来指定待插入图片的位置及其名称。其他可选的几个属性如表8-2所述。第第8章章 网网 页页 制制 作作表表8-2 标记的属性及功能标记的属性及功能第第8章章 网网 页页 制制 作作在网页中可以使用的图像格式有以下三种：(1)GIF格式：图形交换格式，采用无损压缩；当保存时可以决定是否保留图片的透明区域；还可以保存动画。它所表示的色彩数较低，只有16色或256色。(2)JPEG格式：联合图形专家组图片格式，使用有损压缩，压缩率很高；但是表示的色彩
14、数很高，可以表示24位真彩色，是最常用的图片格式。(3)PNG格式：可移植的网络图形格式，可以适应于任何类型、任何颜色深度的图片；采用无损压缩，是现在最好的图片格式，已经开始逐渐流行。第第8章章 网网 页页 制制 作作4超级链接超级链接1)URL简介简介HTML利用统一资源定位器(Universal Resource Locator，URL)定位Web页上的文档信息。一个URL包括3个部分：协议代码、所需文件的计算机地址(或一个电子邮件地址或一个新闻组名称)、包含有信息的文件地址和文件名。其中协议表明应使用何种方法获得所需的信息，常用的协议及URL格式如表8-3所示。第第8章章 网网 页页 制
15、制 作作表表8-3 常用的协议及常用的协议及URL格式格式第第8章章 网网 页页 制制 作作2)绝对URL和相对URL绝对URL是指Internet上资源的完全地址，包括协议种类、计算机域名和包含路径的文档名。例如，http:/ 网网 页页 制制 作作3)创建超链接HTML通过标记来创建超链接，其格式为：链接触发对象“触发对象”可以是文本或图片，当用户单击触发对象时，浏览器就会打开URL指向的文件。通过超链接可以将网页和网页之间、网站和网站之间链接起来。整个WWW就是通过超链接连接起来的。第第8章章 网网 页页 制制 作作5表格表格表格一般是用于组织信息，以便使信息更有条理、更加清晰。表格在网
16、页中的另外一个作用就是进行页面布局，也是最常用的一种布局方法。一般通过单元格的背景色或背景图片来区分网页中的不同区域，并对网页进行美化。在网页中通过标记创建表格，然后在和之间用标记和创建表格的行与列(单元格)。注意：表格中的内容，只能出现在和之间，在其他地方不可以出现。有关表格、行和单元格的属性如表8-4所示。第第8章章 网网 页页 制制 作作表表8-4 表格、行和单元格的属性表格、行和单元格的属性第第8章章 网网 页页 制制 作作例8-6 表格示例，结果如图8-5所示。图8-5 表格示例第第8章章 网网 页页 制制 作作表格示例下面创建一个5行6列的表格，宽400，高200，整体背景色为#9
17、FDBEF，第一行背景色为蓝色(blue)。第第8章章 网网 页页 制制 作作1-2节英语物理 高数英语计算机3-4节高数化学制图化学物理第第8章章 网网 页页 制制 作作5-6节计算机体育测量第第8章章 网网 页页 制制 作作7-8节体育 第第8章章 网网 页页 制制 作作8.3 使用使用FrontPage制作网页制作网页8.3.1 FrontPage简介FrontPage是微软办公系统套件中的一员，因此它和常用的Word、Excel有类似的界面和操作。对于用户来说，用FrontPage编写网页就和用Word写文章一样简单易用，尤其对初学者更容易上手。本节以FrontPage 2003为例，
18、讲解使用FrontPage来编写网页的一般方法和过程。FrontPage的工作界面如图8-6所示。第第8章章 网网 页页 制制 作作图8-6 FrontPage的工作界面第第8章章 网网 页页 制制 作作1站点文件夹站点文件夹站点是网页及其资源文件的集合，在计算机中站点的所有资源文件要求存放在同一个文件夹中以便于发布。因此一个站点一般对应一个文件夹，“站点文件夹”就是用来展示和存放站点资源的地方。第第8章章 网网 页页 制制 作作2标签栏标签栏FrontPage 2003支持多文件标签页显示，在不同的标签页中显示不同的网页，以便于同时对多个网页进行编辑。通过“标签栏”可以在不同网页之间进行快速
19、切换。3标记选择器标记选择器标记选择器是FrontPage 2003新增的功能，通过它可以快速选择某个标签所包含的内容或修改标签的属性。第第8章章 网网 页页 制制 作作4视图选择器视图选择器FrontPage 2003支持四种视图模式来显示网页的内容。“设计”视图：供用户以所见即所得的方式编辑网页。若没有对网页元素属性进行具体的设置，网页的显示效果在编辑窗口和浏览器中的显示将会有细微的差别。“代码”视图：类似于文本编辑器，用于直接查看和编辑HTML代码。“拆分”视图：同时显示“设计”视图和“代码”视图。第第8章章 网网 页页 制制 作作“预览”视图：在不启动浏览器的情况下查看网页的大致效果。
20、许多网页特效在“设计”视图中是不能看到结果的，只有在浏览器或“预览”视图中才能看到。“视图选择器”就是用于在这些视图之间进行快速切换的工具。第第8章章 网网 页页 制制 作作5编辑区编辑区“编辑区”的功能取决于当前的视图模式，在不同的模式下显示内容不同。具体功能见“视图选择器”中的视图模式介绍。第第8章章 网网 页页 制制 作作8.3.2 网页设计流程网页设计流程网站有大有小，规模不尽相同，内容和表现形式千变万化，但不管规模、内容和表现形式如何，创建一个网站大都应包括以下几个步骤：(1)建立概念。网站的建立开始于一个想法、一些设想或基于某种目的而要将一些信息资源发布到网上。第第8章章 网网 页
21、页 制制 作作(2)资料收集和内容组织。网页所展现的内容是网站的主要元素，不论技术如何先进、表现形式如何多样，信息内容仍然是网站的主题和核心。第第8章章 网网 页页 制制 作作信息设计阶段的成果是一个描述网站总体结构的框图，它可以让网站设计与制作人员了解网站的规模、各模块(网页)的相关性，也为导航设计提供了依据。图8-7所示是“我的家乡”网站的结构框图。第第8章章 网网 页页 制制 作作图8-7 “我的家乡”网站结构框图第第8章章 网网 页页 制制 作作(3)建立站点和制作网页。设计方案确定后，且所需资料已经收集完成，就可以进入网页制作阶段。若使用专业网页制作工具(如FrontPage、Dre
22、amweaver等)建设网站，首先要建立站点，创建站点内的目录结构，然后将所需的各种资料文件(主要是图片和视频)复制到站点内相应的文件夹中，最后制作网页并保存到相应的文件夹中。第第8章章 网网 页页 制制 作作(4)本地测试。在网页的制作过程中或制作完成后，首先在本地计算机上从网站的首页开始依次单击所有的链接，测试所有链接是否可用、是否指向预期的网页、网页是否能正常显示，对存在问题的网页应进行修改后再测试，直到满足设计要求。第第8章章 网网 页页 制制 作作(5)网站上传与远程测试。当本地测试完成后，就可以将网页上传到Web服务器，这样任何人都可以访问你的网站了。但在最终发布网站之前，还要进行
23、最后一轮测试远程测试，即测试上传到服务器上的网页是否可以像在本地计算机上一样正常访问，并且所有的链接及内容显示是否正确。第第8章章 网网 页页 制制 作作8.3.3 以以“我的家乡我的家乡”为例创建一个网站为例创建一个网站1站点结构规划及素材准备站点结构规划及素材准备站点结构如图8-7所示，网站共包括四个栏目：家乡历史、交通旅游、历史名人和关于自己，其中交通旅游中包括家乡地图及景点介绍两个子栏目。假定已经收集好了相关的资料，包括文字、图片等，如家乡历史资料、景点介绍及图片等。第第8章章 网网 页页 制制 作作2创建站点创建站点启动FrontPage 2003，选择“文件”菜单中的“新建”菜单项
24、，然后选择“任务窗格”中“新建网站”下的“其他网站”命令，弹出如图8-8所示的“网站模板”对话框。选择“常规”中的“空白网站”，在“指定新网站的位置(S)：”中指定网站位置为“D:Hometown”，单击“确定”按钮完成站点创建，FrontPage显示类似于图8-6所示的界面。第第8章章 网网 页页 制制 作作图8-8 “网站模板”对话框第第8章章 网网 页页 制制 作作3建立文件夹和新网页建立文件夹和新网页当创建新站点时，FrontPage会自动创建_private和images两个文件夹以及一个名为index.htm的网页文件。文件夹_private是FrontPage用来保存一些备份或临
25、时文件的，用户一般不用去管它。对于一个网站来说一般默认约定index.htm为网站的首页(主页)。images用于保存网站中用到的图片。第第8章章 网网 页页 制制 作作为了便于管理，可以按设计好的站点结构再创建一些文件夹，将相关的网页及其图片、声音等文件分门别类地放在不同的文件夹中。如图8-9所示是“我的家乡”网站的文件夹列表，其中introduce保存“家乡历史”栏目的相关文件，tour保存“交通旅游”栏目的相关文件，aboutme保存“关于我”栏目的相关文件，celebrity保存“历史名人”栏目的相关文件。建立好文件夹后，再在各自的文件夹中创建相应的网页。第第8章章 网网 页页 制制
26、作作图8-9 网站文件夹列表第第8章章 网网 页页 制制 作作创建文件和网页的方法为：鼠标右击任一文件夹，选择“新建”菜单中的“空白网页”或“文件夹”命令，便在此文件中创建了一个网页或文件夹，然后重命名即可。注意：网站中所有的文件夹和文件的名称必须用英文字母或数字，不能用其他字符或汉字，否则可能引起网页不能正确显示。第第8章章 网网 页页 制制 作作4编辑网页编辑网页1)编辑文本文本的插入和编辑比较简单，操作方法和Word基本相同，文字的格式化也和Word基本类似，在此不再赘述。第第8章章 网网 页页 制制 作作2)插入图片方法一：首先选择插入位置，然后选择“插入”菜单中的“图片”“来自文件”
27、命令，在弹出的对话框中选择待插入的图片，最后单击“确定”按钮即可。方法二：打开“文件夹列表”，在文件列表中选择待插入的图片文件，将其拖到待插入的位置即可。图片插入完成后，可以对其编辑以达到预期的效果，方法与Word编辑图片相同。第第8章章 网网 页页 制制 作作3)插入超链接在FrontPage中创建超链接非常容易，首先选择要作为“触发点”的文字或图片，然后选择“插入”菜单中的“超链接”命令或右键单击“触发点”并在快捷菜单中选择“超链接”命令，在弹出的对话框中选择单击此“触发点”时待打开的网页或输入待打开的网址。第第8章章 网网 页页 制制 作作下面以在“我的家乡”网站首页的导航栏中建立链接为
28、例，介绍创建超链接的方法。首先选择“触发点”，这里选择“家乡历史”作为“触发点”创建链接，如图8-10所示。然后通过“插入”菜单中“超链接”命令打开“插入超链接”对话框，选择“introduce”文件夹中的“history.htm”网页文件，如图8-11所示，单击“确定”按钮后，超链接创建完成。第第8章章 网网 页页 制制 作作图8-10 选择“触发点”第第8章章 网网 页页 制制 作作图8-11 “插入超链接”对话框第第8章章 网网 页页 制制 作作4)设置网页属性通过“网页属性”可以设置网页自身的一些属性，如网页的标题、网页背景(背景色和背景图片)、背景音乐和字体颜色等。常见的网页属性设置
29、方法为：在正在编辑的网页中单击右键，在弹出的快捷菜单中选择“网页属性”命令，然后在此对话框中进行相应设置。打开“网页属性”对话框，如图8-12所示。第第8章章 网网 页页 制制 作作图 8-12 “网页属性”对话框第第8章章 网网 页页 制制 作作(1)“常规”选项卡：用来设置网页的标题和背景音乐。标题：设置网页的标题，将来会显示在浏览器的标题栏中。背景音乐/位置：设置打开网页时要播放的音乐文件。注意：指定的文件必须在站点文件夹中。(2)格式选项卡：设置网页的背景色或背景图片、文本字体颜色及超链接的颜色。第第8章章 网网 页页 制制 作作5在网页中插入特效在网页中插入特效通过FrontPage
30、不但可以轻松地编辑文字、插入图片，还可以在网页中插入一些特效，如滚动字幕、交换式按钮等。1)插入滚动字幕滚动字幕是不断滚动或来回振荡的文字，用于显示网站的欢迎词、提示信息或滚动新闻等，不仅可以引起浏览者的关注，而且可以增加网页的动态效果。第第8章章 网网 页页 制制 作作插入滚动字幕的方法为：首先将光标定位到待插入字幕的位置，选择“插入”菜单中的“Web组件”命令，打开“插入Web组件”对话框。然后在该对话框的“组件类型”栏中选择“动态效果”，在“选择一种效果”栏中选择“字幕”，单击“完成”按钮，打开“字幕属性”对话框，对字幕进行设置，如图8-13所示。第第8章章 网网 页页 制制 作作图8-
31、13 “字幕属性”对话框第第8章章 网网 页页 制制 作作属性对话框中各属性含义如下：文本：用于输入要插入的滚动文字。方向：指定文字滚动的方向。速度：“延迟”用于设置每次滚动的时间间隔，单位为毫秒；“数量”设置每次滚动的距离，单位为像素。第第8章章 网网 页页 制制 作作 表现方式：设置字幕的滚动方式。有三种滚动方式：“滚动条”方式字幕沿一个方向循环滚动；“幻灯片”方式字幕文字在碰到边界时自动消失，然后在另一边出现并重新滚动；“交替”方式文字在字幕框中来回振荡滚动。大小：设置字幕框的大小。重复：设置字幕滚动的循环次数，若选择“连续”选项，则字幕无限制循环滚动。背景色：设置字幕框的背景。设置完所
32、有属性后，保存网页，在浏览器中就可以看到滚动字幕的效果。第第8章章 网网 页页 制制 作作2)插入交互式按钮交互式按钮是一种外观可以随用户的不同操作而改变的按钮。使用交互式按钮可以制作很漂亮、具有动感的导航栏。创建交换式按钮的方法为：单击“插入”菜单中的“交换式按钮”命令，打开“交互式按钮”对话框，如图8-14所示。其中包括以下三个选项卡：第第8章章 网网 页页 制制 作作图8-14 “交互式按钮”对话框第第8章章 网网 页页 制制 作作(1)“按钮”选项卡：设置按钮的样式以及在按钮上显示的文字等。预览：用来预览按钮的样式和效果。按钮：用来选择按钮的样式。文本：设置在按钮上显示的文字。链接：设
33、置当用户单击按钮时打开网页的URL地址。第第8章章 网网 页页 制制 作作(2)“字体”选项卡：设置按钮文本的字体以及文字正常时、鼠标悬停时和鼠标按下时的颜色。(3)“图像”选项卡：设置创建交互式按钮时所产生的图片的大小及保存时所采用的格式。第第8章章 网网 页页 制制 作作下面以为“历史名人”为例，说明创建一个交互式按钮的基本步骤。(1)在“交互式按钮”对话框“按钮”选项卡的“文本”栏中输入“历史名人”，“链接”栏中输入“celebrity/LiBai.htm”。(2)在“字体”选项卡中设置“初始字体颜色”(正常色)为黑色、“悬停时字体颜色”为绿色、“按下时字体颜色”为红色。第第8章章 网网
34、 页页 制制 作作(3)在“图像”选项卡中的栏目使用默认值，最后单击“确定”按钮，在弹出的“保存”对话框中指定产生的图片保存的位置(最好保存到统一的图片文件夹中)，创建完成，在浏览器中就可以查看效果了。第第8章章 网网 页页 制制 作作8.4 网站发布与测试网站发布与测试8.4.1 确认发布位置确认发布位置1.ISP提供商提供的提供商提供的Web站点空间站点空间在Internet中有许多ISP提供免费的Web空间供初学者使用。通过百度搜索“免费Web空间”便可以找到。下面以“常来网免费空间”(http:/)为例介绍如何申请注册Web空间。在浏览器中输入网址“http:/”，进入网站首页，如图8
35、-15所示。第第8章章 网网 页页 制制 作作图8-15 “常来网免费空间”首页第第8章章 网网 页页 制制 作作单击“马上注册”按钮，在新的页面中单击“我同意”按钮，表示同意网站协议。在接下来的页面中输入登录网站的用户名、密码、联系方式等信息按钮，单击“注册”按钮，若没有出错将会进入最后的页面，单击“单击这里激活你的帐号”按钮，即可注册成功。现在便可以回到首页通过刚才注册的帐号登录并管理你的网站了。第第8章章 网网 页页 制制 作作2.自己架设自己架设Web服务器服务器具体架设Web服务器的方法参见6.4.1节“WWW服务配置与管理”部分的内容。在架设好的Web服务器中为将要发布的网站创建一
36、个新的站点或一个虚拟目录，并记录其在文件系统中的位置(路径)，便于下一步进行站点发布。第第8章章 网网 页页 制制 作作8.4.2 发布站点发布站点网站设计完成并确认了发布的位置后，就可以选择适合的发布方法将网站发布到Web服务器上。通常有两种途径：一是使用FTP软件将网站内容上传到Web服务器；二是应用FrontPage提供的发布网站功能，通过此功能既可以将网站发布到远程ISP提供的Web空间，也可以将网站发布到本地的Web服务器(自己架设的服务器)上。第第8章章 网网 页页 制制 作作站点发布方法为：选择“文件”菜单中的“发布网站”命令，弹出如图8-16所示的“远程站点属性”对话框。通过此
37、对话框就可以将当前编辑的站点发布到Web服务器上。第第8章章 网网 页页 制制 作作图8-16 “远程网站属性”对话框第第8章章 网网 页页 制制 作作“远程网站属性”对话框中各选项卡的功能如下：(1)“远程网站”选项卡：选择远程Web服务器类型、设置远程网站位置。其中“远程Web服务器类型”包括了现在流行的四种Web服务器类型：第第8章章 网网 页页 制制 作作FrontPage或SharePoint Services：指Web服务器支持FrontPage服务器扩展的Web服务器，IIS支持FrontPage扩展。WebDAV：WebDAV是HTTP 1.1通信协议的扩展，支持WebDAV的
38、Web服务器就可以通过WebDAV客户端应用程序直接对Web服务器进行读/写，因此通过此协议就可以将网站发布到Web服务器，IIS也支持WebDAV协议。第第8章章 网网 页页 制制 作作FTP：这是Internet中最为流行的文件传输方法，只要提供正确的用户名和口令就可以将网站上传到服务器上。文件系统：用于将网页发布到本地的Web服务器(自己架设的Web服务器)上。第第8章章 网网 页页 制制 作作(2)“优化HTML”选项卡：用于在网站发布时对其中的网页进行优化，如清除网页文件中的注释、网页中的一些无用空格等，减小网页的大小以加速网页的传输。(3)“发布”选项卡：设定发布网站方式，如是全部
39、上传还是只上传被修改的部分等。第第8章章 网网 页页 制制 作作8.4.3 测试站点测试站点将网站发布到Web服务器上后，并不表示网站建设已经完成而可以为浏览者服务了。在发布站点任务完成后，还有一项重要的工作是对上传的网站内容进行全面测试。这也就是“网页设计流程”中的第5步站点测试。单击所有的链接，看是否可以正确打开，其中的图片是否都可以正确地显示。完成了全面的测试，网站才能正式对外开放。第第8章章 网网 页页 制制 作作习习 题题 8一、填空题一、填空题1一个普通HTML文件的扩展名为 ，其内容可分为 和 两部分。2在网页中可以直接使用的图片有 、和 格式文件。3URL分为 和 两类；一个完
40、整的URL地址包括三部分内容，分别是 、和 。第第8章章 网网 页页 制制 作作4在HTML中，标记符一般都成对出现，通常标记包括 和 ；它们定义了标记符所影响的范围。5在网页中实现将“我的家乡”文字显示为红色、7号隶书的代码是 。6HTML中常用的两种单位是 和 。7创建超链接的标记是 ，要创建一个当用户单击“百度搜索”时，打开百度网页的代码是 。第第8章章 网网 页页 制制 作作二、选择题二、选择题1超文本标记语言的简称是()。AWeb PageBHTML CWWW Dhttp2用FrontPage制作的网页文件的扩展名是()。A.htm B.http C.ppt D.doc第第8章章 网
41、网 页页 制制 作作3网页中可以插入()。A图片 B动画 C音乐 D以上都可以4Front Page 2003网页视图方式下，单击()标签可以浏览网页。A普通 BHTML C预览 D编辑第第8章章 网网 页页 制制 作作5下列属于电子邮件的超链接类型的是()。Amailto: BURL:Chttp: Dftp: 第第8章章 网网 页页 制制 作作三、简答题三、简答题1简述浏览器的工作原理。2写出一个网页的基本结构。3简述网页中表格的作用。4简述网页设计流程。第第8章章 网网 页页 制制 作作四、网页设计题四、网页设计题以“我的母校”为网站主题，收集相关资料，进行内容组织、站点设计和规划，使用网页制作软件建立站点、制作相关网页，完成后建立本地WWW服务器，进行网站发布并测试。
