设计网站的导航系统时,要牢记浏览器也有内建的导航机制。从导航的角度,最重要的机制包括:
1、后退按钮
浏览器中最明显、与导航最相关的控件就是“后退”按钮。点击它可能是在Web上最常做的导航操作之一。
2、前进按钮
“前进”按钮用得没有“后退”那么多,但仍是沿访问路线前进的一种方式。
设计网站的导航系统时,要牢记浏览器也有内建的导航机制。从导航的角度,最重要的机制包括:
1、后退按钮
浏览器中最明显、与导航最相关的控件就是“后退”按钮。点击它可能是在Web上最常做的导航操作之一。
2、前进按钮
“前进”按钮用得没有“后退”那么多,但仍是沿访问路线前进的一种方式。
线框图把网站许多部分放在一起,从视觉上展示它们。这是设计过程中的极为重要的一步,代表了从抽象到具体的重大进展。创建线框图时,你需要协调三种主要的信息源:
网站架构图
网站架构图会展示每页上导航的大量细节,尤其是结构性导航。策划线框图内的导航时,它通常是一个关键的出发点。
需求
确定会影响屏幕设计的需求。比如,品牌需求会要求在所有页面上展现标识,法律需求可能要求出处展示条款和协议。还必须考虑到功能性的需求,比如一直展示的搜索功能或购物车等。这些必须在线框图中体现。当然,如果需求是从用户研究得来,那么你的网站访客的需要也要有所体现。
线框图还是一种沟通工具。它使与客户的谈话更容易,并能将需求以更具体的形式反馈给团队。图形设计师能够参考线框图,看到每页上所有的屏幕元素及其各自的相对重要性。程序员也可以利用它们做数据建模和功能性需求。展示时,也要考虑提供其他的设计方案,讨论每个的利弊。
采用高保真还是低保真的线框图取决于你的观众。外部客户可能期待更详细、更光鲜的设计。当然,这需要你付出更多努力,而可能导致你方太多的注意力在线框图的外观上,而不是它要传达的想法。而内部的团队可能会接受粗制的、低保真的草图。在动手之前要先确定你的线框图的目标受众。在任何情况下,线框图都应该提示人们,这是尚未完成的设计。
最广义的线框图,就是页面的初步草图。它们不依赖最终的视觉设计,展示的是导航系统的骨架,或者每一页所需的主要基本信息。页面设计从需求、概念到架构图的过程中,都可以利用线框图这种视觉工具。它有助于你解构问题,并剔除适当的解决方法。线框图的一个主要职能是捕捉页面模板的布局。
创建线框图的方法有很多。你应该考虑的一些方面是:
1、保真度
与原型一样,有高保真和低保真的线框图之分。低保真线框图甚至可能不展示布局,而只列出每页所需的导航类型、内容和功能。高保真线框图可能与最终的设计非常接近,包含导航元素的尺寸和位置。大多数由Web设计者创建的线框图,都介于高保真和低保真之间。
关联性导航跨越网站各个层级结构,把页面紧密相连。让用户在阅读某个主题的同时,也跨越访问其他主题。这是超文本的基本属性之一,但同时也是嵌入式离题问题的根源。三种常见的关联性导航包括:上下文导航、快速链接和页脚导航。下面我们逐个来看看。
二、快速链接
全局导航中可能不会展现的某些重要内容或区域,就由快速链接来提供访问。它与上下文导航很像,但它的情境是整个网站,而不是单个页面。它一般会突出经常访问的内容或任务,但也会被用于推广网站的较深层的内容。营销人员可能会注意到快速链接的追加销售效果。
公用程序导航包含的是网站上协助访客的工具及其功能。这些页面通常不隶属于网站的主层级结构,就像搜索表单和帮助页。有些选项甚至没有对应的页面,只是网站的功能,就像注销或者改变字体大小。
2、工具箱
工具箱是网站上执行功能的选项(“工具”)的集合。工具箱也会包含内容页或导航页的链接,但通常都指向功能页面。因此,这种导航的页面过渡会很大,甚至很有戏剧性。比如首页的工具箱可能指向搜索功能,联系表单或者在线商城。用户在重定向上要付出更多精力。
什么时候应该把页面一分为二?用户会滚动页面吗?页面越短,数目就会越多,需要更多的点击和页面装载;页面越长,数目就越少,但用户需要滚动页面。页面长度没有唯一的规范,有许多因素会影响到它。
1、屏幕尺寸是个难题,没有唯一的屏幕尺寸可以作为设计的参考。在Web上,浏览器的尺寸千差万别——显示器分辨率、浏览器工具条与侧边栏的个数,以及桌面上浏览器窗口的尺寸都会引起它的变化。
2、把页面打散成多个小页面后,内容的冲击力和含义就不一样了。如果页面上的各个元素(图片、描述、规格、相关产品等)都放在另一个页面,最终的体验会大不相同。将它们集合在一起会让信息块之间产生自然的联系。
展示页与着陆页相似,但它提供的是特定产品群或内容群的总览,而不是网站各栏目的链接。展示页不仅仅是通往产品页的一种途径,它还包含关键的购物信息,并允许访客比较产品。顾客甚至可能在展示页就做出购买的决定,然后进入产品页获取更详细的信息,最终敲定。
首页就像所有页面的仪表板视图,它将访客导向网站的主要区域。常用的策略是将下级的导航直接展示在首页上,这对扫视有利,并且为那些埋得较深的内容打开了通路。
首页也包含文字内容或功能,但通常以缩略的形式出现。新闻网站会将头条新闻的前几行展示出来,并提供指向全文的链接。电子商务网站首页推荐的产品,所有细节都在内页中。旅行网站也会提供一系列功能,便于用户在首页直接使用。
首页常被视作产品营销或品牌形象推广的机会。然而,带着特定信息需求而来的访客,其首要目的就是直接快速地到达目的地。因此,Forrester Research建议将网站地图合并在首页之内:“首页往往被企业内最新的营销术语塞满,web用户被迫承受破译它们的痛苦。而网站地图常以简单的标签来组织链接,比如‘产品’‘服务’和‘帮助’,这正是消费者能够接受的语言。”
功能页让用户在线完成某个任务,比如搜索或者查看邮件。与内容页类似,它们往往就是实现用户需求的目的地页面。
在这种页面中多余文字很少,或根本没有,通常不含嵌入式导航和相关链接。上下文导航等跨越层级的链接在功能页中会出现问题。首先,用户需要集中精力完成手头的任务。其次,在填写表单或走流程时,中途跳到其他页面会造成用户输入的丢失。要尽力保护用户输入的数据,当用户用导航临时访问其他页面,不小心清除了表单或提交过程中断时,要避免让用户不得不重填一遍。