[首页]
[文章]
[教程]
首页
Web开发
Windows开发
编程语言
数据库技术
移动平台
系统服务
微信
设计
布布扣
其他
数据分析
首页
>
Web开发
> 详细
把复杂的网站导航简单化
时间:
2015-12-11 14:29:54
阅读:
228
评论:
0
收藏:
0
[点我收藏+]
导航设计是结构层面设计中的主要工作之一,在软件中,导航设计的好坏,直接关系到用户使用是否能够流畅。面对较复杂的导航,我们第一反应是将其简化。所以在一些复杂的企业级管理软件中(如SAP、金蝶ERP、浪潮ERP等),提供用户直接通达某位置的快速入口;有些软件则提供收藏夹,让用户把常用的地址收藏;有些则从导航交互的方式上寻求解决办法。
1、在路径层面上提供辅助导航
提起辅助导航,我们会马上想到搜索框、快捷入口、收藏夹等等,之所以会马上想到这些,是因为这些形式让我们的使用更便捷。
图 1-1 SAP界面上的快速入口
SAP上的快速入口,为较熟的用户提供便捷的入口,因为SAP是一个很复杂的企业管理软件,有财务管理、人事管理、生产管理等等,覆盖企业中的各行业,但通常单个用户一般只用其中的一个,比如你是会计师,那么你通常只用到财务管理模块,这时候你只是想打开软件就进入财务模块,快捷入口无疑解除你使用导航树的痛苦。
图 1-2 卓越网(电子商城)上的搜索框
电子商城网站是内容较多的网站类型,如果单纯从导航去寻找某个产品,会令我们花费较多的时间,而搜索框,可以便捷的通过关键字来检索,相信大家已经体验到它的便捷了。
从以上例子我们可以看出,新手可以通过“分类页、导航树和检索”的形式找到自己想要的东西,由于“地形”不熟,不可能有快捷的需求;大部分用户还是喜欢用“简洁导航、收藏夹”之类的形式,这样我可以挑选我想要的进去;如果有一定的自主权,可以直接“搜索框和快捷入口”,我直接跳到我想要的地方,很迫切!不想浪费更多的时间。
2、组织形式也会带给我们好的体验
导航的组织形式很多很多,在软件里,vista系统的路径条曾给我眼前一亮的感觉,我们通常都被系统传统的做法束缚了,vista系统突破了这个的思维,也很值得我们借鉴,不但在组织形式上,在思维上也值得我们借鉴。下图是我截取的一个例子。
图 1-3 vista系统的路径条
3、鱼眼菜单给我的思考
词典的导航,我们通常都是通过搜索,然后根据搜索来查找某单词的释意,但当我们只记得前一、二字母,完全不记得单词的时候,查找是很麻烦的事情,无论是翻书本字典,还是电子字典。这样如此繁多的检索型导航,看下面金山词霸的表现形式。
图 1-4金山词霸主界面
滚动条的拖动,或者翻动书页,都会让你浪费较多时间。Fisheye menus是HCIL(人机交互实验室,UMIACS的下属实验室之一)的研究成果之一,为了浏览者更加方便快捷地使用内容较多的菜单提出的一种解决方案。但一定程度上可以作为词典类导航设计的借鉴。下图为他们的鱼眼菜单:
图 1-5 鱼眼菜单
随鼠标的点击做大幅度的导航,而三角号为微调的工具,相信如此设计,使用起来会顺畅好多,在也不用去拖动那个难用的滚动条。针对内容较多的检索导航,相信我们会有收获。
试想,如果为你的电子词典设计一个这样的检索形式,很容易能在一个不大的区域里,方便的检索到某个单词,况且还可以配合搜索框使用。相信一个简单的思路,会改变用户痛苦的体验。
4、小结,认知的有限性和导航设计
人类的认知是极其有限的,只能很容易的搞清楚简单的问题。我们在设计导航时,也遵循人类的认知法则,尽量让用户一目了然。如果你设计的导航,让用户很费劲或者花费较长时间才能搞清楚,无疑是失败的体验(除非设计目的就是这样)。
没错!“关注你的用户就好了”。设计导航,就是要符合所对应用户的认知度。
把复杂的网站导航简单化
原文:http://www.jb51.net/web/7111.html
踩
(
0
)
赞
(
0
)
举报
评论
一句话评论(
0
)
登录后才能评论!
分享档案
更多>
2021年09月23日 (328)
2021年09月24日 (313)
2021年09月17日 (191)
2021年09月15日 (369)
2021年09月16日 (411)
2021年09月13日 (439)
2021年09月11日 (398)
2021年09月12日 (393)
2021年09月10日 (160)
2021年09月08日 (222)
最新文章
更多>
2021/09/28 scripts
2022-05-27
vue自定义全局指令v-emoji限制input输入表情和特殊字符
2022-05-27
9.26学习总结
2022-05-27
vim操作
2022-05-27
深入理解计算机基础 第三章
2022-05-27
C++ string 作为形参与引用传递(转)
2022-05-27
python 加解密
2022-05-27
JavaScript-对象数组里根据id获取name,对象可能有children属性
2022-05-27
SQL语句——保持现有内容在后面增加内容
2022-05-27
virsh命令文档
2022-05-27
教程昨日排行
更多>
1.
list.reverse()
2.
Django Admin 管理工具
3.
AppML 案例模型
4.
HTML 标签列表(功能排序)
5.
HTML 颜色名
6.
HTML 语言代码
7.
jQuery 事件
8.
jEasyUI 创建分割按钮
9.
jEasyUI 创建复杂布局
10.
jEasyUI 创建简单窗口
友情链接
汇智网
PHP教程
插件网
关于我们
-
联系我们
-
留言反馈
- 联系我们:wmxa8@hotmail.com
© 2014
bubuko.com
版权所有
打开技术之扣,分享程序人生!