导航设计与信息架构
作者:JunChen 来源:UCDChina.com 发布时间:2008-01-13 22:08:00
大部分时候我们讲导航,讲的是导航对内容和结构的一种表现。就是说我们在讨论导航的时候,更多的去关注怎么与之交互,以及视觉上是怎么好看。但是导航,不仅仅局限于交互方式和视觉形式。
被狭义化的导航
回想一下我们是如何设计导航的?难道不正是根据内容、根据内容的结构去设计?最终,导航可能包含了三方面的功劳:交互设计、视觉设计,别忘了,还有信息架构。是信息架构决定了导航的设计。
信息架构决定了我们是用几级分类,一个项目是否可以属于两个或多个分类,等等。信息架构里面,有很大一部分工作是分类。分类,就是对已有的项目、内容,通过已知的共同属性,进行分组、归类。在计算机、信息系统被发明以前,人们就在不断进行着分类工作。从日常生活到科学研究,分类无处不在。我们为什么会要对动物、植物进行分类呢?哦,是为了形成科学的知识体系。那么当然,是先有了动物、植物、微生物的具体存在,才有了界、门、纲、目、科、属、种这样的生物分类法。为什么要分那么细致那么多层级?是因为生物届的复杂性要求分的这么细致。
所以我一直以来支持的观点是,根据内容去进行分类,和信息架构。所以我也十分推崇使用卡片分类法,既是定量分析也是定性分析。在有条件的情况下,推荐大家尝试。
回到开始的话题,如果我们考虑导航的时候,仅考虑其交互方式和视觉形式,那么很有可能反作用于信息架构。比如下面的例子。
Tab 式导航的例子
我们为什么要用 Tab 式导航?是因为它能比较好的表现出分类以及分类的结构(一般是两级)。并不是因为有了 Tab 式导航,所以人们才把分类分为两级。最初的时候,一定是因为先有了两级分类,设计师才设计出了精妙的 Tab 式导航。而 Tab 式导航的大规模使用,也在反面的影响大部分信息架构的设计。简单的几项内容,本可以一级逻辑表明,却被套用了两级分类,理由是 Tab 式导航比较好看。就好比人们总是习惯于用四个汉字作为导航文案一样。比如蛮好用“新闻”两字可以的,非得用“新闻热点”。这道理是一样的。
导航的交互和视觉设计不应该影响信息架构的设计。鱼眼菜单真的那么好用么?如果原本一个下拉菜单就十个菜单项,你会选择用鱼眼菜单吗?或者又是仅仅因为它很酷。
仍然是那个问题,什么样的内容,决定了什么样的导航。尤其要注意下,我这里说的内容,不仅包括文本资料的分类,也包括功能型网站的用户任务和目标。
导航不仅仅是 Tab
我们看到在 Office 2007 系列产品中,原来的菜单已经被板砖儿样的按钮所取代。这些被称为 Ribbon 的板砖儿,或者称之为 Context Navigation(情景式导航),是对类似交互操作的一种分类。显然,情景式导航,已经超越了简单的针对内容的分类。
搜索框是一种导航吗?这样说似乎有些牵强。但是在信息检索系统中,搜索框、过滤器等,确实是起到了导航作用的。或者我们可以称之为辅助导航。
归本溯源,导航为什么会存在?在所有的系统、应用中,都是为了让使用者能够高效的完成任务、达成目标。这样的话,从广义上讲,引导用户快速完成任务的链接、按钮,都可以作为大导航系统的一部分。
可能很多朋友有这样一个问题:导航设计是否要考虑商业目标?我觉得这与上文并不冲突。具体的可留待讨论。
小结
不要为了导航而导航,前面一个导航是指表现形式,后面一个导航是指实际的导航系统。
对于导航的设计,信息架构比交互方式、视觉形式更加的重要。
导航不仅仅是内容的一种分类,也包括类似交互操作的分类。导航的目的是为了让使用者高效的完成任务、达成目标。
情景式导航有可能是导航设计的一种发展趋势。
猜你喜欢
- 在CSS中我们会经常要用到“清除浮动”Clear,比较典型的就是clear:both;CSS手册上是这样说明的:该属性的值指出了不允许有浮动
- 越简单越丰富——极简网页设计视觉呈现技巧如何让杂乱又咄咄逼人的网页变得轻薄简洁而美观,又需保留完整功能、同时很好的区分出重点模块?这往往是让
- a {}{ background:url(images/normal.gif); } a:ho
- 在Perfection kills上看到他去年写的一篇文章,关于HTML优化的,讲的很详细,姑且记录之,尽管里面有些东西并不能在目前的环境里
- 爱如风过 问:js如何能知道浏览者计算机或者浏览器使用的语言是繁体还是简体?如题,我想用jS检测到浏览者使用的是繁体还是简体中文,以便设置页
- 这是网站制作很流行的下拉列表两级连动的代码,也是很多人使用的代码。下面,先来看这段代码:<%dim countset&nbs
- 当地址栏没有参数"id"时: 代码如下:Request.QueryString["ID"] == n
- 用语言实现 好处: 1、可以减少对数据库的访问。 2、可移植性好。 坏处: 1、操作起来考虑的东西较多,修改一处就要修改别一处。也就是说是相
- 大家都知道系统存储过程是无法用工具导出的(大家可以试试 >任务>生成SQL脚本) 因为系统存储过程一般是不让开发人员修改的。 需
- <!-- #include file="conn.asp" -->
- 摘要:本文介绍了字符与编码的发展过程,相关概念的正确理解。举例说明了一些实际应用中,编码的实现方法。然后,本文讲述了通常对字符与编码的几种误
- 下午在写程序的时候,碰到个变量重定义的问题,具体是在一个函数中的两个地方定义了相同的变量,两个变量分别放在IF语句的两部分中,本来以为这两次
- 今天老肥让我试试百度知道的新功能:插入地图。该功能需要登录才能操作,因此我意外的发现百度用户登录的弹出层变了。我很喜欢这个改进,利用TAB来
- 从98年某月某日我的第一个个人猪页诞生.到2008年的今天.宣告了我从事设计行业整整十年.十年,很多变化,从摆弄个人猪页到现在以做设计为生,
- SQL Server数据库查询速度慢的原因有很多,常见的有以下几种:1、没有索引或者没有用到索引(这是查询慢最常见的问题,是程序设计的缺陷)
- 以下为谷歌国际少年绘画大赛,小学1-3年级作品。看孩子们的logo创意,自愧呀! 彩色世界我们热爱温暖的阳光,“O”代表我们心中的太阳。我们
- 来自某个nb招聘的题目:请给Array本地对象增加一个原型方法,它的用途是删除数组条目中重复的条目(可能有多个),返回值是一个包含被删除的重
- javascript模仿alert提示效果,如果你听厌倦了系统自带的那个,可以使用这个alert提示效果,听不错的。相关文章推荐《类似于新浪
- <HTML><HEAD><TITLE>SQL Server 数据库的备份
- 虽然ting88没有注册的用户不能下载歌曲,但搞定它也非难事啊:)进入www.ting88.com的网站,把歌手专辑页面的URL复制到文本框