创建 Web 站点结构

按层次结构组织 Web 站点中的页面。Web Site Designer 使用此分层结构信息来自动生成导航链接和站点图。

当站点的结构发生更改时(例如,当添加新的页面时),将自动重新生成导航链接来反映新的 Web 站点结构。将特殊注释标记用于导航栏和站点图来完成此动态导航。这些注释标记使用 Web Site Designer 存储在称为 .website-config 的 XML 文件中的站点结构信息和其它站点相关的信息。当创建 Web 项目时,Web Site Designer 支持是该项目的缺省功能。Web 项目包含名为 Web 站点导航的 website-config 文件的占位符。双击 Web 站点导航将启动 Web Site Designer 并在“导航”视图中打开 website-config。

Web 站点结构中页面之间的关系

在 Web Site Designer 中,Web 站点在“导航”视图中可视地显示。Web 站点中的每个 Web 页面都表示为页面图标。用线连接页面图标以说明页面之间的关系。页面之间可以有几种关系,许多关系是模仿家庭关系的。例如,页面可具有父子关系或兄弟关系。

在以下示例中,index 页面具有连接至页面 productfeedback.jsp 的线。这意味着 index 是子页面 product 和 feedback.jsp 的父代。还意味着 product 页面和 feedback.jsp 页面彼此是兄弟关系。


Web Site Designer“导航”视图

在层次结构中,error 页面与 index 页面的级别相同;然而,它没有使用连接线与任何其它页面连接。error 页面和 index 页面不具有家庭关系类型,而是具有同级关系。

页面关系用来自动生成导航链接。因此,如果在 index、product 和 feedback.jsp 页面上都选择了在导航中显示选项,feedback.jsp 页面的导航栏会包含指向其父代(index 页面)和指向其兄弟(product 页面)的链接。可以看到所有这三个页面都显示在导航中,这是因为“显示在导航”中图标 “显示在导航中”图标的图片 是可视的。然而,error 页面未显示在导航中。这是可以理解的,因为当站点遇到问题时您可能想要创建可以显示的错误页面;然而,您将不想要该 error 页面作为导航部件或在站点图中显示出来。还可以从站点图中包括或除去页面。在此示例中,所有页面(error 页面除外)都显示为在站点图中显示 “在站点图中显示”图标的图片

定义 Web 站点结构中的导航

将顶部页面(通常是站点中创建的第一个页面)通常设置为导航根 “导航根”图标的图片,尽管可以更改导航根页面。导航根很重要,因为它确定生成 Web 站点部件导航(例如,导航栏和站点图)时使用的链接级别。在此示例中,index 页面是导航根。

Web 页面属性

在 Web Site Designer 中,还可以看到哪些页面具有与它们相关联的实际文件,如“代码”图标 HTML 代码图标。JSP 代码图标。中所指示的一样。在此示例中,index 页面具有相关联的 HTML 文件,而 feedback.jsp 页面具有相关联的 JSP 页面。具有与其相关联的文件的页面图标还具有实线黑色边框,而仅带有图标的页面则具有虚线边框以表示它们仅为占位符。

还可以从页面图标分辨出是否应用了页面模板。缺省情况下,如果有与页面相关联的页面模板,则图标的背景为蓝色。您会看到页面模板已应用于 index 页面,因为页面图标背景是蓝色的。

一旦定义了带有顶部页面的新 Web 站点,则可以通过在 Web Site Designer 中创建页面图标来填充站点以制订您的站点。可以使用 Web Site Designer 来规划和布局整个站点组织,然后创建每个 Web 页面文件来填充站点。

Web Site Designer 包括编辑器和 Web 站点导航抽屉:
  • Web Site Designer 编辑器。在编辑 .website-config 文件或编辑 Web 站点导航文件时,则 Web Site Designer 编辑器可视。可在 Web Site Designer 编辑器中查看整个站点。可以使用此工具添加、删除和重新安排组成 Web 站点的 Web 页面。编辑器中有两个视图:“导航”视图和“详细”视图。“导航”视图显示 Web 站点的结构,“详细”视图显示在站点结构中使用的所有 Web 页面的列表。
  • Web 站点导航抽屉。在编辑 HTML 或 JSP 页面时,则 Web 站点导航抽屉可视。在 Web Site Designer 编辑器打开时,则站点抽屉打开。在“选用板”视图上有包含 Web 站点元素(例如,不同导航栏和站点图)的 Web 站点导航抽屉。可以将这些项拖动到 Page Designer 中的 Web 页面上。
  • 站点抽屉。在“选用板”视图上有包含页面和项目元素的“站点”抽屉。

可以将这些 Web Site Designer 工具与其它 Web 工具(例如,自由布局方式和页面模板)一起使用。可以改变现有页面模板或创建您自己的页面模板,然后将该页面模板应用于 Web 站点中的所有 Web 页面来确保设计一致。当编辑页面模板时,可以使用自由布局方式来更改每个 Web 页面的布局。 例如,要更改每个 Web 页面中导航栏的大小,可以不必对每个页面都进行更改,而是通过改变页面模板来改变导航栏的大小。这些更改将应用于整个 Web 站点。

填充 Web Site Designer

在 Web Site Designer 中使用 Web 站点导航
注:
  • 不能将 Web 站点导航与某些文档类型配合使用。如果在添加 Web 站点导航之后,接收到不能使用此 Web 站点导航这一错误消息,则如果在目标页面中使用选择的 Web 站点导航规范文件时,将生成无效源代码。例如,如果页面的文档类型为 CHTML 或 WML,则几乎所有 Web 站点导航包含的标记在这些标记语言中都是无效的。
  • 因为相关联的规范文件的存在,导航栏可能包含无效的源代码。编辑规范文件以更正错误。请参阅在联机帮助中的“编辑导航规范”主题。
  • 页面中的导航栏可能包含中断的字符。如果导航标签包含的字符不能按页面中的指定编码规则进行编码,就会发生这种情况。为避免这种情况,将导航标签中使用的字符类型限制为在该页面中使用的编码,或在该页面中使用更容易表示的编码规则。
  • 在“插入站点图”窗口上列示的所有样本规范文件可以处理站点结构中第 1 层与第 5 层之间的页面。即使在 siteedit:sitemap 标记的属性视图中将最终层设置为高于 5 层,指向高于第 5 层的页面的链接也不会包括在站点图中。
相关概念
Web 项目
Cascading Style Sheet (CSS) Designer
相关任务
设计 Web 站点
创建页面模板
反馈
(C) Copyright IBM Corporation 2000, 2005. All Rights Reserved.