网页导航是网站中一个重要的组成元素。访客需要通过导航来快速找到他们所需要的信息。
如果导航设计非常混乱以致阻碍了用户使用,访客将感受到挫折甚至离开。简而言之,网站导航设计需要清晰而直接。为了达到这个目标,我列举7种应该避免的糟糕设计。
1.太多选项
提供15个选项然后做出选择的时间比提供8个选项然后做出选择的时间要长。提供尽可能少的选项可以提高选择的时间。
不幸的是,这个原理应用到网站导航时,许多公司就不管这一套了。他们把所有选项都集中到主导航条(primary navigation bar)试图让用户快捷到达所有页面。
这好像听起来很有道理,但是信息过载造成的后果会适得其反。与事先设计好用户有可能访问的导航选项不同,他们会因为过多的选项而不知如何下手。
当用户开始质疑应该点击哪个选项时,他们已经开始抱怨这个导航架构了。用户很可能点击的下一个按钮就是“返回”。
当设计一个网站的主导航时,设置尽可能少但重要的选项确实会有些风险。但是设计尽可能少的选项,事实上是鼓励用户全面体验你的网站。
2.错误的选项
另外一个经常出现的错误出现在处理主导航与次导航之间的关系上。将一个并不重要的导航选项放到主导航将直接影响到网站的目标人群使用体验。
需要时刻铭记的是网站是给目标用户使用的,内容与形式时刻要与目标用户契合。
一个“董事长致辞”的链接对公司的CEO来说是重要的,但对于不需要这个的内容的用户而言,将“CEO致辞”放在主导航无疑是错误的,特别是这个致辞是以链接的方式存在时。
3.为大尺寸设备设计还是适应各个设备
现在网站被各种设备各种尺寸访问着。只用大尺寸显示访问网站的时代一去不复返了,友好的网站必须适应多平台尺寸设备。
许多网站导航方案只为大屏幕显示器。在小尺寸显示设备上,包括平板电脑和手机,这种导航体验就不是很友好了。这就是网站为什么必须设计自适应导航的原因。
有了自适应设计的网站,导航便可以在不同显示尺寸的设备上保证易用性。例如Webydo就是个好例子。它有着像素级自适应编辑功能,可以自由适应不同设备,不需写一行代码。只要把导航与页面设计好,就可以像一个正常的网站一样发布了。
4.弹出式菜单的混乱
当你开始设计主导航的选项时,开始考虑次导航与主导航之间的页面联系。比如说,主导航上有一个“我们的公司”选项,在这个选项下面还有其他重要性不足以放在主导航上的次导航,如以下几个:
*公司历史
*领导人团队
*所获奖项
*招聘
表现这些次导航方法之一就是下拉框或弹出框,而这种触发条件是鼠标悬停在所属主菜单上。这种通用方法可以防止一些问题,但是如果有下面的状况就hold不住了。
例如,触摸屏是没有“悬停”这种状态的,所以必须确保这种链接方式易用。不要使用有三级或者更多的弹出式菜单来避免各种弹出菜单,这会使你设计的导航变得笨重。
如果想了解哪种菜单适合你的网站,通航设计模式的重要性 这篇文章用各种实例讨论了web和app的导航。
5.导航不一致
一旦用户搞清楚了如何使用你的导航,就不要再改变啦!网站应该有个体验一致的导航,无论是网站、触屏,还是迭代导航。次导航可能在页面间变化,但主导航的体验必须一致。
6.导航的文案太长
保持简练的导航非常重要,保持导航上文案的简练与友好也同样重要。
比如一个链接叫“我们公司的所有信息”,就不如“我们的公司”“公司”“关于我们”,或“关于”。这似乎不是一个特别大修改,但是可以精简许多。
如果你像这样修改整个导航条,用户就可以省一半的精力阅读的同时保证文案的可达性。
7.错误的语调
每个网站都有自己的语调。这个语调可以是友好的,轻松的,也有可能是专业的,直接的,或者其他的感觉。无论这个网站的语调是什么,导航的文案应与语调相符。
如果这个网站的语调是友好的且助人的,链接上“我们如何帮助你”比“服务”更好些。通过了解这个网站的语调,你可以设计与之相符的导航。
是的,在这种情况下“我们如何帮助你”比“服务”字数要多,这似乎违背了第6项原则。要记住的是设计的目标不是文字尽可能短,而是根据全局做出正确的设计,这个全局包括适当的文本长度,正确的语调、选项等。
如果你正在为你的网站寻找一个设计方案,可以看这篇文章。
结语
一个网站的导航设计可以打造或破坏用户体验。确保你的导航结构清晰易用可以使得用户花费更多的时间并指导用户阅读所需内容,这些对良好的网站用户体验也是无比重要的。