版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
第9章网页制作9.1FrontPage2003简介9.2网页基本操作9.3编辑网页9.4使用框架9.5制作动态网页9.6站点管理 9.1FrontPage2003简介
FrontPage是Microsoft公司在Office2000中新增的Web站点创建和网页制作软件。所有的Office套装软件都具有完全相似的窗口界面,功能大致相同的菜单命令、工具按钮,很容易让人产生亲近感,因而用户在使用Word、Excel等方面的经验和技巧都可以运用到FrontPage中。
FrontPage2003的功能非常强大,具有创建、组织、管理和浏览站点,编辑、布局网页,调整网页之间的层次结构、发布站点等功能,还能实现创建或修改站点的结构,导入其他网页,导出某个网页,管理访问权限,检验站点中的各个超链接等方面的功能。
FrontPage2003能自动地生成全部的HTML代码,使用FrontPage2003不需要学习HTML语言就可以创建一些简单的网页。利用菜单可以执行FrontPage2003提供的各种编辑命令,在编辑区内,网页制作者可以不用了解HTML是如何编制的,所见即所得地设计和规划网页。9.1.1FrontPage2003界面
FrontPage2003启动方法与Word2003的启动方法类似,操作步骤如下:
(1)单击Windows2000任务栏上的“开始”按钮,打开“开始”菜单。
(2)在“开始”菜单中,单击“程序”→“MicrosoftFrontPage”命令,即可打开FrontPage2003程序的主窗口界面,如图9-1所示。由于还没有进行任何操作,所以工作区是空白的。图9-1FrontPage2003程序的主窗口界面
FrontPage2003的用户界面与Office2000的其他软件相似,主要由标题栏、菜单栏、工具栏、视图区、编辑区和状态栏等几部分组成,如图9-2所示。图9-2FrontPage2003工作界面
1.标题栏
标题栏位于FrontPage2003工作界面的最上方,它由控制按钮、窗口标识和窗口按钮三部分组成。控制按钮位于标题栏最左边,用于执行移动、最小化、最大化和关闭窗口等相关操作。窗口标识占据了标题栏的主要空间,用于标识应用程序名称和站点名称。图9-3FrontPage2003菜单栏
3.工具栏工具栏以工具按钮的形式为用户提供了主要的编辑和管理功能,如图9-4所示。用户可调整在屏幕上显示的工具栏的种类和工具栏所在的位置。 FrontPage2003提供了常用、 格式、DHTML效果、报表、表格、导航、定位、图片、样式和自定义等工具。打开“查看”菜单下的“工具栏”下的级联菜单,可添加用户所想要的工具栏。图9-4FrontPage2003常用工具栏图9-5FrontPage2003网页视图在网页视图中,编辑区的左下角有四个切换显示模式的标签,分别是“设计”、“拆分”、“代码”和“预览”标签。单击“设计”标签可切换到设计模式。在设计模式下可以编辑网页;单击“预览”标签可切换到预览模式,可以预览当前编辑文档在浏览器中的显示情况,在预览模式下不能编辑网页;单击“代码”标签可切换到HTML模式,此时可直接对网页对应的HTML文本文件进行编辑,从而为网页作一些特殊的设置。
5.编辑区
编辑区是用户使用得最多的部分,它是管理网站和制作网页的主要场所。当使用管理功能时,编辑区显示各种任务下的文件或站点信息。当制作网页时,它有设计、代码、拆分和预览四种显示方式。设计显示方式最常用,代码显示方式是在需要直接编辑或查看网页文件的HTML代码时使用,如果会编写HTML语句,就可以在HTML显示方式下直接编辑HTML原始代码并对其进行修改。拆分方式使窗口一半显示设计状态,一半显示代码状态。预览方式可以随时观看所编辑网页的显示效果。
6.状态栏
状态栏位于FrontPage2003窗口界面的底部,如图9-6所示。它对网页预计下载的时间、网页大小、网页创作设置和浏览器设置进行简单的描述。图9-6FrontPage2003状态栏9.1.2退出FrontPage2003
用户在完成或终止网页设计工作时,要按照适当的步骤退出FrontPage2003,以确保不丢失信息。退出FrontPage2003的方法有两种:一种是单击“关闭”按钮,将程序关闭;另一种是通过打开“文件”菜单,单击其中的“退出”命令退出程序。
如果用户编辑或修改过的网页没有保存,在退出之前会弹出保存对话框,询问是否保存。如果要保存,单击“是(Y)”按钮,否则单击“否(N)”按钮。如果单击“否(N)”按钮,这时所做的编辑或修改的内容将全部丢失。如果不想退出,则单击“取消”按钮。
9.2网页基本操作
9.2.1创建网页
网页是全球广域网上的基本文档,用HTML(超文本标记语言)书写。网页可以是站点的一部分,也可以独立存在。网页文件的创建、保存、打开和关闭操作与Word相似。创建网页的操作步骤如下:
(1)打开“文件”菜单,选择“新建”菜单后,在任务窗格中单击“其他网页模板”,弹出如图9-7所示的“新建”对话框。
(2)从“常规”选项卡中选择所需要的模板。在“预览”区中出现这种模板的预览视图,在“说明”区中有简单的描述。
为了更好地了解这些网页模板,可单击图9-7右侧上方的“列表”按钮,将显示方式由大图标方式改变为列表方式来显示。在列表显示方式中,可以看到多种模板。通过名称、说明和预览可以了解到各种模板的样式。图9-7“新建”对话框
(3)选择一种模板后,例如“确认表单”模板,单击“确定”按钮,确定了所选择的网页模板,如图9-8所示。这样就可以在模板的基础上修改文字,进行网页编辑等操作了。图9-8“确认表单”模板例如,新建一个“邮件确认”网页,用图9-9中的文字替代图9-8模板中的文字,即得到一个简单的网页。图9-9“邮件确认”网页图9-10“另存为”对话框
(2)输入文件名,单击“保存”按钮就可以完成保存。
如果选择“文件”菜单中的“另存为”命令,则将文件再保存为一个不同于当前文件名的新文件。“另存为”步骤如下:
(1)在“另存为”对话框中,给文件重新起一个名字。
(2)单击“更改”按钮,弹出“设置网页标题”对话框,可以重新设置网页标题,也可以不改。
(3)单击“确定”按钮,完成“另存为”操作。
(2)选择要打开文件所在的文件夹,打开文件夹。
(3)选中要打开的文件,单击“打开”按钮,这样就打开了选中的文件。图9-11“打开文件”对话框图9-12“页面设置”对话框 9.3编辑网页
9.3.1设置网页属性
在“设计”视图显示方式下,选择“文件”菜单的“属性”命令或在编辑区单击鼠标右键,在弹出的快捷菜单中选择“网页属性”命令,即可打开如图9-13所示的“网页属性”对话框。在“网页属性”对话框中有“常规”、“格式”、“高级”、“自定义”、“语言”和“工作组”等六个选项卡,可以对网页进行属性设置。图9-13“网页属性”对话框
(1)“常规”选项卡用来设置具有鲜明个性和最能概括网页内容的标题信息作为网页标题以区分网页。在“默认的目标框架”栏中指定目标框架名,使网页中所有的超链接都跳转到指定的目标框架中。在“背景音乐”栏中可指定网页背景音乐,以便浏览器打开网页时能自动播放背景音乐。
(2)“格式”选项卡用来为网页指定背景图片、背景颜色、文字颜色和超链接颜色。选定“水印”效果可使网页滚动时背景图案保持静止,设置超链接翻转效果能使用户在浏览网页并指向超链接文字时改变字体和颜色特性,如图9-14所示。
如果网页应用了主题就不能在“网页属性”对话框中看到选项卡。图9-14“格式”选项卡
(3)“高级”选项卡用来指定页面内容相对于顶端和左端以像素为单位的留空距离。
(4)“自定义”选项卡用来定义文档类型、字符集和页面创建应用程序等系统变量和用户变量。
(5)“语言”选项卡用来设置网页中涉及的语言问题以确保浏览器能正常显示而不出现乱码。9.3.2编辑文本
FrontPage2003中的文本编辑基本上遵循Windows的文本编辑标准,特别是与Word中的文本编辑功能非常相似。在网页上输入文本非常简单,只要在“设计”显示模式下将插入点定位在需要的地方输入文本即可。输入过程中如按回车键,FrontPage2003默认为另起一个段落,屏幕上将看到光标定位在下一个空白行的位置上。
若仅需换行而不希望另起一个段落时,则应按Shift+Enter组合键或选择“插入”菜单的“换行”命令并在“换行符属性”对话框中选中“普通换行符”单选钮,这样无论屏幕窗口大小如何,文本都会强制换行。
FrontPage2003提供了多种方法选定页面文本。
(1)英文单词:当鼠标位于某个英文单词的任何一个字母上时双击鼠标左键即可选中。
(2)中文单词:当鼠标位于某个中文单词上时双击鼠标左键即可选中。
(3)文本块:光标定位于文本块首,按下鼠标左键拖动至文本块尾或按住Shift键的同时,在文本块尾单击鼠标左键或按住Shift键的同时按相应方向的光标键均可选中。
(4)文本行:当光标在行首变成右向箭头时单击鼠标左键可选中单行文本。当光标位于行首时按下鼠标左键上下拖动可选定多行文本。
(5)文本段:当光标位于段落左侧时双击鼠标左键可选中文本段。
(6)全部文本:按Ctrl+A组合键或选择“编辑”菜单中的“全选”命令可选定页面上全部文本。选定文本后利用“编辑”菜单中的“剪切”、“复制”和“粘贴”命令或“常用”工具栏中的“剪切”、“复制”和“粘贴”按钮即可移动或复制文本。利用鼠标拖放技术也可移动或复制文本,复制文本时,则在按住Ctrl键的同时进行拖放操作。9.3.3修饰文本
文本格式化包括两类格式,一类是针对选定字体进行修饰的字体格式,可设置字体、字型、大小、颜色、效果和字符间距等;另一类是针对当前段落进行修饰的段落格式,可调整段落对齐方式、缩进和段落间距等。
一个好的网页应该是形式与内容的完美统一。因此,充分利用FrontPage2003的文本格式化工具对网页文本进行修饰和美化是网页编辑的一项基本工作。修饰文本主要利用“格式”工具栏、“字体”对话框和“段落”对话框。格式工具栏如图9-15所示。图9-15“格式”工具栏
1.设置字体格式
(1)设置字体:选定要设置字体的文字,打开“格式”工具栏中的“字体”下拉列表框,选择相应的字体进行设置就可以了。
(2)设置字号:选定文字,在“格式”工具栏“字号”下拉列表框中选择相应字号即可。
(3)设置字型:选定文字,单击“格式”工具栏上“加粗”、“倾斜”或“下划线”按钮即可设置相应字型。
(4)设置颜色:选定文字,单击“格式”工具栏“字体颜色”按钮旁的向下箭头,选择某一颜色后选定文字的颜色就改变了。一般不要改变网页中超链接颜色设置,这是大多数人所遵循的颜色设置。
以上操作也可通过“字体”对话框设置完成,如图9-16所示。若要打开“字体”对话框,选择“格式”菜单下的“字体”命令。或者在编辑区单击鼠标右键,打开快捷菜单后选择“字体”命令。这里除了“格式”工具栏可以做的设置以外,还可以设置字体效果和字符间距。
设置字体格式时,如果当前没有选定文本,则设定格式将对从光标处输入的文本起作用;如果当前已选定文本,则设定格式对选定文本起作用。图9-16“字体”对话框
2.设置段落格式
文本组织离不开段落,没有谁愿意看一篇从头到尾没有段落间隔的文章。在FrontPage2003中创建新段落很方便,按Enter键就可在新的一行上开始一个新的段落。
段落格式化是针对整个段落的,因此在格式化前应选定一个或多个段落。如果没有选定整个段落,则格式化将被应用到光标所在段落。利用“格式”工具栏上提供的三个段落对齐方式按钮可以快速执行段落对齐操作,但全面的段落格式化操作要利用“段落”对话框,要打开“段落”对话框,只要打开“格式”菜单后选择“段落”命令,或者在编辑区单击鼠标右键打开快捷菜单后,选择“段落”命令,弹出如图9-17所示的“段落”对话框。其中各选项的使用方法与Word类似。图9-17“段落”对话框使用FrontPage2003时,在默认情况下,段与段之间的间距较大。可以按下Shift + Enter组合键或打开“插入”菜单后选择“换行符”命令实现换行,这样开始的一行仍是原段落的一部分,并且保留原段落所有格式属性。
3.使用样式
“样式”是字体、段落等各种格式化信息的集合。利用“格式”工具栏中的“样式”下拉框,可以将各种标题和项目符号等预置样式和自定义样式应用到段落中去。若要修改或新建样式,则打开“格式”菜单,选择“样式”命令,在“样式”对话框中进行相关操作。
对前面制作的网页“邮件确认表单”进行文本格式设定和修饰后,如图9-18所示。与图9-9相比,效果明显改善。图9-18“邮件确认”网页9.3.4设置背景
1.设置网页的背景图片
我们可以为网页设置背景图片。所有的网页元素,如文本和图形,都会出现在当前背景图片上。背景图片可以是站点、文件系统、全球广域网或剪贴画中的图片,也可以将背景图片设置为水印。设置网页背景图片的操作步骤如下:
(1)在网页视图模式下,右键单击网页,然后单击快捷菜单中的“网页属性”,单击“格式”选项卡,如图9-14所示。
(2)选择“背景图片”复选框,然后单击“浏览”,弹出如图9-19所示的对话框。
(3)在图9-19中选择背景图片,可以选择剪贴画、本地计算机上的图片,也可以选择广域网上的图片。图9-19选择背景图片
2.设置背景颜色
设置网页背景颜色的操作步骤如下:
(1)在网页视图模式下,右键单击网页,然后单击快捷菜单中的“网页属性”,单击“背景”选项卡,如图9-14所示。
(2)在背景框中选择一种背景即可。
3.设置背景音乐
在网页中设置背景声音后,当访问者打开网页时,就会播放声音。设置背景音乐的操作步骤如下:
(1)在网页视图模式下,右键单击网页,然后单击快捷菜单中的“网页属性”,打开如图9-14所示的对话框。
(2)在“常规”选项卡中的“背景音乐”的“位置”框中,键入要播放的声音文件,或单击“浏览”来找出所要播放的声音文件。
(3)如要持续地播放声音,可选择“不限次数”复选框,如只要声音播放固定次数,则清除“不限次数”复选框,然后在“循环次数”框中键入所想播放的声音次数。9.3.5使用超链接
1.使用文本超链接
文本超链接是指以文本为超链接源的超链接,网页上绝大多数的超链接都是文本超链接。浏览器通常给包含超链接的文本加下划线,并以一种颜色来显示,通常是蓝色,如果用户访问过一个超链接,则它对应的文字的颜色就变成暗红色。
创建文本超链接的步骤如下:
(1)在“网页”视图中,选中作为超链接源的文本。
(2)在选中的文本上,单击鼠标右键,在弹出快捷菜单中选择“超链接”命令,弹出“插入超链接”对话框,如图9-20所示。
图9-20“插入超链接”对话框
·本文档中的位置:选中要作为超链接的文字或其他内容,单击鼠标右键,弹出快捷菜单,在其中选择“超链接”命令,弹出“创建超链接”对话框。单击“本文档中的位置”选项,选择文档中的书签位置,然后单击“确定”按钮。
·新建文档:在弹出的“创建超链接”对话框中单击“创建一个网页并链接到该网页”按钮,弹出“新建网页”对话框,输入“新建文档名称”。返回FrontPage2003主界面,新建了一个新的网页。
·电子邮件地址:选中要以E-mail地址作为超链接目标的E-mail地址,单击鼠标右键,弹出快捷菜单,如图9-21所示。在其中选择“超链接”命令,弹出“创建超链接”对话框。单击“电子邮件地址”选项,弹出如图9-22所示的“创建电子邮件超链接”对话框。在“电子邮件地址”栏中键入要发送的电子邮件,单击“确定”按钮。图9-21E-mail地址的快捷菜单图9-22“创建电子邮件超链接”对话框
2.创建图片超链接
使用图片作为超链接源要比用文字作为超链接源生动得多,但是图片文件比较大,传输速度比较慢。因此在网页中利用图片作为超链接要少而精。
创建整个图片的超链接的步骤如下:
(1)在“网页”视图中,选中需要建立超链接的图片,单击鼠标右键,在弹出的快捷菜单中选择“超链接”命令,弹出如图9-20所示的“插入超链接”对话框。
(2)选择需要链接到的目标。同样,在对话框中可以选择四种链接目标,具体使用方法与创建文本超链接一样,这里不再重复。
(3)单击“确定”按钮即可。创建整个图片的超链接还有一种方法,其步骤如下:
(1)在“网页”视图中,选中需要建立超链接的图片,单击鼠标右键,在弹出的快捷菜单中选择“图片属性”命令,在弹出的“图片属性”对话框中选择“常规”选项卡,如图9-23所示。图9-23“常规”选项卡
(2)在“默认超链接”下的“位置”中直接键入目标网页的URL,单击“确定”按钮,弹出“创建超链接”对话框。也可以单击“浏览”按钮,弹出“编辑超链接”对话框。
(3)选择需要链接到的目标,同样也有多种选择。
(4)选择完毕,单击“确定”按钮。返回“图片属性”对话框,在“位置”中自动填上选择目标的URL。
(5)单击“确定”按钮即可。9.3.6使用表格
作为组织文字的一种方法,表格具有很多优点,用表格可以非常方便地排列网页中的文本。在网页设计中,表格可用来调整页面布局;对网页信息进行分类处理;进行图文混排;添加表格背景色调;还可以利用表格把图像分成小块。
1.创建表格
FrontPage2003提供了方便、快捷、灵活的多种表格操作,在主菜单中有“表格”菜单,在工具栏中提供了表格工具栏。
打开“表格”菜单,该菜单有许多选项,其中四个常用的菜单项是插入、选择、转换、属性等。
·插入:有四个子选项,分别用来插入表格、插入行、插入列和插入单元格。
·选择:有四个子选项,分别用来选定表格、选定行、选定列和选定单元格。
·转换:有两个子选项,分别实现“表格转换为文本”和“文本转换为表格”。
·属性:分别用来查看表格、单元格和标题的属性。
打开“查看”菜单,选择“工具栏”的“表格”命令,弹出表格工具栏,如图9-24所示。图9-24表格工具栏创建表格是常用的一种操作。创建表格的步骤如下:
(1)打开“表格”菜单,选择“插入”中的“表格”命令,弹出图9-25所示的“插入表格”对话框。图9-25“插入表格”对话框
2.设置表格属性
通过设置表格(或单元格)的属性,可以指定表格(或单元格)的布局、边框和背景等。设置表格属性的步骤如下:
(1)将鼠标移到表格内的任意位置,单击鼠标右键,在弹出的快捷菜单中选择“表格属性”命令。或者打开“表格”菜单,选择“表格属性”→“表格”命令,弹出图9-26所示“表格属性”对话框。图9-26“表格属性”对话框
(2)在对话框中包括了布局、边框和背景三个方面的设置,用户可以根据需要进行设置。
除了设置表格属性之外,我们还可以单独对单元格进行属性设置。设置单元格属性的步骤如下:
(1)将鼠标移到某单元格内,单击鼠标右键,在弹出的快捷菜单中选择“单元格属性”命令。或者打开“表格”菜单,选择“表格属性”→“单元格”命令,弹出如图9-27所示的“单元格属性”对话框。图9-27“单元格属性”对话框
(2)在对话框中包括布局、边框和背景三个方面的设置,可以根据需要进行相应的设置。
如果要同时设置多个单元格的属性,具体步骤如下:
(1)打开“表格”菜单,选择“选定”→“单元格”命令。
(2)按住Ctrl键,用鼠标依次单击需要选中的单元格。选择完毕,单击鼠标右键,在弹出的快捷菜单中选择“单元格属性”命令,或者打开“表格”菜单,选择“属性”→“单元格”命令,弹出如图9-27所示的“单元格属性”对话框。
(3)在“单元格属性”对话框中,可以设置它们的布局、边框和背景图片等。
3.为表格添加标题
FrontPage2003中通常用一个标题作为表格内容的概括,相当于表格的名称。标题的位置可在表格的上方或下方。为表格添加标题的步骤如下:
(1)在“网页”视图方式下,将鼠标移到表格中任意一个单元格内。
(2)打开“表格”菜单,选择“插入”→“标题”命令。
(3)在表格的顶端自动空出一行,并将光标定位于这一行中,键入表格的标题。
(4)将鼠标定位于表格标题中,单击鼠标右键,弹出快捷菜单,在其中选择“标题属性”命令,弹出图9-28所示“标题属性”对话框。图9-28“标题属性”对话框
(5)在对话框中选择“位置”在“表格底部”,单击“确定”按钮。这样表格的标题从在表格的顶端移到了表格的底部。图9-29单元格中插入图片
5.在表格中添加背景颜色或背景图片
可以为表格设置背景颜色或背景图片。背景颜色可用来标记特殊的列或栏,起到强调的作用,背景图片可以增加表格的视觉效果。
设置单元格背景颜色的步骤如下:
(1)选中需要设置背景颜色的单元格。
(2)打开“表格”菜单,选择“属性”→“单元格”命令,弹出“单元格属性”对话框,如图9-27所示。
(3)单击“背景”栏中的“颜色”编辑框的向下箭头,打开颜色编辑框。
(4)选中需要的背景颜色,单击“确定”按钮。设置单元格背景图片的步骤如下:
(1)选中需要设置背景图片的单元格。
(2)打开“表格”菜单,选择“属性”→“单元格”命令,弹出“单元格属性”对话框。
(3)单击选中“使用背景图片”复选框。
(4)单击“浏览”按钮,打开“选择文件”对话框,选择作为背景的图片文件,单击“确定”按钮。不仅可以对某些单元格设置背景颜色和图片,还可以对整个表格设置。设置表格背景颜色与图片的方法与单元格设置方法类似。具体步骤如下:
(1)将光标定位在表格中的任意位置。
(2)打开“表格”菜单,选择“属性”→“表格”命令,弹出“表格属性”对话框,如图9-26所示。
(3)类似于单元格属性的操作方法,给表格添加背景颜色或背景图片。9.3.7其他操作
1.项目符号和编号
若要显示不连续的列表项目,可以创建项目符号列表;若要显示连续的列表项目,则可以创建编号列表。操作步骤如下:
(1)在网页视图下,将插入点放在要创建列表处,在“格式”菜单上单击“项目符号和编号方式”,弹出如图9-30所示的对话框。图9-30“项目符号和编号方式”对话框
(2)若要使用自定义项目符号,则单击“图片项目符号”选项卡,再单击“指定图片”,通过“浏览”来查找并选取所要使用的图形;若要使用标准项目符号,如圆圈或方点,则单击“无格式项目列表”选项卡,再单击所要使用项目符号的框,然后单击“确定”按钮,如图9-31所示。图9-31“无格式项目列表”选项卡图9-32“编号”选项卡
(4)每一个要添加至列表的项目,直接键入项目,然后按Enter键。键入最后一个项目之后,可按Enter键两次退出列表。
2.插入水平线
我们可以在网页中添加水平线,用于分隔文本或加着重符。在添加水平线后,可以修改其属性来更改其宽度、高度、对齐方式和颜色。插入水平线的操作步骤如下:
(1)在网页视图模式下,请将光标移至您想要插入水平线的地方。
(2)在“插入”菜单中,单击“水平线”,即可插入一条默认的水平线。
(3)要修改水平线的外观,双击水平线,弹出如图9-33所示的对话框,然后完成一项或多项下列操作:
在“宽度”下,根据视窗宽度的百分比或像素值来指定水平线的宽度。
在“高度”下,输入水平线高度的像素值。
在“对齐方式”下,指定水平线在网页上的对齐方式。
在“颜色”框中,如果不要阴影线,可为水平线选择一种颜色。
如果希望水平线以实心方式出现,则选择“实线”复选框。如果希望水平线以阴影方式出现,则清除此复选框。如果选择了颜色,水平线会显示为实心,将无法应用阴影
效果。图9-33“水平线属性”对话框
3.插入日戳
我们可以在网页中添加日戳来显示网页上次更改的时间或日期。日戳可让站点访问者知道,在他们上次访问之后站点上的信息是否有所更改。
插入日戳的操作步骤如下:
(1)在网页视图模式下,请将光标移至您想要放置日戳的地方。
(2)在“插入”菜单中,单击“日期和时间”,弹出如图8-25所示的对话框。
(3)在图9-34中指定要显示的日戳的类型及日期和时间的格式。图9-34日期和时间属性设置
4.插入注释
我们可以为网页添加注释,例如将信息提供给另一个网页创作者。注释具有与当前段落样式相同的属性,但以不同的颜色显示。虽然注释可以在编辑网页时被查看,但站点访问者在浏览网页时无法在Web浏览器上看见注释。插入注释的操作步骤如下:
(1)在网页视图模式下,将光标移至想添加注释的地方。
(2)在“插入”菜单中,单击“注释”,在弹出的“注释”对话框中键入注释,单击“确定”按钮即可。
(3)双击注释,弹出“注释”对话框,在其中编辑注释即可。 9.4使用框架
9.4.1框架概述
框架用来在一个浏览器窗口中显示多个页面。框架是网页中常用的技术,Internet中的大多数网页都使用了框架技术。框架技术将浏览器窗口拆分为相互独立又保持联系的多个框架,每个框架都与一个网页文件相对应。框架的独立性表现在当更新某个框架内容时,不会影响浏览器窗口中的其他框架;框架的关联性表现在单击某个框架中的超链接时,将在浏览器窗口的其他框架中显示超链接目标页面。在浏览网页时,我们肯定遇到过这样的情形:浏览器窗口中被分隔成几个不同的区域,每个区域中显示不同的文档内容。最常见的是将左方或上方区域设置为目录区域,其中显示文档页面的目录索引或导航条,而将右方或下方区域设置为主体区域,显示网页主体内容。通过单击不同的目录索引条目或导航条按钮,就可以在主体区域实现网页之间的导航。在浏览网页的同时,目录索引或导航条始终显示在窗口目录区中,这样便于用户继续浏览其他的内容。框架技术主要通过框架集和框架两种元素来实现。框架集实际上是一个页面,用于定义在一个窗口中显示多个文档的框架结构。例如,它可以决定窗口中显示的框架数目和每个框架的尺寸等。一般来说,框架集文档中的内容不会显示在浏览器中,因此,可以将框架集仅仅看成是一个可以容纳和组织多个文档的容器。而框架就是在框架集中被组织和显示的文档。在框架集中显示的每个框架实际上都是一个独立存在的HTML文档。框架技术经常用于实现文档的导航,其作用有点像Windows的资源管理器,一个窗格显示目录结构,另一个窗格显示具体内容。9.4.2创建框架
要在FrontPage2003中创建框架网页,必须使用框架网页模板。在框架网页模板的帮助下,生成初步的框架网页。此时网页工作区新增“无框架”和“框架网页HTML”两个按钮,前者生成的网页适用于不支持框架技术的浏览器,后者用于定义框架网页的总体结构。
创建框架的步骤如下:
(1)打开“文件”菜单,选择“新建”菜单后,在任务窗格中单击“其他网页模板”,弹出“新建”对话框,选择“框架网页”选项卡,如图9-35所示。图9-35“框架网页”选项卡
(2)在框架网页列表框中选择一种模板,右侧“预览”区显示所选模板外观布局,“说明”区给出简短的说明文字。
(3)选择所需的框架网页模板后,单击“确定”按钮就创建了框架网页,如图9-36所示。图9-36新建“框架”网页
(4)在新建框架网页中单击某个框架后,其周围的边框显示为深蓝色,表明该框架处于选中状态。
(5)刚创建的框架网页呈灰色,每个框架中显示“设置初始网页”和“新建网页”两个按钮。单击“设置初始网页”按钮可将一个已制作好的网页作为该框架对应的网页;单击“新建网页”按钮,可创建一个新网页作为该框架对应的网页。
使用框架网页时,不能使用共享边框或导航栏,否则将导致站点出现导航错误。9.4.3编辑框架
1.改变框架大小
将鼠标移至框架边框线上,出现双向箭头时拖动边界线至合适位置并释放鼠标,框架尺寸就发生了变化。若要精确设置框架大小,可利用单击鼠标右键弹出的快捷菜单,打开“框架属性”对话框,如图9-37所示,在“框架大小”设置区的“宽度”和“行高”编辑框中设定大小即可。
框架大小的度量单位可以是“像素”、“百分比”和“相对”三种。选择“相对”作为度量单位时,表示选择框架与同列或同行框架的相对大小。图9-37“框架属性”对话框
2.拆分框架
将鼠标移至框架边框线上出现双向箭头时,按下Ctrl键并拖动边界线至合适位置时释放鼠标,选定框架一分为二。也可利用“框架”菜单中的“拆分框架”命令拆分框架。
3.删除框架
选定要删除的框架,打开“框架”菜单,选择“删除框架”命令。虽然FrontPage2003对页面内框架的数量没有限制,但最好不要超过四个框架,否则将使页面看起来很零乱。
4.设置框架间距
默认情况下,框架间距为两个像素,若要改变框架间距,可在“框架属性”对话框中,单击“框架网页”按钮打开“网页属性”对话框,如图9-38所示。在“框架”选项卡中设定框架间距。若取消选中“显示边框”复选框,框架间将不显示边界线。图9-38“网页属性”对话框
5.显示滚动条
一般来说,框架大小是有限的,在“框架属性”对话框的选项设置区中,一定要将“显示滚动条”选项值设定为“总是”或“在需要时”,确保通过滚动条操作在框架内看到页面的全部信息。
6.更换初始网页
如果希望更换框架对应网页,可在“框架属性”对话框中单击“初始网页”编辑框右侧的“浏览”按钮,选择其他网页。9.4.4保存框架网页
对于一个双框架网页,保存框架网页时要保存三个文件,其中一个用于保存框架页面布局的框架页面文件,另两个文件分别保存每个框架对应的页面文件。保存框架页面的步骤如下:
(1)单击常用工具栏上的“保存”按钮,弹出“另存为”对话框,如图9-39所示。“另存为”对话框右侧图片表示现在要保存的是左框架对应的页面文件,在“文件名”编辑框内输入网页文件名“Left.htm”,单击“保存”按钮保存左框架对应的页面文件。
(2)同样的方法保存右框架对应的页面文件,文件名为“Right.htm”。
(3)最后保存框架网页。观察一下,现在“另存为”对话框右侧图片整个框架都选中了,如图9-40所示。输入框架网页的名称“Frame.htm”,单击“保存”按钮,框架网页保存完毕。
如果只想保存某个框架对应页面,比如只保存左框架的对应页文件,只要选中左框架,打开“框架”菜单,选择“保存网页”或“另存新网页”命令,这时左框架的对应页面就保存了。图9-39保存左框架图9-40保存整个框架
9.5制作动态网页
在网页设计过程中,字幕、广告管理器和交互式按钮等动态效果一直深受人们关注。MicrosoftFrontPage2003将这些流行的功能进行组合和编程,使它们成为可以轻易添加到网页内的组件。FrontPage2003提供的几十个组件和对外部程序的有力支持将设计者从大量的编程工作中解脱出来,人们只需通过简单的选择和设置就能获得令人满意的动态效果。下面将介绍几个常用组件的使用方法。9.5.1使用字幕
网页内的字幕就是在浏览器中水平滚动的文字信息,它用于发布Web站点通知和提示信息。创建字幕的过程仅仅是打开“字幕属性”对话框进行简单的输入和设置操作的过程,就可将生动形象、形式多样的字幕插入到网页中。具体操作步骤如下:
(1)在“设计”标签状态下,将光标定位到要插入字幕的地方或选择希望作为字幕的文本。
(2)打开“插入”菜单,选择“Web组件”命令,如图9-41所示。打开“字幕属性”对话框,如图9-42所示。图9-41插入字幕图9-42“字幕属性”对话框
(3)在“文本”编辑框中输入字幕内容。如果在页面内选择了作为字幕的文本,它将出现在编辑框内。
在“方向”设置区内设置字幕水平滚动方向,从左向右或从右向左。
在“速度”设置区内调整字幕的滚动速度。“延迟”表示字幕每滚动一步的时间间隔是多少毫秒;“数量”表示字幕每滚动一步的距离是多少像素。
在“表现方式”设置区内指定滚动字幕的表现方式。默认是“滚动条”,字幕最后一个字符滚出边界后再次重新出现;若选择“幻灯片”,则字幕第一个字符触及边界时就停止滚动;若选择“交替”,字幕就往复滚动。在“文本对齐方式”设置区内调整字幕和它所在行文字的对齐方式。
在“大小”设置区内设置字幕的宽度与高度。通常,我们可以使用像素来控制字幕的实际大小,也可以使用百分比来设置字幕的宽度,这时字幕的实际大小是根据浏览器窗口大小的百分比来计算的。
在“重复”设置区内指定滚动效果的循环次数。
在“背景颜色”设置区内调整字幕的背景颜色。
(4)设置完毕,单击“确认”按钮关闭“字幕属性”对话框,然后切换到预览模式下观察滚动效果。
图9-43所示的是使用了滚动字幕的网页。在浏览时,可以看到字幕“讽刺与幽默”在屏幕上从左向右滚动。图9-43滚动字幕9.5.2交互式按钮
交互式按钮是一种具有动态效果的活动按钮,当鼠标移至交互式按钮时,它能按照设置显示一些动态特性,如改变字体格式、发光等。单击交互式按钮时,能在浏览器窗口内打开所定义的超链接目标,还可定义交互式按钮在单击或交互式时播放声音和显示图片。制作交互式按钮的步骤如下:
(1)在“设计”标签状态下,将光标定位到要插入悬停按钮的地方。
(2)打开“插入”菜单,选择“Web组件”→“交互式按钮”命令,如图9-44所示。打开“交互式按钮”对话框,如图9-45所示。图9-44插入交互式按钮图9-45“交互式按钮”属性对话框
(3)在“文本”编辑栏中,输入要在按钮上显示的文字。默认的文字是“按钮文本”。单击“字体”选项卡可设置按钮文字的字体。无论按钮上文字的字号设置多么大,动态按钮的尺寸不变,显示不下的文字将被裁剪掉。
(4)在“链接”编辑栏中,设置超链接目标文件的URL。单击“浏览”按钮也可打开“选择交互式按钮超链接”对话框,从中设置超链接目标文件的URL。
(5)通过“按钮”下拉列表选择不同风格的按钮,通过“预览”查看按钮上的动态效果和颜色变化;选择“图像”选项卡后,通过“宽度”和“高度”编辑栏设定按钮尺寸大小,如图9-46所示。图9-46“自定义”对话框
(6)设置完毕,单击“确定”按钮,一个交互式按钮就制作好了。如图9-47所示,这时,可在浏览器中预览一下按钮的动态效果。图9-47交互式按钮9.5.3横幅广告管理器
横幅广告管理器是一个简单易用的广告组件,它可以使几幅图片按照一定的过渡效果在浏览器窗口中循环播放,并且可以控制每一幅图片显示的时间,单击横幅广告条,还能切换到它链接的另外一幅页面。制作横幅广告管理器的步骤如下:
(1)在“设计”标签状态下,将光标定位到要插入横幅广告管理器的地方。
(2)打开“插入”菜单,“横幅广告管理器”命令,如图9-48所示。打开“横幅广告管理器属性”对话框,如图9-49所示。图9-48插入横幅广告管理器图9-49“横幅广告管理器属性”对话框
(3)在“宽度”和“高度”编辑栏内设置横幅广告的显示尺寸,单位为像素。
在“过渡效果”下拉列表框中选择广告各画面之间的过渡效果。
在“每幅图片显示”编辑框内设置每幅画面在浏览器窗口中的显示时间,单位为秒。
在“链接到”编辑框内设置横幅广告的超链接目标。
在“显示图片”设置区添加图片、删除图片或改变选定图片在广告中的播放顺序。
(4)设置完毕,单击“确定”按钮。
只有在浏览器中才能观察到横幅广告效果。9.5.4DHTML效果
利用DHTML工具栏可以对选定对象进行适当的设置。在执行打开网页、单击、双击或移动鼠标时,使页面上的选定文本或图片都能动起来。这些特殊效果大大增强了网页的吸引力,而且用FrontPage2003很容易实现,具体操作步骤如下:
(1)选定页面上准备施加DHTML效果的对象。
(2)打开“DHTML效果”工具栏,单击“视图”→“工具栏”→“DHTML效果”命令,如图9-50所示。图9-50打开动态HTML效果
(3)打开“DHTML效果”对话框,如图9-51所示。在“开启”下拉列表中选择一种事件。这里,事件表示浏览器能识别的动作,开启下拉列表中有“单击”、“双击”、“鼠标悬停”和“网页加载”四种事件,这四种事件发生时都能触发选定对象产生动态效果。假设选择“单击”事件。图9-51选择一种事件“单击”和“双击”是使用最频繁的鼠标操作。若选定对象为文本,可用效果有“飞出”和“格式”两种;若选定对象为图片,可用效果有“飞出”和“交换图片”两种。“鼠标悬停”表示鼠标停在选定对象上时的触发动态效果。若选定对象为文本,可用效果只有“格式”一种;若选定对象为图片,可用效果也只有“交换图片”一种。
“网页加载”表示打开该网页时触发动态效果。此时可设置的动态效果有“弹起”、“飞入”、“螺旋”和“擦除”等。
(4)在“应用”下拉列表中,选择一种效果。注意选定对象类型和事件不同将显示不同的可选项目。这时选择“飞出”,表明“单击”事件发生时选定对象要产生飞出效果。
在“效果”下拉列表中选择一种设置。这里显示的项目与前面的设置有关,对于文字对象的“单击”事件有八种飞出效果供用户选用,如图9-52所示。而对于文字对象的“鼠标悬停”事件只有两种格式供用户选用,如图9-53所示。图9-52“单击”的飞出效果图9-53鼠标悬停效果9.5.5其他操作
1.使用音频
对多媒体的良好支持是FrontPage2003的一个重要特色,我们能够很容易地在网页里播放音乐。新版本的浏览器支持 .wav、.snd、.au和MIDI格式音频文件。在FrontPage2003中有嵌入、插入和链接三种方法调用音频文件;利用“插件”功能在网页中嵌入音频,任意控制音频播放;利用“网页属性”对话框将音频设置为网页背景音乐,在打开网页时自动播放;创建到音频文件的超链接,从网上下载音频文件。
1)利用“插件”功能调用音频文件
(1)打开“插入”菜单,选择“Web组件”→“高级控件”→“插件”命令,如图9-54所示,打开“插件属性”对话框,如图9-55所示。图9-54插入“插件”
(2)单击“浏览”按钮,打开文件选择对话框,从中选择要播放的音频文件。可以选择扩展名为 .wav、.mid、.snd、.au的音频文件。
(3)单击“确定”按钮。在设计模式页面中出现插头标记表示插入音频的位置,切换到预览模式,音乐就自动播放了,现在插头变成一个播放器,如图9-56所示。
图9-55“插件属性”对话框图9-56插头标记和播放器
2)建立链接到音乐文件的超链接
建立链接到音乐文件超链接的步骤如下:
(1)选中作为超链接源的文本或者图片,单击鼠标右键,在弹出的快捷菜单中选择“超链接”命令,弹出“创建超链接”对话框。
(2)选中所需要的音乐文件。例如,选择一个 .wav格式的音乐文件。
(3)单击“确定”按钮,这样链接到音乐文件的超链接就做好了。
2.使用视频
用FrontPage2003不仅可以灵活地使用音频,同时也可以很方便地控制视频。同样可以使用嵌入、插入和链接三种方法使用视频。
如果要在网页中嵌入视频,具体步骤同嵌入音频一样。
使用插件,浏览者可以方便地控制媒体的播放。如果视频播放控件太小,可以回到设计模式,单击视频的图标,拖动视频图标周围的小黑点改变大小即可,如图9-57所示。图9-57嵌入视频使用插件技术嵌入视频时,只有切换至“预览”模式或在浏览器内打开时才能看到视频图像的第一帧。对于使用InternetExplorer的用户来说,可将视频直接插入网页,并对播放视频文件的次数、间隔和播放方式进行设置。在网页中插入视频文件的步骤如下:
(1)确定网页中需插入视频的位置。
(2)打开“插入”菜单,选择“图片”→“视频”命令,如图9-58所示,打开“视频”对话框,如图9-59所示。图9-58插入视频图9-59“视频”对话框
(3)选择视频文件,单击“打开”按钮。切换到预览模式,视频就自动播放了。
(4)默认设置为视频自动播放,可以利用“图片属性”对话框改变设置。在“网页”视图中,用鼠标右键单击视频图像,在快捷菜单中选择“网页属性”命令,弹出“网页属性”对话框,选择“视频”选项卡,如图9-60所示。
链接视频文件很简单,只要选定超链接载体后利用“创建超链接”对话框选择视频文件即可。这与创建普通超链接的方法完全一致,唯一不同的是超链接目标文件类型为视频文件。图9-60“视频”选项卡
3.使用表单
表单是网页交互功能的集中体现,它可以帮助管理员收集所需的信息,在调查反馈信息、搜索站点内容、接受网上注册和实现网上查询等方面具有广泛的应用前景,图9-61所示的是一个典型的表单。图9-61新浪会员注册表单常见的典型表单有以下几种:
(1)用户注册表单:用来限制或监控站点的访问,记录访问者登录时所用的用户名和口令。注册表单必须保存在根站点,创建注册表单最简单的方法是通过用户注册网页模板。
(2)确认表单:用来向用户确认由FrontPage表单结果或注册组件所处理的用户输入。
(3)搜索表单:用来让站点访问者对指定单字或短语搜索站点。当访问者提交搜索表单后,FrontPage检索文本索引,并且按匹配程度显示指向包含搜索文本的网页的超链接列表。
1)创建表单
创建表单的操作步骤如下:
(1)在“网页”视图方式下,将光标定位在要插入表单的位置上。
(2)打开“插入”菜单,选择“表单”→“表单”命令。或者单击表单工具栏中的“表单”按钮。生成一个含有“提交”和“全部重写”两个按钮的表单。
假设我们要制作如图9-62所示的表单。那么在制作表单时,应添加的表单域有:单行文本框、下拉菜单、单选框、复选框、滚动文本框等。添加这些表单域后,还要进行必要的属性设置。图9-62用户调查表
2)添加单行文本框表单域
(1)将光标定位在需要插入文本框的地方,打开“插入”菜单,选择“表单”→“单行文本框”命令。这样就插入了一个单行文本框。或者直接单击表单工具栏中的“单行文本框”按钮,即插入了一个单行文本框。在网上对于姓名、口令之类的信息一般都以单行文本框的形式让用户自己填写。
为了使表单域满足我们的实际需要,在插入表单域后可以对其属性栏按照实际要求进行设置。
(2)双击表单域或选中表单域单击鼠标右键,在弹出的快捷菜单中选择“表单域属性”命令,则会弹出相应的表单域属性对话框。
打开如图9-63所示的“文本框属性”对话框,在这个对话框中我们可以为文本框赋初始值、宽度等。图9-63“文本框属性”对话框
(3)在如图9-63所示的对话框中,单击“验证有效性”按钮,弹出“文本框有效性验证”对话框,它是有关文本框设置的一个非常重要的对话框。在对话框中,可以选择输入数据的类型,这样就可以限制和提醒用户输入正确格式的数据。比如邮政编码是6位纯数字的数据格式,“文本框有效性验证”可以防止用户多输入一位数字和输入非数字数据。因此在添加文本框表单域时,如果有特殊要求时就要设置它的属性。
3)添加下拉菜单表单域
(1)将光标定位在需要插入文本框的地方,打开“插入”菜单,选择“表单”→“下拉菜单”命令。在光标定位处出现一个空的下拉菜单。或者直接单击表单工具栏中的“下拉菜单”按钮,即插入了一个下拉菜单。下拉菜单也叫下拉列表,它的内容可以在设置属性时填写。
(2)双击刚才生成的下拉菜单,弹出如图9-64所示“下拉框属性”对话框,在这个对话框中,设置它的名称,包括列表项,是否允许多重选择等。
(3)给这个对话框添加列表项。单击“添加”按钮,弹出如图9-65所示的“添加选项”对话框,在“选项”中填入选项的内容,系统的默认指定值和选项内容是一致的。当然,我们也可以设置这个选项内容的初始状态,设置完毕,单击“确定”按钮,返回“下拉菜单属性”对话框。
图9-64“下拉框属性”对话框图9-65“添加选项”对话框
(4)再次单击“添加”按钮添加新的列表项。
(5)填入选项的内容和初始状态,然后单击“确定”按钮。图9-66所示的是一个已经填写好选项的“下拉框属性”对话框。可以对这些选项进行修改、删除和上下移动。
(6)单击“验证有效性”按钮,我们来看看下拉菜单的有效性验证。如果下拉菜单不允许有多重选项,则弹出如图9-67所示“下拉框验证”对话框,在对话框中可以复选“要求有数据”,即用户必须在下拉菜单中选择一项。选中“禁用第一项”则用户不能选择下拉菜单中的第一项,这是因为我们常常将下拉菜单的第一项作为对下拉菜单功能的说明。图9-66“下拉框属性”对话框图9-67“下拉框验证”对话框(之一)如果下拉菜单允许多重选项,则弹出如图9-68所示的对话框,在对话框中可以复选“要求有数据”,并且还可以设定至少或至多选择多少项,即用户必须在下拉菜单中选择介于至多至少之间的选项。选中“禁用第一项”时,用户不能选择下拉菜单中的第一项。图9-68“下拉框验证”对话框(之二)图9-69“选项按钮属性”对话框
(4)在如图9-69所示的对话框中,需要设置“组名称”,它决定了哪几个单选框之间有互斥性,即哪几个单选框属于同一个组。凡是在同一个表单中具有相同组名称的单选框就属于同一个组。在这个对话框中还可以设置单选框的初始状态,一般一组单选框中必须设置好一个而且只能是一个单选框的初始状态为“已选”。
当两个单选框都设置好后,即已经有一组单选框时,“验证有效性”按钮才会被激活。
(5)单击“验证有效性”按钮,弹出如图9-70所示“选项按钮验证”对话框。它操作比较简单,“要求有数据”表示用户必须选中一个选项,只有选中“要求有数据”复选框,“显示名称”才会被激活,输入的显示名称内容用于指定验证警告信息中说明此表单域时用的名称。图9-70“选项按钮验证”对话框
(2)选中文本和复选框,单击表单工具栏中的“标签”按钮,从而将文本与复选框关联。为了方便用户键盘操作,还可以设置热键,即当按下Alt键与该标签上的某个特定字母时,相应的操作热点就转移到这个表单域上来。设置“热键”的操作比较简单,在标签的文本中加上字母,并给该字母设置下划线属性,则此字母便成为此标签的热键。
使用同样的方法建立多个复选框,但是系统还不知道这些复选框是否关联。我们需要设置这些复选框的属性,将其关联起来。
(3)双击复选框表单域,弹出如图9-71所示的“复选框属性”对话框。将这些复选框的名称都设置成相同,这些复选框将相关联。在“初始状态”中我们可以设置“选中”或者“未选中”。“选中”时用户开始看到的复选框有一个对号;“未选中”时用户看到的复选框为空框。图9-71“复选框属性”对话框 9.6站点管理
9.6.1创建站点
1.建立个人站点
打开编辑主界面,建立个人站点的步骤如下:
(1)打开“文件”菜单,选择“新建”→“网站”命令,打开“新建网站”任务窗格。
(2)选择“由一个网页组成的网站…”选项,在“指定新网站的位置”中指定新站点在用户计算机上的位置,如“C:\MyDocuments\Mywebs”。
(3)单击“确定”按钮,屏幕上将显示“正在创建新站点”提示对话框,稍后弹出如图9-72所示的FrontPage2003的主界面。图9-72FrontPage主界面这时,已经利用“个人站点”模板成功地创建好一个个人站点。在主界面的“文件夹列表”中给出了这个站点中包括的文件和文件夹。
文件夹列表中详细列出了站点根目录下的文件夹和文件,可以看到“个人站点”模板创建了_private和images等多个文件夹,还有六个网页favorite.htm(收藏夹)、index.htm(主页)、interest.htm(兴趣)、aboutme.htm(自序)、feedback.htm(反馈)和photo.htm(图片集)。在“文件夹列表”中单击每一个文件夹,可使文件窗口中显示该文件夹中的文件和下一级文件夹。
单击“视图”菜单下的“导航”,FrontPage2003以形象的图示给出当前站点的导航结构,如图9-73所示。图9-73“导航”结构
2.使用站点向导
我们也可以使用“站点向导”,从本地计算机或网络导入一个源目录里的文件,创建站点。操作步骤如下:
(1)单击“文件”→“新建”,在任务窗格中单击“其他网站模板”,打开如图9-74所示的“网站模板”对话框。图9-74“网站模板”对话框
(2)选择“导入站点向导”,在“指定新网站的位置”中输入新站点所在的位置后,单击“确定”按钮,屏幕上将显示“创建新站点”的提示,稍后出现如图9-75所示的对话框。选择所要导入文件的位置后,单击“下一步”按钮。图9-75“选择源”对话框
(3)弹出如图9-76所示的“编辑文件列表”对话框,再单击“下一步”按钮。图9-76“编辑文件列表”对话框
(4)创建新站点成功,弹出如图9-77所示的对话框,单击“完成”按钮即可。图9-77完成站点的创建9.6.2视图
1.文件夹视图
文件夹视图以列表的形式给出了当前站点中的文件夹和文件夹里包含的文件。由于一个站点要涉及到许多文件,因此将这些文件分门别类地放置在不同文件夹中就很有必要。比如,可以把所有的图形文件放入images文件夹。FrontPage2003还提供了一个_private文件夹,用来存放一些网络浏览者不可见的信息。与Windows中的资源管理器类似,我们可以在文件夹视图中查看、创建和删除文件夹和网页文件,唯一不同的是FrontPage2003的站点管理功能自动维护着超链接关系和导航信息等。 在FrontPage2003中,单击视图区中的 “文件夹”图标,打开文件夹视图,如图9-78所示。图9-78文件夹视图
2.报表视图
报表视图提供了关于当前站点全面的综合统计信息,利用它可以更好地分析和管理站点。在FrontPage2003中,单击视图区中的“报表”图标,打开报表视图。在报表视图中主要包括15项内容,每项所表示的意义如图9-79所示。图9-79报表视图
3.导航视图
导航视图主要用于反映站点内各页面之间的逻辑关系,利用它可以方便地设计网站导航结构。在FrontPage2003中,单击视图区中的“导航”图标,打开导航视图,如图9-80所示。图9-80导航视图
4.超链接视图
超链接视图以图形的方式显示了某个网页的进入与外出的链接,超链接视图在决定每个页面共接收和发出多少链接方面时特别有用。在FrontPage2003中,单击视图区中的“超链接”图标,打开超链接视图,如图9-81所示。图9-81超链接视图9.6.3导航栏
导航栏是一组超链接对象,用来浏览站点中全部或部分有代表性的页面。一般在站点的每个页面上显示相同的导航栏,这样便于浏览者访问站点主要网页。在FrontPage2003中,设计者可以手工创建一组按钮或使用一组文本,让它们链接到站点中的相关网页实现导航功能,这种方法可以创建非常个性化的导航栏,但创建工作比较繁琐。也可以利用FrontPage2003的插入导航栏功能自动创建和维护导航栏,这种方法创建的导航栏虽然形式不多,但创建工作比较快捷,而且便于维护。
(2)单击视图栏中的“网页”图标切换到网页视图,在“设计”标签状态下选定要插入导航栏的位置。
(3)打开“插入”菜单,选择“导航”命令→“链接栏”→“基于导航结构的链接栏”,如图9-82所示。
(4)在“要添加到网页的超链接”设置区,选择希望在导航栏中出现的超链接。各选项含义如下:
·父层:在导航栏内,创建指向当前网页上一级网页的超链接,并将上一级网页的标题名称显示在导航栏内。图9-82“链接栏属性”对话框
(4)在“要添加到网页的超链接”设置区,选择希望在导航栏中出现的超链接。各选项含义如下:
·父层:在导航栏内,创建指向当前网页上一级网页的超链接,并将上一级网页的标题名称显示在导航栏内。
·同一层:在导航栏内创建指向当前网页同级网页的超链接,并将同级网页的标题名称显示在导航栏内。
·前一层与后一层:在导航栏内创建向当前网页前、后相邻的两个网页的超链接,相邻的网页位于同级,导航栏内将出现“上一面”与“下一面”选项卡,但并不会出现对应网页的标题名称。
·子层:在导航栏内建立指向当前网页下一级网页的超链接,并将下一级网页的标题名称显示在导航栏内。
·共享层:在导航栏内建立指向站点内顶层网页的超链接,并将顶层网页的标题名称显示在导航栏内。
·主页下面的子页:在导航栏内建立指向紧邻主页的子页的超链接,并将这些子页的标题名称显示在导航栏内。
在“附加网页”设置区选中“主页”和“父页”复选框表示在导航栏中加入到主页和父页的超链接。
(5)在“样式”选项卡中的“方向和外观”设置区选择导航栏在网页上的显示方向和外观。
(6)设置完毕,单击“确定”按钮,导航栏就插入到页面中了,如图9-83所示。图9-83个人站点中的导航栏9.6.4站点维护
1.测试站点
设计制作网页的最终目的是将它们发布到网站上供别人浏览访问。在发布站点之前,有必要对即将发布的站点进行全面的检查,以确保站点结构合理、内容准确、访问流畅,从而吸引更多访问者。测试项目可以包括如下几个方面:
1)页面内容
页面内容很重要,应确保页面内容丰富,没有错误或过时的信息,更不能出现违反法律的内容。应仔细观察页面中的文字、图片、超链接、表格、组件、框架和表单元素是否能准确显示。利用“站点”视图可快速获取站点中的各项信息,帮助我们检查页面内容。
2)浏览速度
页面下载速度是每个浏览者很关心的问题。不管页面设计得多好,内容多丰富,若浏览时要等待很久才出现页面,肯定不受欢迎。影响页面访问速度的因素主要与页面自身和站点服务器带宽有关。如因页面中使用了大量图片文件或交互组件而引起浏览速度降低,则设计者可通过修改页面找到解决方法;如因服务器带宽不够引起,那只能增加服务器带宽。
3)在不同浏览器下测试
虽然页面浏览与客户端操作系统环境无关,但与浏览器及版本号有关,要测试页面在不同的浏览器中是否能正常显示。
4)由不同设计者来测试
网页设计者在检查自己设计的页面时,可能会因习惯的缘故,而对页面中出现的一些问题视而不见,若从不同角度和审美观浏览页面可能会提出许多有益的修改意见。
5)注意收集访问者的反馈信息
网站设计是个不断改进和不断完善的工作,网站发布运行后要注意收集访问者的反馈信息。
2.发布站点
如果站点服务器中已经安装好了FrontPage服务器扩展,而且又具有管理员级的访问权限,那么这便是一项很简单的工作,要做的仅仅是按一个按钮,具体操作步骤如下:
(1)打开“文件”菜单,选择“发布站点”命令,打开“发布站点”对话框,如图9-84所示。
(2)在“指定发布站点的位置”文本框里直接输入站点的URL地址。如果没有配置FrontPage服务器扩展,或Web服务器不能支持FrontPage服务器扩展,那么就不能使用HTTP协议来发布站点,这时可以采用FTP的形式发布站点,只要在“发布站点”对话框中输入站点对应的FTP地址就可以了。
(3)若选中“只发布更改过的网页”单选按钮,则FrontPage会将要发布的文件与Web服务器上的文件进行比较。只有自上次发布后更新的文件才将其发布。图9-84发布站点对话框
(4)若选中“发布所有的网页,覆盖目标站点上已有的同名网页”单选按钮,则FrontPage将发布所有网页。
(5)若选中“包含子站点”复选框,则子站点将随父站点一同发布。
(6)若选中“需要安全的链接”复选框,则发布过程采用安全链接方式。
(7)设置完毕,单击“发布”按钮,这时FrontPage就开始向网站中发送网页了。站点发布成功后给出“完成”对话框,如图9-85所示。
(8)单击“完成”按钮,站点发布成功。图9-85站点发布成功
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 贵阳职业技术学院《塑料成型工艺及模具设计》2023-2024学年第一学期期末试卷
- 2025海南省安全员-B证考试题库及答案
- 贵阳人文科技学院《汽车理论》2023-2024学年第一学期期末试卷
- 2025年重庆建筑安全员考试题库附答案
- 广州应用科技学院《近代材料研究方法》2023-2024学年第一学期期末试卷
- 广州现代信息工程职业技术学院《专业英语与文献阅读》2023-2024学年第一学期期末试卷
- 广州卫生职业技术学院《材料科学基础B》2023-2024学年第一学期期末试卷
- 2025年湖北建筑安全员知识题库附答案
- 2025云南建筑安全员B证考试题库
- 2025年山西省安全员《A证》考试题库
- 三年级上册竖式、脱式、应用题每日一练
- 2023年历届华杯赛初赛小高真题
- 焦作市中佰宜佳材料有限公司年产15万吨煅后焦项目环评报告
- GB/T 6913-2023锅炉用水和冷却水分析方法磷酸盐的测定
- 项目部布置图方案
- 珠海某啤酒厂拆除工程施工方案
- 人教PEP版三年级上册英语 Unit 2 教案 课时一
- 无损检测-渗透检测(导学)
- 2022一、二级个人防护(穿脱防护服)操作评分表(精华版)
- 广东省中医院进修申请表
- 竣工之风量平衡测试报告air distribution balance report
评论
0/150
提交评论