第 十 一 章 站 点 设 计

要 设 计 一 个 好 的 Web 应 用 必 须 认 真 研 究 仔 细 规 划 还 要 检 查 你 的 Web 应 用 的 构 想 当 创 建 你 的 站 点 时 你 需 要 考 虑 你 的 信 息 如 何 组 织 你 的 用 户 如何 通 过 你 的 Web 应 用 进 行 导 航

Site Desig ner 站 点 设 计 器 使 得 下 述 工 作 变 得 容 易 为 一 个 新 Web 应 用建 立 一 个 直 观 原 型 或 者 使 用 站 点 图 重 新 设 计 一 个 已 经 存 在 的 站 点 你 可 以 很容 易 地 把 新 页 面 添 加 到 你 Web 应 用 上 也 很 容 易 在 站 点 图 中 的 页 面 之 间 创 建 导航 链 接

当 你 保 存 这 个 站 点 图 时 Site Desig ner 把 你 创 建 的 页 面 加 到 你 的 项 目 上并 且 更 新 你 的 文 件 之 间 的 导 航 链 接 站 点 图 可 以 使 设 计 一 个 Web 应 用 就 像 拖 动文 件 那 么 容 易

即 便 一 个 设 计 很 好 的 站 点 也 需 要 维 护 以 便 更 新 内 容 和 使 用 方 便 Site Designer 在 这 方 面 给 你 帮 助 它 提 供 一 种 图 形 方 式 供 设 计 和 维 护 Web 应 用 的导 航 结 构

你 可 以 很 容 易 地 安 排 和 重 构 页 面 之 间 的 导 航 链 接 定 义 用 户 如 何 通 过 你 的

Web 应 用 进 行 导 航 在 几 分 钟 之 内 你 就 可 以 创 建 一 个 新 页 面 并 用 把 页 面 的图 形 表 示 符 拖 到 站 点 图 上 某 个 位 置 的 办 法 定 义 这 些 页 面 之 间 的 层 次 关 系 保 存站 点 图 的 这 些 变 更 就 更 新 了 你 站 点 中 的 导 航

关 于 站 点 图 基 本 功 能 的 更 多 内 容 参 见 下 述 各 节

• 站 点 图

• 建 立 Web 站 点 原 型

• 设 计 站 点 导 航

• 组 织 站 点 图

站 点 图

站 点 图 是 在 Web 应 用 中 页 面 的 图 形 表 示 提 供 页 面 之 间 导 航 结 构 的 信 息 站 点 图 为 你 提 供 一 种 同 Web 应 用 站 点 结 构 文 件 相 互 作 用 的 模 式 而 这 些 结 构 文件 中 保 存 着 有 关 Web 应 用 的 页 面 之 间 导 航 结 构 的 信 息

在 站 点 图 中 你 可 以 创 建 带 有 层 次 关 系 的 页 面 组 这 些 页 面 组 称 作 树 这些 层 次 关 系 用 于 定 义 站 点 中 导 航 条 链 接 你 可 以 很 容 易 地 在 图 中 移 动 页 面 从而 改 变 层 次 关 系 每 个 Web 应 用 都 可 以 有 多 个 站 点 图 而 每 个 站 点 图 都 可 以 有多 个 树

方 框 节 点 表 示 站 点 图 中 的 页 面 页 面 可 以 有 几 种 装 饰 图 标 表 示 页 面 的 类型 外 部 页 面 全 局 导 航 条 页 面 改 进 的 页 面 或 主 页

要 建 立 页 面 之 间 的 关 系 你 可 以 把 一 些 页 面 拖 到 另 一 些 页 面 的 旁 边 或 底 下在 你 把 一 个 页 面 拖 到 另 一 个 页 面 的 底 下 或 旁 边 时 出 现 的 链 接 线 表 示 页 面 之 间 创建 的 关 系 类 型

建 立 We b 站 点 原 型

站 点 图 提 供 一 种 方 式 供 你 快 速 设 计 并 移 入 一 个 Web 应 用 你 可 以 在 一 个站 点 图 中 直 接 为 你 的 项 目 创 建 新 页 面 在 你 保 存 站 点 图 时 站 点 结 构 文 件 被 更新 所 有 新 页 面 被 创 建 并 添 加 到 项 目 中 这 些 页 面 是 按 照 你 在 该 站 点 图 中 键 入的 标 签 名 字 命 名 的

如 果 你 采 用 了 主 样 板 并 为 Web 应 用 定 义 了 布 局 新 页 面 就 使 用 这 些 默 认 内

容 创 建 出 来 站 点 的 导 航 结 构 还 自 动 进 行 综 合 并 按 每 个 页 面 进 行 更 新

注 意 : 每 个 项 目 都 有 一 个 站 点 结 构 文 件 这 个 项 目 的 所 有 站 点 图 都 与 这 个 文件 发 生 关 系 如 果 两 个 站 点 图 共 享 这 些 页 面 你 对 一 个 站 点 图 所 做 的变 更 可 以 影 响 另 一 个 站 点 图

要 了 解 更 多 内 容 参 见 第 十 二 章 设 计 Web 站 点

设 计 站 点 导 航

站 点 图 为 你 提 供 一 种 直 观 模 式 你 可 以 使 用 这 种 模 式 为 一 个 新 Web 应 用 设计 和 修 改 导 航 结 构 或 维 护 一 个 已 经 存 在 应 用 的 导 航 当 你 在 站 点 图 中 保 存 新页 面 时 便 依 据 默 认 关 系 和 在 站 点 图 中 定 义 的 关 系 把 导 航 链 接 加 到 这 些 页 面上

你 可 以 对 Web 应 用 的 各 个 部 分 创 建 几 个 站 点 图 也 可 以 对 整 个 应 用 创 建 一个 站 点 图 在 站 点 图 中 你 设 计 的 层 次 关 系 定 义 了 你 的 站 点 导 航 结 构 此 外你 可 以 规 定 哪 个 页 面 出 现 在 应 用 的 全 局 导 航 条 上 你 也 可 以 把 一 个 主 页 加 到 这个 站 点 图 上

要 了 解 更 多 内 容 参 见 第 十 三 章 设 计 站 点 导 航

组 织 站 点 图

Site Desig ner 允 许 你 操 纵 站 点 图 的 布 局 和 组 织 使 得 同 你 站 点 的 导 航 结 构打 交 道 变 得 容 易

你 可 以 放 大 站 点 图 也 可 以 自 动 改 变 站 点 图 的 大 小 使 其 适 应 于 当 前 窗 口内 尺 寸 你 还 可 以 在 树 中 展 开 或 叠 合 子 页 面 使 用 Rotate 旋 转 命 令 在 横

向 树 布 局 或 纵 向 树 布 局 之 间 进 行 转 换 你 还 可 以 简 单 地 把 树 拖 到 其 它 位 置 来重 新 定 位 任 何 树 在 站 点 图 中 的 位 置

更 多 内 容 参 见 第 十 四 章 管 理 站 点 图

11 . 1 链 接 检 验

Web 应 用 到 HTML 页 面 图 形 和 其 它 文 件 有 多 条 链 接 Web 应 用 越 大 检 验越 复 杂 维 护 这 些 链 接 的 工 作 量 也 就 越 多

你 可 以 使 用 Link View 链 接 视 图 创 建 链 接 图 表 示 Web 应 用 之 间 的 链 接并 发 现 各 文 件 之 间 断 开 的 链 接 链 接 图 是 提 供 文 件 之 间 链 接 的 一 种 观 察 图 在这 种 观 察 图 帮 助 下 你 可 以 很 容 易 地 维 护 Web 应 用 中 的 这 些 链 接

在 Link View 中 一 个 项 是 一 项 资 源 例 如 一 个 . htm 一 个 设 计 期 间 控 件或 者 一 个 图 像 文 件 它 们 都 是 Web 应 用 的 组 成 部 分 在 Web 应 用 中 的 项 都 是 用图 标 表 示 的 而 项 之 间 的 关 系 都 是 用 链 接 图 中 的 箭 头 表 示 的

链 接 图 中 的 项 用 表 示 项 中 间 链 接 的 线 连 接 起 来 箭 头 表 示 链 接 的 传 输 方 向可 能 是 传 出 也 可 能 是 传 入 你 可 以 通 过 分 析 链 接 图 中 这 些 关 系 的 图 形 表 示 来了 解 项 之 间 的 链 接 关 系

有 了 Link View 你 就 可 以 查 看 一 个 页 面 的 链 接 或 者 你 Web 应 用 中 的 项 或者 查 看 World Wide Web 中 任 何 页 面 中 的 项 你 还 可 以 把 链 接 图 作 为 预 览 Web 浏览 器 中 项 的 起 始 点 或 者 作 为 在 其 它 默 认 编 辑 器 中 对 项 进 行 编 辑 的 起 始 点 关于 预 览 和 编 辑 项 的 更 多 内 容 参 见 第 十 六 章 维 护 链 接 中 查 看 链 接 图

要 学 习 有 关 Link View 更 多 内 容 和 链 接 图 的 功 能 阅 读 下 列 各 节

• 链 接 图 布 局

• 检 验 项

• 标 识 断 开 的 链 接

• 查 看 某 项 的 链 接

• 用 过 滤 器 显 现 和 隐 蔽 项

• 展 开

  和 叠 合 到 其 它 项 的 链 接

链 接 图 布 局

Link Vie w 链 接 视 图 使 用 两 种 链 接 图 布 局 横 向 布 局 和 放 射 状 布 局 每种 布 局 都 有 一 个 显 著 不 同 的 焦 点 这 两 种 布 局 都 能 帮 助 你 追 踪 你 Web 应 用 中 项之 间 的 链 接 关 于 图 布 局 的 细 节 参 见 第 十 六 章 维 护 链 接 中 的 改 变 链 接图 布 局 一 节

横 向 布 局

作 为 默 认 模 式 当 你 打 开 一 个 项 的 链 接 图 出 现 横 向 布 局 这 种 布 局 显 示 项的 输 入 链 接 与 输 出 链 接

在 横 向 布 局 中 输 入 链 接 扩 展 项 的 左 边 输 出 链 接 出 现 在 扩 展 项 的 右 边

放 射 状 布 局

放 射 状 布 局 显 示 一 个 项 的 输 入 链 接 或 输 出 链 接 但 不 是 两 种 链 接 都 同 时 显示 出 来 在 放 射 状 布 局 中 链 接 图 显 示 链 接 到 扩 展 项 上 并 按 放 射 状 安 排 所 有项

检 验 项

当 你 创 建 或 刷 新 一 个 项 的 链 接 图 时 Link View 检 索 有 关 链 接 的 信 息 这 些信 息 或 者 从 存 储 在 主 Web 服 务 器 中 的 信 息 提 取 在 链 接 索 引 文 件 中 和 站 点 结 构文 件 中 或 者 通 过 在 World Wide Web 上 对 链 接 进 行 搜 索 得 到 项 是 不 是 Web 应 用 的 组 成 部 分 决 定 着 Link View 如 何 检 索 链 接 信 息

• 对 于 We b 应 用 中 的 项 Link Vie w 使 用 存 储 在 主 Web 服 务 器 中 的 信 息迅 速 确 定 一 个 项 是 有 效 的 还 是 断 开 的

如 果 Web 服 务 器 上 的 信 息 在 你 创 建 链 接 图 之 后 有 所 改 变 你 必 须 使 用

Refresh 刷 新 命 令 检 索 Web 应 用 的 最 新 链 接 信 息

• **对

  于 We b 应 用 之 外 的 项** Link Vie w 通 过 搜 索 World Wide Web 上 链 接 目的 地 的 办 法 动 态 检 索 链 接 信 息 显 示 出 来 的 链 接 图 中 的 外 部 项 可能 是 有 效 的 断 开 的 未 知 的 或 正 在 进 行 中 (pending) 的 外 部 项 链 接图 的 建 立 要 比 内 部 项 链 接 图 建 立 的 慢 这 是 由 修 改 Internet 访 问 速 度引 起 的

注 意 : 开 始 链 接 图 中 的 索 引 外 部 项 的 显 示 为 未 知 的 使 用 Verify 检 验 或 Expand 扩 展 命 令 使 Link View 决 定 链 接 是 有 效 的 还 是 断 开 的

Link View 使 用 下 列 图 标 表 示 链 接 的 状 态

链 接 状 态 图 标 含 义

断 开 的

未 知 的 链 接 点 不可 存能 在存的在项也 可 能 不 存 在 的 项 使 用 Verify

命 令 确 定 链 接 是 有 效 的 还 是 断 开 的

进 行 中

注 意 : 当 一 个 项 的 链 接 断

L开i n时k V你i e可w

以正把在一为个链指接示点符在放W到o r该l d项W显i d示e

其We bT o 上o l 的Tip

的 图 标 上 ToolTi p项包进含行找搜不索到 该 项 原 因 的 信 息 例 如 如 果 Link View 企 图 检 验 到 达 已 经 不 存 在 的 一 个 HTML 页 面 的 链 接 对 应 于 该 断 开 链 接的 ToolTip 包 含 一 个 http 出 错 信 息

标 识 断 开 的 链 接

出 现 已 断 链 接 可 能 有 多 种 原 因 例 如 目 标 文 件 可 能 已 经 删 除 或 者 链 接包 含 一 条 键 入 错 误

在 Link Vie w 中 在 链 接 图 中 已 断 链 接 是 用 断 开 的 链 接 图 标 表 示 的 对 应于 包 含 已 断 链 接 的 项 ToolTip 显 示 链 接 断 开 的 原 因

除 了 使 用 链 接 图 之 外 你 还 可 以 使 用 创 建 一 个 Broken Lin ks Report 已 断开 链 接 报 告 的 办 法 迅 速 在 你 的 Web 应 用 中 创 建 一 个 所 有 已 断 开 链 接 列 表

已 断 开 链 接 报 告 包 含 一 个 Web 应 用 中 所 有 断 开 链 接 的 列 表 以 及 在 链 接 中 没 有 的文 件 列 表 一 旦 你 把 已 断 开 链 接 在 你 的 Web 应 用 中 识 别 出 来 就 可 以 维 修 这 些链 接

关 于 识 别 与 确 定 已 断 开 链 接 的 有 关 内 容 详 见 第 十 六 章 维 护 链 接 中 的维 修 链 接 一 节

查 看 某 项 的 链 接

当 你 打 开 链 接 图 的 一 个 项 时 该 项 用 位 于 链 接 图 中 间 的 一 个 大 图 标 表 示 出来 显 示 该 项 的 链 接 取 决 于 链 接 图 的 布 局 和 所 采 用 的 过 滤 器

你 可 以 为 下 列 项 创 建 链 接 图

• Web 项 目 中 的 一 个 项 有 关 内 容 详 见 第 十 五 章 按 项 查 看 链 接 中 的查 看 项 目 中 一 个 项 的 链 接 一 节

• 已 打 开 链 接 图 中 的 项 有 关 内 容 详 见 第 十 五 章 按 项 查 看 链 接 中 的查 看 项 目 中 项 的 链 接 一 节

• 任

  何 有 效 的 URL 有 关 内 容 详 见 第 十 五 章 按 项 查 看 链 接 中 的 查看 WWW 上 项 的 链 接 一 节

用 过 滤 器 显 现 和 隐 蔽 项

你 可 以 过 滤 一 个 链 接 图 只 显 示 你 希 望 看 的 项 类 型 如 果 你 要 查 看 某 个 大型 Web 应 用 或 者 你 希 望 查 看 某 种 类 型 的 资 源 过 滤 是 非 常 有 用 的 例 如 你可 能 希 望 使 用 过 滤 器 排 除 多 媒 体 文 件 例 如 声 音 和 视 像 文 件 这 些 文 件 用 于 Web 应 用 中 或 者 只 显 示 某 页 面 中 的 图 形 文 件 关 于 显 示 链 接 的 有 关 内 容 详 见 第

十 六 章 维 护 链 接 中 的 过 滤 链 接 一 节

对 只 显 示 输 出 链 接 或 只 显 示 输 入 链 接 的 链 接 图 进 行 过 滤 是 有 用 的 例 如把 链 接 显 示 出 来 可 以 使 你 确 定 重 命 名 或 删 除 一 个 项 是 否 发 生 冲 突 因 为 你 可 以看 到 链 接 到 该 项 的 其 它 页 面 有 关 内 容 详 见 第 十 六 章 维 护 链 接 中 的 改变 链 接 图 布 局 一 节

展 开 和 叠 合 到 其 它 项 的 链 接

如 果 你 希 望 看 到 当 前 链 接 图 中 的 更 多 细 节 你 可 以 展 开 指 定 项 的 链 接 显示 这 个 项 的 输 入 或 输 出 链 接 出 现 的 链 接 取 决 于 过 滤 器 对 链 接 图 的 当 前 设 置 例 如 如 果 你 把 过 滤 器 设 置 为 只 显 示 链 接 图 中 的 HTML 页 面 扩 展 一 个 页 面 上 的链 接 便 只 显 示 到 其 它 HTML 页 面 上 的 链 接 你 还 可 以 在 链 接 图 中 把 一 个 项 的 链 接叠 合 起 来 叠 合 一 条 链 接 就 是 隐 蔽 那 个 项 的 链 接 从 而 减 小 站 点 大 型 链 接 图 的尺 寸 关 于 如 何 显 示 链 接 项 的 有 关 内 容 详 见 第 十 六 章 维 护 链 接 中 的 查看 链 接 图 一 节

11 .2 站 点 一 致 性

业 余 站 点 和 专 业 站 点 之 间 的 关 键 差 别 之 一 是 一 致 性 专 业 站 点 使 用 精 心 设计 的 页 面 在 整 个 站 点 的 外 观 和 功 能 上 保 持 一 致

若 你 的 站 点 具 有 一 致 性 那 么 你 的 站 点 就 拥 有 如 下 特 点

外 观 专 业 化 专 业 化 站 点 是 设 计 良 好 的 同 其 设 计 的 使 用 感 觉 是 一 致 的 用户 使 用 站 点 感 到 舒 服 容 易 导 航 也 容 易 阅 读

节 省 开 发 时 间 当 你 在 开 发 周 期 中 按 照 具 有 一 致 性 的 步 骤 进 行 时 任 务 数 目会 减 少 也 会 变 得 简 单

节 省 创 作 时 间 使 用 样 板 布 局 和 主 样 板 可 以 节 省 创 作 新 文 件 的 时 间 使得 创 作 者 集 中 精 力 编 写 实 际 内 容

给 你 一 个 视 觉 和 感 觉 布 局 清 晰 又 专 业 化 的 Web 站 点 你 便 可 以 发 挥 Visual InterDev 许 多 工 具 的 特 长 工 作 组 越 大 这 些 工 具 就 显 得 越 有 效

站 点 一 致 性 处 理

当 你 根 据 一 致 性 设 计 你 的 站 点 的 时 候 一 定 要 完 成 下 列 全 部 任 务 或 其 中 的某 些 任 务

1 . 创 建 样 式 图 表 定 义 你 的 页 面 如 何 出 现

1. 设 计 一 种 公 共 布 局 满 足 你 对 导 航 和 页 面 出 现 的 要 求

2. 创 建 客 户 样 板 以 便 创 作 者 创 作 的 新 页 面 同 已 经 有 的 页 面 类 似

3. 使 用 一 个 主 样 板 通 过 你 的 站 点 分 享 公 共 图 形

各 项 任 务 要 互 相 配 合 提 供 一 致 的 外 观 要 使 你 的 用 户 确 信 你 做 的 是 一 项专 业 性 的 工 作

Vi su al I nte rD ev 中 的 站 点 一 致 性

对 于 每 个 站 点 一 致 性 任 务 Visual Int erDev 为 你 提 供

• 预 包 装 解 决 方 案

• 帮 助 你 从 头 开 始 创 建 自 己 站 点 的 工 具

根 据 站 点 的 大 小 和 工 作 组 的 规 模 你 应 当 使 用 很 好 的 解 决 方 案 或 者 尽 可

能 定 制 站 点 Visual Int erDev 解 决 方 案 在 一 致 性 方 面 包 括

• 级 联 样 式 图 表

• 样 板

• 布 局

• 主 样 板

级 联 样 式 图 表

级 联 样 式 图 表 (CSS,Cascading Style Sheet) 使 你 能 够 定 义 一 种 图 表 取 代使 用 HTML 的 浏 览 器 标 准 方 法 使 你 为 页 面 提 供 卓 越 的 一 致 的 设 计 样 式 图 表 允许 你 定 义 任 何 标 记 的 属 性 例 如 你 可 以 调 整 字 体 行 空 间 对 齐 和 镶 边 特 性

要 在 一 个 页 面 上 加 样 式 图 表 就 应 在 其 HTML 文 档 中 的 <HEAD> 和 </HEAD> 之间 的 开 头 处 加 上 <LINK> 标 记 引 用 一 个 CSS 文 件 的 <LINK> 标 记 看 上 去 是 如 下 这个 样 子

<LINK REF= ” stylesheet ” TYPE= ” text/css ” HREF= ” YourStyle s

/COLOR0.CS S ” >

你 希 望 有 多 少 页 面 引 用 这 同 一 个 样 式 图 表 都 可 以 因 为 所 有 样 式 信 息 都 存储 在 一 个 文 件 中 很 容 易 维 护 也 节 省 Web 服 务 器 空 间

Visual Int erDev 包 括 一 个 CSS 编 辑 器 这 个 编 辑 器 有 一 个 容 易 使 用 的 用 于设 置 样 式 特 性 的 界 面 你 可 以 使 用 这 个 编 辑 器 的 图 形 界 面 就 不 必 编 辑 原 始 CSS 文 本 对 于 使 用 CSS 编 辑 器 的 内 容 参 见 第 十 七 章 页 面 样 式 定 制 中 的 编 辑样 式 图 表 一 节

不 是 所 有 浏 览 器 都 支 持 使 用 级 联 样 式 图 表 然 而 在 正 确 使 用 级 联 样 式 的时 候 不 支 持 这 些 图 表 的 浏 览 器 便 可 以 忽 略 这 些 图 表 使 得 页 面 变 为 可 读 的在 设 计 样 式 的 时 候 这 一 点 一 定 要 记 在 心 中 保 证 你 的 页 面 样 子 在 其 它 平 台 上

适 度 降 低 CSS 1 得 到 Internet E xplorer 4.0 和 Netscape N avigator 4.0 的支 持 而 Netscape N avigator 3.0 支 持 CSS 1 的 一 个 子 集

样 式 图 表 的 使 用 是 无 限 制 的 从 简 单 到 非 常 复 杂 描 述 CSS 的 更 详 细 内容 参 见 CSS Attributes 参 考 文 献 或 参 见 位 于http://www .w3.org/pub/www/ TR/REC-CSS 1 上 的 World Wi de Web Consortium 的 Internet CSS 规 范

Visual Int erDev 中 的 样 式 图 表

Visual Int erDev 带 有 各 式 各 样 的 样 式 图 表

• 在

  你 创 建 一 个 新 样 式 图 表 的 时 候 在 Add Item 对 话 框 中 使 用 标 准 样 板使 用 这 个 样 式 可 以 创 建 和 修 改 样 式

• Visual

  Int erDev 大 约 有 60 个 主 样 板 (theme) 每 个 主 样 板 都 包 含 一 个或 多 个 样 式 图 表

你 可 以 使 用 这 些 样 式 图 表 中 任 何 一 种 作 为 模 式 创 建 你 自 己 的 样 式 图 表或 者 你 简 单 复 制 它 然 后 按 需 要 进 行 裁 剪 以 便 满 足 你 的 需 要

预 览 样 式 图 表

当 你 在 CSS 编 辑 器 中 编 辑 一 个 样 式 图 表 时 你 可 以 使 用 Preview 选 项 卡 看一 看 图 表 出 现 在 哪 个 页 面 上 本 地 页 面 或 World Wide 页 面 上 是 什 么 样 的

注 意 : 如 果 你 正 在 预 览 的 页 面 有 一 个 连 接 的 样 式 图 表 Visual I nterDev 把这 个 样 式 图 表 重 新 组 织 成 基 本 样 式 图 表 并 且 加 到 你 正 在 第 二 个 位 置编 辑 的 页 面 上

样 板

样 板 是 一 种 极 宝 贵 的 资 源 尽 管 样 板 仅 仅 是 一 种 用 于 制 作 新 副 本 的 主 文 件但 是 你 可 以 把 样 板 用 于 HTML 文 档 ASP 页 面 CSS 文 件 或 任 何 其 它 基 于 文 本 的文 件 因 为 创 建 一 个 设 计 良 好 的 页 面 需 要 时 间 你 在 样 板 中 投 入 的 时 间 要 少 许多 倍

作 为 默 认 值 所 有 样 板 都 出 现 在 Add Item 对 话 框 中 要 把 一 个 样 板 加 到 现成 的 列 表 中 就 把 它 加 到 下 述 目 录 中

C: \ Program Files \ Microsoft Vis ual Studio \ VintDev98 \
Templates

\ Web Pro ject Items

注 意 : 把 样 板 加 到 Web Project Items 目 录 上 以 后 你 必 须 重 新 启 动 Visual InterDev 以 便 在 Add Item 对 话 框 中 显 示 样 板

查 看 一 下 目 录 确 认 Visual Int erDev 中 是 否 有 这 些 样 板

相 互 作 用 的 样 板

你 可 以 在 你 的 样 板 中 使 用 参 数 以 提 示 样 板 用 户 确 定 其 它 信 息 如 主 样 板 名字 或 公 司 名 字 这 使 你 的 样 板 更 加 灵 活 要 了 解 更 多 内 容 参 见 第 十 七 章 页面 样 式 定 制 中 的 创 建 客 户 样 板

布 局

布 局 规 定 页 面 的 内 容 是 如 何 直 观 放 置 的 规 定 用 户 如 何 使 用 PageNavbar 设计 期 间 控 件 在 父 页 面 子 页 面 和 平 级 页 面 之 间 进 行 导 航

如 何 进 行 布 局

布 局 控 制 页 面 的 各 个 部 分 如 何 安 排 布 局 在 页 面 上 分 为 几 个 不 同 的 区 域例 如 最 常 见 的 布 局 利 用 下 述 五 个 可 能 区 域 中 的 两 个 区 域 或 三 个 区 域

Visual Int erDev 使 用 HTML 表 创 建 各 个 区 域 其 结 果 看 上 去 有 些 像 下 边 的图 片 在 下 图 中 顶 部 左 部 底 部 和 内 容 部 分 各 区 域 都 用 到 了

HTML 表 格 信 息 存 储 在 Web 页 面 的 Layout Header 布 局 眉 批 部 分 和 Layout

Footer 布 局 注 脚 部 分 中 眉 批 和 注 脚 布 局 设 计 期 间 控 件 把 你 页 面 的 内 容 划分 出 来

每 个 布 局 都 是 以 独 特 的 HTML 样 板 为 基 础 的 样 板 存 放 着 布 局 信 息 当 把 布局 施 加 到 一 个 页 面 时 Visual I nterDev 就 把 布 局 设 计 期 间 控 件 加 到 这 个 页 面上

重 要 事 项 : 不 用 手 工 改 变 布 局 设 计 期 间 控 件 的 运 行 期 间 文 本 如 果 这 个 文 本变 动 了 Visual InterDev 可 能 不 能 正 确 完 成 对 信 息 的 语 法 分 析 还 有当 你 使 用 不 同 布 局 时 Visual Int erDev 便 删 除 当 前 的 布 局 设 计 期 间 控件 并 用 新 控 件 取 代

因 为 布 局 信 息 是 在 样 板 中 维 护 的 因 而 很 容 易 改 变 加 到 页 面 上 的 布 局 而不 影 响 内 容 对 施 加 布 局 或 对 布 局 的 一 步 步 介 绍 参 见 第 十 七 章 页 面 样 式 定制 中 的 安 排 页 面 一 节

在 你 的 工 作 站 上 安 装 布 局

安 装 在 你 计 算 机 上 的 布 局 列 表 决 定 着 你 什 么 时 候 在 计 算 机 上 安 装 Visual InterDev 在 这 个 期 间 选 择 典 型 或 定 制 选 项

典 型 安 装 选 项 典 型 安 装 选 项 把 所 有 1 8 种 布 局 都 复 制 到 你 的 计 算 机 上定 制 安 装 选 项 定 制 安 装 选 项 使 你 选 择 下 述 二 者 之 一

• 0 个 布 局

  不 安 装 布 局

• 典 型

  1 8 个 布 局

布 局 目 录 位 置

布 局 常 驻 在 Layout 目 录 中 这 个 目 录 可 以 在 下 述 目 录 中 找 到

C: \ Pr ogram Files \ Microsof t Visual Studio \ Vint Dev98 \
Layouts

当 你 使 用 一 个 布 局 而 其 它 开 发 者 也 可 以 分 享 这 个 布 局 的 时 候 组 成 该 布局 的 文 件 将 自 动 加 到 主 服 务 器 中 这 些 其 它 开 发 者 也 在 同 一 个 项 目 上 工 作 也需 要 访 问 这 些 文 件 布 局 存 储 在 主 服 务 器 中 在 项 目 顶 级 目 录 下 的 叫 做 Layout 的 目 录 中 这 些 文 件 在 设 计 时 需 要 但 在 运 行 时 不 需 要

主 样 板

主 样 板 theme 由 一 组 图 形 和 控 件 样 式 字 体 和 图 形 的 一 个 或 多 个 级 联 样式 图 表 组 成 你 把 主 样 板 施 加 于 页 面 在 你 的 各 个 页 面 之 间 便 有 了 可 视 的 共 有的 一 致 性

你 可 以 对 整 个 项 目 设 置 一 个 默 认 主 样 板 在 这 个 项 目 中 建 立 的 每 个 页 面 都用 这 同 一 个 主 样 板 即 便 对 一 个 项 目 设 置 为 默 认 主 样 板 你 还 是 可 以 进 行 选 择采 用 一 个 不 同 主 样 板 的 文 件 或 根 本 没 有 主 样 板 的 文 件 来 取 代 默 认 主 样 板

在 你 对 项 目 设 置 一 个 默 认 主 样 板 的 时 候 便 自 动 得 到 该 主 样 板 预 包 装 设 计的 好 处 主 样 板 的 另 一 个 好 处 是 很 容 易 在 不 同 主 样 板 之 间 进 行 转 换 而 不 改 变内 容 给 站 点 一 种 完 全 不 同 的 视 觉

你 可 以 使 用 Visual I nterDev 带 来 的 许 多 主 样 板 中 的 一 个 修 改 已 经 有 的多 种 主 样 板 中 的 一 个 主 样 板 或 者 创 建 一 个 你 自 己 定 制 的 主 样 板 关 于 采 用 或创 建 主 样 板 的 一 步 步 过 程 信 息 参 见 第 十 七 章 页 面 样 式 定 制 中 采 用 主 样板 一 节

在 页 面 中 如 何 引 用 主 样 板

当 你 为 一 个 页 面 采 用 一 个 主 样 板 的 时 候 Visual Int erDev 把 <LINK> 标 记 插

到 <HEAD> 块 中 例 如 在 采 用 艺 术 Artsy 主 样 板 时 便 插 入 下 列 文 本

在 上 边 例 子 中 插 入 四 个 <LINK> 标 记 这 是 因 为 艺 术 主 样 板 使 用 四 个级 联 样 式 图 表

在 本 地 计 算 机 中 安 装 主 样 板

安 装 到 你 计 算 机 中 的 主 样 板 列 表 是 在 你 安 装 Visual I nterDev 的 过 程 中选 择 是 典 型 选 项 还 是 定 制 选 项 的 时 候 确 定 的

典 型 安 装 选 项 典 型 安 装 选 项 把 1 7 个 主 样 板 安 装 到 你 的 计 算 机 中 这 1 7 个主 样 板 中 包 括

• 为

  Visual Int erDev 6.0 创 建 的 新 主 样 板

• 同

  Visual Int erDev 1 .0 一 起 发 运 的 主 样 板 更 新 版 本

• Microsoft

  FrontPage 98 主 样 板 更 新 版 本

定 制 安 装 选 项 定 制 安 装 选 项 可 以 使 你 选 择 下 列 三 者 内 容 之 一

• 0 个 主 样 板 不 安 装 主 样 板

• 典 型 1 7 个 主 样 板

• 全 部 所 有 主 样 板

主 样 板 在 工 作 站 上 的 位 置

组 成 一 个 主 样 板 的 每 组 文 件 都 保 持 在 一 个 目 录 中 这 个 目 录 的 名 字 用 该 主样 板 名 字 表 示

主 样 板 目 录 存 储 的 本 地 Themes 目 录 中 这 个 目 录 可 以 在 下 述 目 录 中 找

到

C: \ Pro gram Files \ Common Fi les \ Microsoft Shared \ Themes

注 意 : 在 Visual InterDev 1.0 中 主 样 板 文 件 分 散 到 不 同 目 录 中 在 Visual InterDev 6 .0 中 组 成 一 个 主 样 板 的 所 有 文 件 都 常 驻 在 同 一 个 目 录 中

服 务 器 上 的 主 样 板 位 置

服 务 器 上 的 主 样 板 存 储 在 项 目 顶 级 目 录 中 名 为 Themes 的 目 录 下 当 你采 用 主 样 板 时 组 成 主 样 板 的 文 件 自 动 加 到 主 服 务 器 上

在 你 开 发 Web 应 用 期 间 在 你 把 文 件 复 制 到 产 品 服 务 器 上 的 时 候 包 括

Themes 目 录 及 其 子 目 录 都 复 制 过 去

在 Visual Int erDev 和 FrontPage 之 间 共 享 主 样 板

你 可 以 从 Visual Int erDev 项 目 上 或 从 FrontPage 项 目 上 访 问 服 务 器 上 的主 应 用 这 就 允 许 工 作 组 成 员 使 用 他 们 偏 爱 的 选 择 工 具 例 如 工 作 组 中 可 以有 这 样 的 开 发 者 他 们 使 用 增 强 脚 本 编 程 能 力 的 Visual Int erDev 访 问 主 应 用还 可 以 有 这 样 的 设 计 者 和 创 作 者 他 们 偏 爱 使 用 FrontPage 的 设 计 特 性 来 访 问同 一 个 主 应 用

有 关 Visual InterDev 和 FrontPage 之 间 的 不 同 之 处 参 见 第 二 十 九 章 综

合 任 务 中 的 使 用 FrontPage 和 Visual Int erDev 创 建 Web 站 点 一 节

主 样 板 中 的 附 加 图 形

每 个 主 样 板 都 带 有 一 些 有 关 的 附 加 图 形 用 于 补 充 默 认 主 样 板 所 使 用 的 基 本图 形 你 可 以 使 用 这 些 附 加 图 形 增 强 页 面 设 计 浏 览 一 下 主 样 板 目 录 里 面 的 内容 看 一 看 所 有 的 .GIF 图 像 这 些 图 像 都 可 以 在 具 体 主 样 板 中 使 用

提 示 : 当 你 从 Project Explorer 向 一 个 页 面 拖 动 一 个 图 像 的 时 候 Visual InterDev 便 自 动 把 一 个 正 确 的 U R L 插 入 到 <IMG>标 记 中

当 你 使 用 Themes 目 录 中 的 图 像 的 时 候 要 确 信 在 <IMG> 标 记 中 有 一 个 正 确的 URL

注 意 : 如 果 你 对 一 个 页 面 采 用 一 个 新 主 样 板 便 需 要 对 手 工 添 加 的 所 有 图 像都 手 工 更 新 它 们 的 U R L

综 合 考 虑 与 操 作

如 果 你 对 上 边 讨 论 的 工 具 感 兴 趣 你 可 以 使 用 这 些 工 具 简 化 创 建 和 维 护 视觉 效 果 和 一 致 性 Web 站 点 的 过 程 你 可 以 做 到

• 使

  用 Web Project 向 导 wizard 创 建 一 新 项 目 这 个 向 导 为 你 提 示 一个 默 认 主 样 板 和 布 局

• 把

  一 个 主 样 板 和 一 个 布 局 施 加 到 一 个 已 经 存 在 的 Web 项 目 上 或 单 个 文 件上 要 选 择 一 个 项 目 或 Project Ex plorer 中 一 个 文 件 名 字 单 击 右 键 然 后 选 择 Apply Them e and Layout

当 采 用 一 个 主 样 板 或 一 个 布 局 时 主 样 板 和 布 局 便 自 动 复 制 主 服 务 器 中工 作 组 所 有 成 员 都 可 以 分 享 它 们

如 果 你 希 望 同 工 作 组 成 员 共 享 一 个 样 板 时 要 使 得 主 副 本 对 他 们 可 用 然后 工 作 组 的 每 个 成 员 都 进 行 复 制 把 副 本 放 到 工 作 站 的 样 板 目 录 中