Web 站点的导航地图对用户体验非常重要。这里我们将向你展示如何构建一个绝好的导航地图。

不管你知道多少创建 Web 解决方案后台的技术，除非你很擅长 Web 设计，否则你的所有努力都是白费。对于 Web 设计来说非常关键的一点是开发 Web 站点的导航地图。

导航地图是一个非常有价值的资源，因为在创建站点地图时，你可以对用户的导航定义约束，还可以定义从一个页面带到另外一个页面的数据。

设计导航地图

在设计导航地图前，首先要确定 use-case 模型中每个动作（action）所对应的页面。如果使用 UML 进行设计，那么很容易看到 use-case 模型驱动导航地图的方式，因为这个模型概括了某个用户可以使用的动作。

然后，虚拟出一个通用页面来标识某个用户可以使用的动作。这些虚拟页面是用户界面的模板。一个动词（verb）或动作指定了从一个页面进入下一个页面的导航路线。这个动作可以通过一个事件来实现，比如说通过一个按钮点击事件来实现。这个实现可以非常简单，比如说可以是一个只有一个 OK 按钮的登录页面。在用户点击 OK 按钮时，应用程序将试图登录到那个用户。因此，虚拟页面和动作都可以是 Login。

到目前为止，你还不需要指定任何技术细节。这样就使得后台开发人员很容易地将必要的活动（activity）包装起来以实现这个动作。如果用户成功的登录，那么他/她可以被重定向到导航地图的下个页面，比如说可能是用户信息（User Info）页面。

开发导航地图

在风险干系人确认了你的导航地图设计方案之后，就可以着手进行开发了。设计人员将会把工作重点放在页面布局的实际观感上，而你就可以创建必要的业务逻辑来实现导航地图所指定的动作。

Web 购物车就是将业务逻辑和导航地图开发结合起来的一个例子。在用户登录到 Web 应用程序之后，他们可以将自己选择的物品加入到购物车中。然后进入结帐区，在这一区域产生购物总额；然后再进入定购区，在这一区域产生用户的发货信息。

下面是一个导航路径的例子：

•Home.asp：用户选择登录。(GetCredentials)

•Login.asp：用户登录到系统。(Login)

•ItemsList.asp：用户选择要购买的物品。(AddItem)

•ItemsList.asp：用户进入结帐区。(Checkout)

•Checkout.asp：用户复查订单。(SubmitOrder)

•Finalise.asp：用户完全订单并输入发货信息。(ShipAndThanks)

•ThankYou.asp.

括号中的动作是继续进入下一页面所必需的应用程序动作或业务功能。这个页面名称之后的详细动作是是创建应用程序动作的虚拟事件。物理页面的名称提供给用户创建商业动作所必需的功能。

导航地图实例

下面让我们看一下导航地图的实际流程。用户首先通过进入Home.asp。在这个页面，有一个供用户登录的链接。用户在点击登录链接后被GetCredentials重定向到Login.asp，这里GetCredentials是一个产生结果的动词（verb），但是可能被实现为一个函数。然后用户在Login.asp页面输入他/她的用户名和口令。在点击 OK 按钮时，Login 动作发生。在这种情况下，用户的凭证被验证，（出于描述简单性的考虑，）我们这里假设这个用户是合法的。Login 动作导致用户被导航到ItemsList.asp页面，这个页面的作用是显示销售的物品。用户然后点击 Add to Shopping Cart 链接。AddItem动作会把物品添加到购物车，然后返回到ItemsList.asp页面。用户然后点击 Checkout 链接，这里 Checkout 动作将计算用户订单的总额，供用户复查。用户然后在Checkout.asp页面复查他/她的订单。在这种简化的情况下，用户订单中的任何东西必须正确，因为用户唯一的选项是SubmitOrder。在Finalise.asp页面，用户输入发货信息，然后点击一个 Complete Order 按钮。ShipAndThanks动作保存已经完成的订单，然后将用户重定向到ThankYou.asp页面。

从这个基本的导航地图，你可以想象到，在用户与系统交互时，可能会出现不同的路径。比如用户在购物车中增大选购物品的数量，这时用户就需要一个具有 Update 动作的路径。

在这个交互过程的图形化表示中，页面可以定义为一个个的方框，方框中填写页面的名称。动作可以通过箭头实现，箭头的方向是从当前的 Web 页面指向结果 Web 页面。这是遵循KISS (Keep It Simple, Stupid)方法的一个好办法。

通过有效的设计，你可以通过封装来提供必要的功能，进而完成每个动作