第9章 网页与网站制作

第第1010章章 网页与网站制作网页与网站制作10.1 概述概述10.2 HTML基础基础10.3 FrontPage 200010.1 10.1 概述概述 10.1.1 网页和网站的基本概念（网页和网站的基本概念（1）WWW：是建立在是建立在Internet上的、以网页形式向用户提供上的、以网页形式向用户提供信息浏览服务的一个逻辑网络。信息浏览服务的一个逻辑网络。WWW服务（服务（也称也称网页服务、网页服务、Web服务）服务）：以网页形式：以网页形式向用户提供的信息浏览服务。向用户提供的信息浏览服务。网页网页：由文字、图表等构成的信息页面，是：由文字、图表等构成的信息页面，是WWW上信上信息的组织形式，也是息的组织形式，也是WWW上信息传输和浏览的基本单位上信息传输和浏览的基本单位。网页区别其它文档的本质特征：是其中可以包含指向其网页区别其它文档的本质特征：是其中可以包含指向其它资源文件的它资源文件的超链接（超链接（Hyper Link）。超文本（超文本（HyperText）：包含超链接的文本称为超文本，包含超链接的文本称为超文本，显示在网页中的文字、图形、表格及超链接等统称为显示在网页中的文字、图形、表格及超链接等统称为网页元网页元素（素（element）。10.1 10.1 概述概述 10.1.1 网页和网站的基本概念（网页和网站的基本概念（2）网站（网站（Website）：多个网页有机地组织在一起构成的整多个网页有机地组织在一起构成的整体体（狭义的网站），（狭义的网站），打开网站后看到的第一个网页称为网站打开网站后看到的第一个网页称为网站的的主页（主页（Home Page）。Web服务器服务器：存放网站及各种网页文件的计算机。用户：存放网站及各种网页文件的计算机。用户计算机即客户机与计算机即客户机与Web服务器之间使用服务器之间使用HTTP（超文本传输超文本传输协议）进行通信，通信方式为协议）进行通信，通信方式为C/S（客户机客户机/服务器）服务器）方式方式。网页源文件网页源文件：即：即HTML文档，是符合文档，是符合HTML规范的文本规范的文本文件，其内容主要是一系列的文件，其内容主要是一系列的HTML标记（标记（tag）。）。（区别网页与网页源文件：我们在浏览器中看到的是页区别网页与网页源文件：我们在浏览器中看到的是页面形式的信息即网页，从面形式的信息即网页，从Web服务器实际传输并保存到客户服务器实际传输并保存到客户机上的却是网页源文件。网页是网页源文件在浏览器中的表机上的却是网页源文件。网页是网页源文件在浏览器中的表现形式现形式。）10.1 10.1 概述概述10.1.1 网页和网站的基本概念（网页和网站的基本概念（3）网页分类：网页分类：静态网页、动态网页静态网页、动态网页 静态网页静态网页：建立好了以后就固定不变、不能根据用户请：建立好了以后就固定不变、不能根据用户请求自动改变内容、基本上没有交互功能的网页。浏览静态网求自动改变内容、基本上没有交互功能的网页。浏览静态网页时，数据信息传输是单向的（页时，数据信息传输是单向的（Web服务器服务器客户机）。客户机）。动态网页动态网页：动态网页是指在：动态网页是指在HTML基础上加入了中间件基础上加入了中间件和数据库等技术、具有交互功能的网页。特点：和数据库等技术、具有交互功能的网页。特点：交互性交互性、实实时更新时更新、个性化个性化。URL（统一资源定位符统一资源定位符）：即网页在：即网页在Internet上所处的上所处的地址，浏览网页时其地址，浏览网页时其URL会显示在浏览器地址栏中。会显示在浏览器地址栏中。URL实实际上是一个用来指明网页源文件或其它际上是一个用来指明网页源文件或其它Internet资源文件的资源文件的类型、所在主机、文件路径及文件名称的一个字符串。类型、所在主机、文件路径及文件名称的一个字符串。完整的完整的URL格式：格式：协议协议:/主机主机:端口号端口号/路径名路径名/文件名文件名10.1 10.1 概述概述10.1.2 网页和网站制作简介（网页和网站制作简介（1）1.网站制作的一般步骤（广义）网站制作的一般步骤（广义）网站规划。网站规划。网站设计。网站设计。准备实施。准备实施。网页制作。网页制作。发布网站。发布网站。网站维护。网站维护。本章所指的网站制作（狭义）：本章所指的网站制作（狭义）：主要是指在技术上如何将相关的网页组织、链接在一起主要是指在技术上如何将相关的网页组织、链接在一起构成一个有机的整体即所谓的网站。构成一个有机的整体即所谓的网站。2.网页制作方法与工具网页制作方法与工具 制作网页实质上就是要生成能显示某种效果的制作网页实质上就是要生成能显示某种效果的HTML文文档档。HTML文档可以手工制作，也可以由文档可以手工制作，也可以由Web服务器一方实服务器一方实时动态地生成。时动态地生成。10.1 10.1 概述概述 10.1.2 网页和网站制作简介（网页和网站制作简介（2）制作静态网页的方法，主要有两种：制作静态网页的方法，主要有两种：（1）在文档编辑软件中直接输入、编辑在文档编辑软件中直接输入、编辑HTML文档内容文档内容并保存为并保存为.htm或或.html文件文件。缺点：制作效率低，也不能缺点：制作效率低，也不能在制作过程中看到网页的实际效果在制作过程中看到网页的实际效果。（2）使用可视化的工具软件来编辑网页内容并自动生成使用可视化的工具软件来编辑网页内容并自动生成HTML文档文档。优点：优点：“所见即所得所见即所得”的可视化网页编辑的可视化网页编辑方式、强大的网站制作及管理功能。方式、强大的网站制作及管理功能。常用的网页制作工具常用的网页制作工具 网页制作软件网页制作软件:FrontPage、Dreamweaver、word 等等。素材制作软件素材制作软件:Flash、Fireworks、Photoshop及及CoolEDIT 等。等。10.2 10.2 HTMLHTML基础基础 10.2.1 HTML简介简介 HTML即超文本标记语言，是即超文本标记语言，是WWW的信息表示语言的信息表示语言。用用HTML编写的文件称为编写的文件称为HTML文档文档。静态网页的源文件是纯粹的静态网页的源文件是纯粹的HTML文档；动态网页是以文档；动态网页是以HTML为基础，在为基础，在HTML文档中加入了动态网页脚本程序。文档中加入了动态网页脚本程序。HTML语法较简单，语法较简单，HTML文档中包含有两种类型的符文档中包含有两种类型的符号，一是号，一是数据字符数据字符（Data Characters），），二是二是HTML标记标记（tag）。数据字符标明文字、图像、表格及超链接等网页元数据字符标明文字、图像、表格及超链接等网页元素的内容，素的内容，HTML标记则用来描述这些元素的表现形式。标记则用来描述这些元素的表现形式。学习学习HTML的重要性的重要性 可直接修改网页源文件、是学习动态网页技术的基础、可直接修改网页源文件、是学习动态网页技术的基础、有利于理解网页和有利于理解网页和WWW的运行机制。的运行机制。10.2 10.2 HTMLHTML基础基础10.2.2 HTML文档（文档（1）1.HTML文档的结构文档的结构 HTML文档一般包括文档一般包括文件头（文件头（Header）和和正文（正文（Body）两部分，其基本结构如下：两部分，其基本结构如下：.10.2 10.2 HTMLHTML基础基础10.2.2 HTML文档（文档（2）2.HTML文档的显示与编辑文档的显示与编辑 打开并显示打开并显示HTML文档实际上就是在文档实际上就是在脱机方式下浏览网脱机方式下浏览网页页。具体操作方法请参照配套实验教材中实验十八的内容。具体操作方法请参照配套实验教材中实验十八的内容。由于由于HTML文档是普通的文本文件即文档是普通的文本文件即ASCII码文件码文件,因因此可以用任何编缉软件或文档处理软件来编辑或打开此可以用任何编缉软件或文档处理软件来编辑或打开。编辑编辑要保存为纯文本文件且文件扩展名必须为要保存为纯文本文件且文件扩展名必须为.htm或或.html。通过直接编写通过直接编写HTML文档的方法制作网页的一般步骤：文档的方法制作网页的一般步骤：用文本编辑软件新建或编辑用文本编辑软件新建或编辑HTML文档。文档。以纯文本文件格式保存，扩展名取为以纯文本文件格式保存，扩展名取为.htm或或.html。用浏览器打开文件来浏览网页效果，并可通过执行菜单用浏览器打开文件来浏览网页效果，并可通过执行菜单命令【查看】命令【查看】/源文件源文件 来进行修改，直到满意为止。来进行修改，直到满意为止。10.2 10.2 HTMLHTML基础基础10.2.3 HTML标记标记1.HTML标记的格式标记的格式 数据字符数据字符 其中，其中，部分称为开始标记，部分称为开始标记，部分称部分称为结束标记为结束标记，表示其中的表示其中的 为可选项；为可选项；开始标记中的属性名和属性值用来进一步描述标记对象即网开始标记中的属性名和属性值用来进一步描述标记对象即网页元素的特性如文字的大小、颜色等，不需要时可以省略。页元素的特性如文字的大小、颜色等，不需要时可以省略。2.常用网页元素的标记常用网页元素的标记 网页元素丰富多彩，初学者需多次练习才能掌握相应标网页元素丰富多彩，初学者需多次练习才能掌握相应标记的功能和用法。具体比较请参阅教材。记的功能和用法。具体比较请参阅教材。10.3 10.3 FrontPage 2000FrontPage 2000 10.3.1 认识认识FrontPage 2000（1）1.FrontPage 2000的功能特点的功能特点 两大功能两大功能:一是一是制作网页制作网页，二是，二是制作和管理网站制作和管理网站。功能特点与优点功能特点与优点:提供一套完整的网页和网站开发工具提供一套完整的网页和网站开发工具。提供高效的提供高效的“所见即所得所见即所得”网页制作方式网页制作方式。提供快速生成网站提供快速生成网站/网页的模板和向导网页的模板和向导。提供强大的网页链接管理功能提供强大的网页链接管理功能。提供强大的动态网页制作功能。提供强大的动态网页制作功能。共享共享Office产品的许多特性，易学易用。产品的许多特性，易学易用。10.3 10.3 FrontPage 2000FrontPage 200010.3.1 认识认识FrontPage 2000（2）2.FrontPage 2000的安装与启动的安装与启动 FrontPage 2000可以单独安装，也可以与可以单独安装，也可以与Word 2000等组等组件一起安装在同一台计算机上件一起安装在同一台计算机上。安装过程安装过程 运行运行Office 2000的安装程序的安装程序setup.exe即开始安装，根据即开始安装，根据提示输入相关信息，并在提示输入相关信息，并在“Microsoft Office 2000:功能选择功能选择”窗口中选中窗口中选中“Microsoft FrontPage for Windows”。启动启动 与启动其它与启动其它Windows应用程序的操作相同，可以通过应用程序的操作相同，可以通过“开始开始”菜单命令或快捷方式等多种方法。菜单命令或快捷方式等多种方法。10.3 10.3 FrontPage 2000FrontPage 200010.3.1 认识认识FrontPage 2000（3）3.FrontPage 2000窗口窗口视视图图栏栏编编辑辑器器10.3 10.3 FrontPage 2000FrontPage 200010.3.2 FrontPage 2000网页制作（网页制作（1）1.FrontPage 网页制作的一般步骤网页制作的一般步骤 两种制作方式：两种制作方式：一是一是首先创建一个空白网页，然后编辑网页在网页中添首先创建一个空白网页，然后编辑网页在网页中添加各种网页元素加各种网页元素。二是二是使用网页向导和各种常用网页模板来快速创建形式使用网页向导和各种常用网页模板来快速创建形式相对固定的网页相对固定的网页。（。（二者本质相同，使用同一个编辑器二者本质相同，使用同一个编辑器）步骤：步骤：新建或打开一个网页。新建或打开一个网页。在网页中添加、编辑各种网页元素。在网页中添加、编辑各种网页元素。预览网页效果，满意后保存网页或关闭网页。预览网页效果，满意后保存网页或关闭网页。10.3 10.3 FrontPage 2000FrontPage 200010.3.2 FrontPage 2000网页制作（网页制作（2）2.网页的基本操作网页的基本操作（1）新建网页（三种情形）新建网页（三种情形）FrontPage 启动后会自动建立一个新的网页，文件名启动后会自动建立一个新的网页，文件名为为new_page_1.htm。新建一个空白网页：操作方法参阅新建一个空白网页：操作方法参阅教材教材P294。根据向导或模板新建网页：操作方法参阅根据向导或模板新建网页：操作方法参阅教材教材P294。（2）打开网页打开网页 使用菜单命令从使用菜单命令从“打开文件打开文件”对话框对话框 中打开网页。中打开网页。在已打开网站的在已打开网站的“文件夹列表文件夹列表”中直接双击其中的网中直接双击其中的网页文件名即可打开网页。页文件名即可打开网页。10.3 10.3 FrontPage 2000FrontPage 200010.3.2 FrontPage 2000网页制作（网页制作（3）2.网页的基本操作网页的基本操作（3）设置网页属性）设置网页属性 新建网页或打开网页后，可以设置其标题、背景音乐、新建网页或打开网页后，可以设置其标题、背景音乐、背景图像等属性背景图像等属性。操作方法参阅操作方法参阅教材教材P294 P295。（4）预览网页预览网页 预览网页是指在编辑的过程中查看网页在浏览器中所显预览网页是指在编辑的过程中查看网页在浏览器中所显示的实际效果。示的实际效果。在编辑器中预览在编辑器中预览:单击编辑器的单击编辑器的“预览预览”选项卡，即选项卡，即可预览当前正在编辑的网页可预览当前正在编辑的网页。在浏览器中预览在浏览器中预览:是指在浏览器中打开并显示网页效是指在浏览器中打开并显示网页效果。操作步骤参阅果。操作步骤参阅教材教材 P295。10.3 10.3 FrontPage 2000FrontPage 2000 10.3.2 FrontPage 2000网页制作（网页制作（4）2.网页的基本操作网页的基本操作（5）保存网页保存网页 网页制作好了以后，要保存起来。保存网页时保存类型网页制作好了以后，要保存起来。保存网页时保存类型应指定为应指定为“Web页页”。操作方法参阅操作方法参阅教材教材P295。（6）关闭当前网页关闭当前网页 操作方法：执行菜单命令【文件】操作方法：执行菜单命令【文件】/关闭关闭，或按快捷，或按快捷键键+，或单击编辑器右上角的关闭按钮。或单击编辑器右上角的关闭按钮。10.3 10.3 FrontPage 2000FrontPage 2000 10.3.2 FrontPage 2000网页制作（网页制作（5）3.文本编辑与修饰文本编辑与修饰 作作为为大大量量信信息息的的载载体体，文文本本是是网网页页中中必必不不可可少少的的主主要要元元素之一。素之一。在在FrontPage 2000中中，网网页页中中的的文文本本处处理理技技术术与与操操作作与与Word 2000基基本本一一致致，使使用用过过Word的的用用户户可可以以很很快快掌掌握握网网页页中的文本编辑与修饰。中的文本编辑与修饰。基本操作：略。基本操作：略。FrontPage 2000与与Word 2000的的一一个个不不同同之之处处是是它它对对字字体体大小的支持，大小的支持，FrontPage 2000本身提供的字体大小只有本身提供的字体大小只有7级。级。字体大小见字体大小见教材教材P296 表表10-2。10.3 10.3 FrontPage 2000FrontPage 2000 10.3.2 FrontPage 2000网页制作（网页制作（6）4.使用图像使用图像（1）图像格式）图像格式 并并不不是是每每种种格格式式的的图图像像都都适适合合于于在在网网页页中中使使用用，网网页页中中最常用的静止图像有最常用的静止图像有:JPEG格格式式。文文件件扩扩展展名名为为.jpg，是是经经过过压压缩缩的的数数字字静止图像，通常用于存储彩色风景图像或照片。静止图像，通常用于存储彩色风景图像或照片。GIF格格式式。GIF文文件件也也是是采采用用压压缩缩存存储储，最最高高只只能能包包含含256种颜色，其最大的优点是可以实现简单的动画。种颜色，其最大的优点是可以实现简单的动画。PNG格格式式。PNG 图图像像可可用用于于替替代代 GIF格格式式的的图图像像，但但支支持持的的颜颜色色数数更更多多。不不足足之之处处是是有有的的浏浏览览器器必必须须安安装装专专门门的插件程序后才能显示的插件程序后才能显示 PNG 图片。图片。10.3 10.3 FrontPage 2000FrontPage 2000 10.3.2 FrontPage 2000网页制作（网页制作（7）4.使用图像使用图像（2）在网页中插入图片）在网页中插入图片 插入剪贴画插入剪贴画。操作方法见。操作方法见教材教材P296 P297。插入图片插入图片。操作方法见。操作方法见教材教材P297。（3）编辑图片编辑图片 根根据据需需要要，可可以以改改变变图图片片的的大大小小、布布局局，在在图图片片上上添添加加文字，以及调整图片的对比度、亮度等等。文字，以及调整图片的对比度、亮度等等。操操作作方方法法：通通过过快快捷捷菜菜单单打打开开“图图片片属属性性”对对话话框框来来设设置，或者使用置，或者使用“图片图片”工具栏来完成。工具栏来完成。10.3 10.3 FrontPage 2000FrontPage 2000 10.3.2 FrontPage 2000网页制作（网页制作（8）5超链接超链接 网网页页的的本本质质和和强强大大之之处处就就是是超超链链接接，超超链链接接是是从从文文本本、图片映射到图片映射到Internet上其它网页或文件等目标资源的指针上其它网页或文件等目标资源的指针。（1）超链接的组成及分类）超链接的组成及分类 组成：组成：超链接包含超链接包含载体载体和和目标地址目标地址两部分。两部分。链链接接的的载载体体：是是指指显显示示超超链链接接的的部部分分，也也就就是是指指包包含含超超链链接接的的图图像像或或文文字字。以以文文字字作作为为载载体体的的超超链链接接称称为为文文字字链链接接，以图像作为载体的链接称为以图像作为载体的链接称为图像链接图像链接。链链接接的的目目标标地地址址：是是指指目目标标资资源源的的URL，可可以以是是网网页页或或网站的地址，也可以是电子邮箱等。网站的地址，也可以是电子邮箱等。10.3 10.3 FrontPage 2000FrontPage 200010.3.2 FrontPage 2000网页制作（网页制作（9）5超链接超链接 分类：根据链接目标地址类型，可分为三类分类：根据链接目标地址类型，可分为三类:指向网站外部的超链接指向网站外部的超链接;指向同一网站内部的超链接指向同一网站内部的超链接;指向同一网页内部的超链接。指向同一网页内部的超链接。创建三种超链接的操作方法基本相同，主要是要设置不同创建三种超链接的操作方法基本相同，主要是要设置不同的目标地址。的目标地址。（2）创建网站内部的超链接）创建网站内部的超链接 链接到网站内已有网页链接到网站内已有网页/文件。操作方法见文件。操作方法见教材教材P298。链接到一个新的网页。操作方法见链接到一个新的网页。操作方法见教材教材P298。10.3 10.3 FrontPage 2000FrontPage 200010.3.2 FrontPage 2000网页制作（网页制作（10）5超链接超链接（3）创建到网站外部的链接）创建到网站外部的链接 网站外部的链接目标包括其它网站和电子邮箱网站外部的链接目标包括其它网站和电子邮箱。到其它网站的超链接到其它网站的超链接。操作方法见。操作方法见教材教材P298 P299。用于发送电子邮件的超链接用于发送电子邮件的超链接。操作方法见。操作方法见教材教材P299。（4）使用书签使用书签 书书签签是是网网页页中中被被标标记记的的位位置置或或被被标标记记的的文文本本，可可以以用用作作超超链链接接的的目目的的端端，当当单单击击指指向向书书签签的的超超链链接接时时，打打开开目目标标网网页页后后将将直直接接跳跳转转到到这这个个书书签签所所在在位位置置而而不不是是网网页页顶顶端端。标标签签的的使使用用分分为为两两步步，首首先先要要在在目目标标网网页页中中插插入入书书签签标标记记作作为为链链接目标，然后在其它网页中创建到该书签的超链接接目标，然后在其它网页中创建到该书签的超链接。10.3 10.3 FrontPage 2000FrontPage 200010.3.2 FrontPage 2000网页制作（网页制作（11）5超链接超链接 在网页中插入书签。操作步骤见在网页中插入书签。操作步骤见P299。创建到书签的超链接创建到书签的超链接。指指向向一一个个书书签签的的超超链链接接也也叫叫做做锁锁定定标标记记，其其URL表表示示为为“#书签名书签名”。创建方法操作方法见。创建方法操作方法见教材教材P299。（5）超链接的编辑超链接的编辑 更改超链接文本更改超链接文本:操作方法与修改普通文本完全相同。操作方法与修改普通文本完全相同。更改超链接图片的外观。操作方法见更改超链接图片的外观。操作方法见教材教材P300。修改链接目标。操作方法见修改链接目标。操作方法见教材教材P300。取消超链接取消超链接:删除删除“编辑超链接编辑超链接”对话框中对话框中URL栏内容。栏内容。10.3 10.3 FrontPage 2000FrontPage 200010.3.2 FrontPage 2000网页制作（网页制作（12）6表格表格 表表格格是是网网页页中中经经常常采采用用的的一一种种有有效效的的信信息息组组织织方方式式和和表表示示方方式式。FrontPage表表格格操操作作与与Word 表表格格操操作作非非常常类类似似。创创建建表格的方法主要以下四种：表格的方法主要以下四种：单单击击“常常用用”工工具具栏栏中中的的“插插入入表表格格”按按钮钮，可可以以按按默认的布局方式快速插入表格。默认的布局方式快速插入表格。在在网网页页中中设设置置插插入入点点后后，执执行行【表表格格】/插插入入“表表格格”，并在打开的，并在打开的“插入表格插入表格”对话框中指定行数和列数。对话框中指定行数和列数。执执行行菜菜单单命命令令【表表格格】/手手绘绘表表格格，打打开开“表表格格”工工具栏，手动绘制需要的表格。具栏，手动绘制需要的表格。将已有的文本转换为表格。将已有的文本转换为表格。7框架网页框架网页（1）概概述述：框框架架网网页页是是一一种种特特殊殊的的网网页页，它它将将浏浏览览器器窗窗口口分分割割成成不不同同的的区区域域即即框框架架（Frame），每每个个框框架架内内的的网网页页既既可可以以单单独独控控制制，也也可可以以建建立立与与其其它它框框架架内内网网页页之之间间的的链链接接关关系系，因因此此框框架架网网页页常常常常被被用用来来组组织织和和表表示示大大量量的的、复复杂杂的的信信息内容，如目录、文章列表等。息内容，如目录、文章列表等。10.3 10.3 FrontPage 2000FrontPage 200010.3.2 FrontPage 2000网页制作（网页制作（13）框架的源文件不包括任何框架的源文件不包括任何可以在浏览中显示的内容，可以在浏览中显示的内容，只是标明包含几个框架及框只是标明包含几个框架及框架的拆分方式等。架的拆分方式等。每个框架每个框架实际上是一个单独的网页，实际上是一个单独的网页，保存网页时每个框架有单独保存网页时每个框架有单独的源文件的源文件。7框架网页框架网页（2）使用模板新建框架网页）使用模板新建框架网页 在在FrontPage 2000中中，框框架架网网页页通通常常使使用用模模板板来来创创建建。一一般般是是先先建建立立一一个个空空的的框框架架网网页页，然然后后调调整整框框架架布布局局，并并制制作作或设置每个框架中的网页或设置每个框架中的网页。10.3 10.3 FrontPage 2000FrontPage 200010.3.2 FrontPage 2000网页制作（网页制作（14）操作方法：打开操作方法：打开“新新建建”对话框，如右图，对话框，如右图，在在“框架网页框架网页”选项卡选项卡中选择所需的模板，该中选择所需的模板，该模板网页的预览图出现模板网页的预览图出现在在“预览预览”区域。按区域。按“确定确定”按钮。按钮。7框架网页框架网页（3）设置框架中的网页）设置框架中的网页 利利用用模模板板新新建建的的框框架架网网页页还还只只是是一一个个空空的的框框架架，创创建建后后还还必须为每一个框架必须为每一个框架设置初始网页设置初始网页。创建一个新网页作为创建一个新网页作为初始网页初始网页。设置为现有网页。操作方法见设置为现有网页。操作方法见教材教材P302。（4）保存框架网页保存框架网页 框框架架网网页页设设计计好好了了以以后后，除除了了保保存存各各个个框框架架内内对对应应的的网网页页之之外外，还还需需要要保保存存框框架架网网页页，操操作作方方法法比比保保存存常常规规网网页页稍稍显显复杂。复杂。操作方法见操作方法见教材教材P302。10.3 10.3 FrontPage 2000FrontPage 2000 10.3.2 FrontPage 2000网页制作（网页制作（15）8多媒体多媒体 对对多多媒媒体体的的良良好好支支持持是是FrontPage的的一一个个突突出出特特色色，我我们们能够很容易地在网页里加入并播放音频和视频。能够很容易地在网页里加入并播放音频和视频。（1）加入声音）加入声音 加入方式加入方式:采用插件采用插件、设置背景音乐设置背景音乐及及链接音频文件链接音频文件。设设置置背背景景音音乐乐。在在网网页页设设置置了了背背景景音音乐乐后后，该该网网页页在在浏浏览览器器中中打打开开时时，此此音音效效就就会会连连续续播播放放或或根根据据网网页页中中指指定定的的次数播放。设置方法见次数播放。设置方法见教材教材P303。链链接接声声音音。链链接接声声音音是是指指在在网网页页中中设设置置超超链链接接来来指指向向声声音音文文件件。链链接接到到声声音音文文件件的的操操作作方方法法与与建建立立其其它它超超链链接接基基本本相相同同，只只需需要要在在打打开开“创创建建超超链链接接”对对话话框框后后指指定定声声音音文件作为链接目标即可，具体步骤略。文件作为链接目标即可，具体步骤略。10.3 10.3 FrontPage 2000FrontPage 200010.3.2 FrontPage 2000网页制作（网页制作（16）8多媒体多媒体（2）加入视频）加入视频 在在网网页页中中可可使使用用由由Windows Media Player播播放放的的任任何何类类型型视视频频，包包括括VCD图图像像。加加入入方方式式同同样样可可采采用用插插件件、插插入入和和链链接的方法。接的方法。插入视频插入视频。插入及修改视频属性的方法见。插入及修改视频属性的方法见教材教材P304。链链接接视视频频。链链接接视视频频是是设设置置一一个个超超链链接接指指向向视视频频文文件件，这这是是最最常常用用的的加加入入视视频频的的方方法法。优优点点：减减少少网网页页文文件件容容量量、可可以以链链接接到到网网站站内内部部或或外外部部的的视视频频、可可让让用用户户方方便便地地下下载载。链链接接视视频频的的操操作作方方法法与与建建立立其其它它超超链链接接基基本本相相同同，只只需需要要在在打打开开“创创建建超超链链接接”对对话话框框后后指指定定视视频频文文件件作作为为链链接接目目标标即即可，具体步骤略。可，具体步骤略。10.3 10.3 FrontPage 2000FrontPage 200010.3.2 FrontPage 2000网页制作（网页制作（17）10.3 10.3 FrontPage 2000FrontPage 200010.3.3 FrontPage 网站制作与发布（网站制作与发布（1）1.FrontPage网站制作概述网站制作概述 两种制作方式两种制作方式:从一个空白站点开始从一个空白站点开始；使用向导或模板使用向导或模板。从一个空白站点开始制作网站可采用以下步骤：从一个空白站点开始制作网站可采用以下步骤：新建一个空白站点。新建一个空白站点。根据规划设计制作网页或导入网页根据规划设计制作网页或导入网页。根据预定的网站结构建立网页之间的链接关系即导航根据预定的网站结构建立网页之间的链接关系即导航结构，制作导航栏结构，制作导航栏。使用向导或模板制作时，使用向导或模板制作时，FrontPage会根据事先设计好的会根据事先设计好的模板生成网站结构及网页文件，网页间的导航结构已经建立模板生成网站结构及网页文件，网页间的导航结构已经建立好，用户只需编辑网页内容即可。当然，用户也可以添加新好，用户只需编辑网页内容即可。当然，用户也可以添加新的网页或者是修改链接结构。的网页或者是修改链接结构。10.3 10.3 FrontPage 2000FrontPage 200010.3.3 FrontPage 网站制作与发布（网站制作与发布（2）2.网站的基本操作网站的基本操作（1）新建站点）新建站点 新建网站时，可以建立一个不包含任何网页的空站点，新建网站时，可以建立一个不包含任何网页的空站点，也可根据向导或模板建立站点。也可根据向导或模板建立站点。操作方法见操作方法见教材教材P305。（2）打开站点打开站点 操作步骤见操作步骤见教材教材P305。（3）站点重命名站点重命名 新建站点时，新建站点时，FrontPage 预设的站点名称是预设的站点名称是MyWeb1、Myweb2等。等。可以重命名，操作方法见可以重命名，操作方法见教材教材P305。（4）关闭站点关闭站点:执行菜单命令【文件】执行菜单命令【文件】/关闭站点关闭站点。10.3 10.3 FrontPage 2000FrontPage 200010.3.3 FrontPage 网站制作与发布（网站制作与发布（3）2.网站的基本操作网站的基本操作（5）删除站点）删除站点 删除当前正在编辑的站点。注意，删除当前正在编辑的站点。注意，站点一旦删除将不能站点一旦删除将不能恢复恢复。操作方法见操作方法见教材教材P306。3.建立网页间的链接建立网页间的链接 无论是从空白站点开始还是使用向导或模板制作网站，无论是从空白站点开始还是使用向导或模板制作网站，都需要为网站内的网页建立相互链接关系，即建立网站内都需要为网站内的网页建立相互链接关系，即建立网站内的的“导航系统导航系统”。在。在FrontPage中建立导航系统有两种方法，中建立导航系统有两种方法，一是在每个网页或其源文件中一个个地添加超链接标记一是在每个网页或其源文件中一个个地添加超链接标记，这种方法较繁琐，易出错。这种方法较繁琐，易出错。二是使用二是使用FrontPage的导航功能的导航功能来建立并管理网站内部的超链接来建立并管理网站内部的超链接，使用这种方法用户不需，使用这种方法用户不需要去书写繁琐的超链接标记，操作相对简单。要去书写繁琐的超链接标记，操作相对简单。10.3 10.3 FrontPage 2000FrontPage 200010.3.3 FrontPage 网站制作与发布（网站制作与发布（4）3.建立网页间的链接建立网页间的链接（1）导航结构）导航结构 导航结构就是根据事先规划的网页组织结构而生成的一导航结构就是根据事先规划的网页组织结构而生成的一个链接结构图个链接结构图。在导航结构中的基本概念在导航结构中的基本概念:主页主页:主页就是打开网站后首先自动显示的网页，文件主页就是打开网站后首先自动显示的网页，文件名一般为名一般为default.htm 或或 index.htm。最上层网页最上层网页:与主页属于同一层的其它网页。与主页属于同一层的其它网页。子页及子层网页子页及子层网页:子页是直接位于其他网页之下的网页。子页是直接位于其他网页之下的网页。子层网页是与子页同层的所有网页。子层网页是与子页同层的所有网页。父页与父层网页父页与父层网页:父页是相对于子页而言的，直接位于父页是相对于子页而言的，直接位于其它网页之上的网页。相对于子层网页而言，与父页处在其它网页之上的网页。相对于子层网页而言，与父页处在同一层的所有网页都称为父层网页。同一层的所有网页都称为父层网页。10.3 10.3 FrontPage 2000FrontPage 200010.3.3 FrontPage 网站制作与发布（网站制作与发布（5）3.建立网页间的链接建立网页间的链接（2）导航栏）导航栏 导航栏是指排列在网页上的一组文本或图像超链接导航栏是指排列在网页上的一组文本或图像超链接。典。典型的导航栏一般包含指向站点主页及主要网页的超链接。型的导航栏一般包含指向站点主页及主要网页的超链接。在站点的每个网页上显示一个导航栏，可以让站点访问者在站点的每个网页上显示一个导航栏，可以让站点访问者快捷方便地转向站点的主要网页。快捷方便地转向站点的主要网页。（3）建立网站）建立网站“导航系统导航系统”一般步骤是，一般步骤是，首先根据网站规划设计在首先根据网站规划设计在“导航导航”视图模视图模式下创建当前站点的导航结构，然后再由式下创建当前站点的导航结构，然后再由FrontPage来创建来创建导航栏导航栏。FrontPage 将维护其创建的导航栏，如果在网站内网页将维护其创建的导航栏，如果在网站内网页发生变动，发生变动，FrontPage 将重新计算超链接并更新导航栏。将重新计算超链接并更新导航栏。10.3 10.3 FrontPage 2000FrontPage 200010.3.3 FrontPage 网站制作与发布（网站制作与发布（6）3.建立网页间的链接建立网页间的链接（3）建立网站）建立网站“导航系统导航系统”建立导航结构（两种操作方式）建立导航结构（两种操作方式）一是在一是在“网页网页”视图模式下先制作好所有网页，然后切视图模式下先制作好所有网页，然后切换到换到“导航导航”视图模式来操作；二是直接在视图模式来操作；二是直接在“导航导航”视图视图模式下一边建立导航结构一边新建网页。操作步骤见模式下一边建立导航结构一边新建网页。操作步骤见教材教材P307。在网页中加入导航栏在网页中加入导航栏 当添加一个导航栏时，当添加一个导航栏时，FrontPage 将根据在导航视图模将根据在导航视图模式下设置的导航结构在网页中自动生成超链接，并在网页式下设置的导航结构在网页中自动生成超链接，并在网页源文件中添加相应的超链接标记源文件中添加相应的超链接标记。操作步骤见。操作步骤见教材教材P308。注意注意:同一个导航栏中的超链接一般必须指向同一类的同一个导航栏中的超链接一般必须指向同一类的网页，但可以将指向主页或父页的超链接加入到其中。网页，但可以将指向主页或父页的超链接加入到其中。10.3 10.3 FrontPage 2000FrontPage 200010.3.3 FrontPage 网站制作与发布（网站制作与发布（7）4.发布网站发布网站 发布站点的含义发布站点的含义:见见教材教材P308。（1）将网站发布到将网站发布到Internet的条件的条件 一是自己的计算机必须能连接上网。二是有存放网站的一是自己的计算机必须能连接上网。二是有存放网站的Web服务器。三是有向服务器上传文件的软件。服务器。三是有向服务器上传文件的软件。（2）发布操作）发布操作 FrontPage 2000提供了一个相当方便的网页发布工具，提供了一个相当方便的网页发布工具，只需完成其中的设置，就可以方便地把站点发布到只需完成其中的设置，就可以方便地把站点发布到Internet Web服务器上。操作步骤见服务器上。操作步骤见教材教材P309。注意注意:发布成功后，可使用浏览器输入网址浏览，查看发布成功后，可使用浏览器输入网址浏览，查看每个网页是否显示正确。每个网页是否显示正确。End of Chapter 10