设计 Web 站点

要设计 Web 站点,您需要确定站点中页面之间的相互关系并创建应用于整个站点的一致设计。

Web Site Designer 是一个用于设计和创建 Web 站点的工具。借助 Web Site Designer,您可以创建由具有统一主题(布局和样式)的多个 Web 页面组成的 Web 站点。布局定义页面组件的位置;例如,通过使用页面模板,可以指定 Web 站点中的导航栏始终位于每个页面的顶部。样式使用级联样式表(CSS)定义页面的外观。可从 Web Site Designer 为 Web 站点中的所有页面指定 CSS,也可以在页面模板中定义 CSS。一旦设计好 Web 站点,就可以使用许多 Web 工具(包括 Page Designer)来创建各个 Web 页面。

可将 Web Site Designer 用作文件关系的可视映射。Web Site Designer 将按层次结构显示站点结构,它的所有层次都是从顶部页面开始的。

可以通过确定 Web 项目中 Web 页面之间的关系来创建站点结构。要创建 Web 项目中文件之间的关系,按照将页面添加至 Web Site Designer 的顺序, 在顶部页面和它的子代页面之间创建链接。一旦确定了顶部页面的子代页面,则会为子代页面重复此过程。在上面的示例中,索引页面是顶部页面。产品页面和反馈页面是索引页面的子代。销售页面是产品页面的子代。

将所有链接的页面添加至站点结构后,该过程就完成了。Web Site Designer 按照建立子代页面和兄弟页面的顺序显示它们。对于在开发时对站点结构进行布局,以及制作站点时生成站点访问者使用的导航,Web Site Designer 都是非常理想的。

设计 Web 站点包括两个主要活动:
  1. 确定页面之间的相互关系
  2. 创建一致的 Web 站点设计

确定页面之间的相互关系

在使用实际的页面填充此设计之前,用于创建新的 Web 站点的 Rational® Developer 方法需要您了解 Web 站点和页面的关系。Web 站点就是许多 Web 页面组合起来的分层设计和组织。Web 站点具有一个高级目标并且每个 Web 页面都是为满足此高级目标而服务的。

为了创建 Web 页面之间的相互关系,或者设计 Web 站点,首先必须创建包含所有 Web 应用程序资源的 Web 项目。然后创建 Web 站点结构。

为了创建 Web 页面之间的相互关系,或者设计 Web 站点,请执行以下操作:
  1. 创建或导入 Web 项目。
  2. 创建 Web 站点结构

创建一致的 Web 站点设计

通过创建一致的 Web 站点设计,在 Web 站点的所有 Web 页面中设计一致的外观。控制 Web 站点的公共外观的最好方法是执行以下操作:
  1. 创建页面模板

    页面模板是可用来在 Page Designer 中创建新的 HTML、XHTML、JSP 或 Faces JSP 页面的模式。每个新页面都类似于页面模板并且通常该页面中有一部分是用来添加特定于该页面的信息。借助页面模板,可以使整个 Web 站点保持一致的外观。可对各个页面进行一致的格式化,或者在每一个页面上使用相同的图形。例如,Web 站点中的每个页面都会有公司徽标和相同的标题。如果对页面模板进行更改,在保存已更新的页面模板时,使用该页面模板的页面将自动更新。Web 站点可使用多个页面模板。可从页面模板链接至 CSS 文件(通过创建站点范围的样式表)。

  2. 定义 Web 站点样式

    级联样式表(CSS)是单个文件,此单个文件可用来确保整个 Web 站点具有一致的样式,因为 Web 页面和 CSS 是单独维护的。每次更新 CSS,更新都会自动应用到链接该 CSS 的站点的所有 Web 页面中。

要了解站点布局和结构的设计,请参阅以下教程:

教程:设计 Web 站点的布局和结构

使用候选窗口输入 DBCS 日语汉字
注:

仅限于 Linux。 不能使用 Site Designer 中的“候选窗口”输入 DBCS 日语汉字。在 Web Site Designer 中,如果使用候选窗口 canna 来编辑文本字段,输入 DBCS 日语汉字将会失败。为避免此问题,使用 Wnn 而不是 canna。参阅操作系统的安装手册以获取更多信息。

相关概念
Web 项目
Cascading Style Sheet (CSS) Designer

相关任务
Web 站点开发
定义 Web 站点策略
创建或导入 Web 页面和 Web 资源
测试 Web 站点
发布 Web 站点
维护 Web 站点
创建 Web 站点结构
创建页面模板

使用条款 | 反馈
(C) Copyright IBM Corporation 2000, 2005. All Rights Reserved.