导航设计中的信息结构

在进入今天的主题之前,我们先来探讨导航的重要性,并分析一下门户网站中导航的表现。

导航直接影响到公司的财政收入

导航会给我们带来哪些好处?导航不光只是提供信息获取的途径,它的设计优劣会直接影响到整个公司财政收入。下面我们看一个例子(以下内容来自alibaba李凡的《设计师的商业意识》):

 

alibaba大致的广告价格

上图反映了阿里巴巴网站大致的广告价格。

其实页面上方大量的空间都被导航占据了,见下图:

可以看出,上方的导航非常庞大,在一屏之内,用户几乎看不到搜索结果。

用户是来找信息的,第一屏完全看不到结果!!!

下面我们要为导航减肥:

导航减肥后的页面

这是减肥之后的导航,搜索结果在更高的位置呈现,同时每个产品位的价格也增加了很多,第一个位置的广告位由9.5万增加到12万。

导航的改变,直接带来了网站的财政收益。

门户网站的导航

导航在Web设计中占据着非常重要的位置,但是我们在设计网站时,常常会忽略导航的重要性,特别在门户网站中,这种现象更加普遍。以下为网易财经频道的页面导航:

时间: 2024-09-12 14:25:12

导航设计中的信息结构的相关文章

iOS中read it later阅读界面隐性导航设计

文章描述:iOS中read it later软件的阅读界面. 移动设备阅读类软件最重要的特性之一就是尽可能的增大阅读面积,为此,就必须尽可能的让屏幕中的导航占到最小,甚至隐藏,手机浏览器也基本属于阅读类软件,最近流行的海豚浏览器甚至将电脑中的"鼠标手势"引入到手机浏览器中. 什么是隐性导航 下图是iOS中read it later软件的阅读界面,除了最上方的状态栏,阅读区域占满了整个屏幕,没有任何诸如"返回"."关闭"的导航按钮,实际这些按钮是隐

掌上指路标 —– APP架构与导航设计

一款小小的手机应用,却包罗万象,融合这复杂的信息内容或功能逻辑.要让用户在使用中获得 最好的体验,迅速掌握应用的框架结构,其导航的设计是一个重要的环节. 手机应用的导航和现实世界中的路标或者地图的作用很类似.它是应用软件的虚拟框架,对用户具有指示标识以及识别的功能. 比如,如同路标,导航能在使用中,定位用户当前在哪儿,为用户突出当前视图重要的功能,告知用户可以去哪儿,在不同的视图和区域迅速地切换信息,记录使用的操作轨迹防止用户迷失等.那么导航应该如何设计呢? APP导航设计的步骤主要为以下三步:

导航设计:选中状态应该高亮还是灰调

导航设计中一个基本的任务点是准确标明当前选中项,不当的设计很容易造成用户困惑.尤其是只有两个列表项时,要对用户准确传达当前的选中项,设计上要很谨慎.针对最近项目中遇到的这个问题,记一笔. 用户判断选中状态的心智模型有两种: 一种是指示灯式,如红绿灯.电梯操作面板.各种仪表盘等,指示灯亮起表示选中--即高亮: 另一种是按钮式,按钮陷下去表示选中--即灰掉.明显告诉用户这个正在使用中,不可点. ===========================案例分割线=====================

值得学习总结的网页导航设计最佳实践

  优质的网页设计通常都有着相当不错的导航设计来支撑.如果你的网站有着有趣的内容和受欢迎的视觉设计,那么一个体验良好,可用性优异的导航栏无疑是必须的.可用和易用一直是高效交互的核心,也是激发创意.创造高效设计和优秀视觉设计的基础.所以说,是时候重新审视你的菜单和导航设计,尽量以简约的方式将它们重新组织起来. 导航是必不可少的.高素质是网站导航是让网站从不错走向卓越的必经之路.在今天,千变万化的网页导航设计开始趋于系统化.规则化,网页导航的最佳实践也并非虚无缥缈的都市传说,而今天我们要聊的也就是这

2015网页导航设计趋势

  不管你喜欢不喜欢,汉堡图标反正已经是大势所趋了.今年无数的网站将这个小元素纳入到界面中来,成为页面导航的重要组成部分.不过汉堡图标并不是今年唯一的导航设计趋势.全屏导航.底部导航等许多设计手法都是网页设计师们的心头好.今天这篇文章将会对今年所流行的10个导航设计趋势进行总结,并附上精彩案例若干,记得收藏哟. 1.全屏导航 当导航是整个网页设计的核心的时候,页面会是怎么样的?只要合理地策划整合,全屏导航其实是一种非常有效的技术,用户可以更加便捷地切换到不同的页面,内容成为更加触手可及的东西.

iOS的隐性导航设计

移动设备阅读类软件最重要的特性之一就是尽可能的增大阅读面积,为此,就必须尽可能的让屏幕中的导航占到最小,甚至隐藏,手机浏览器也基本属于阅读类软件,最近流行的海豚浏览器甚至将电脑中的"鼠标手势"引入到手机浏览器中. 什么是隐性导航 下图是iOS中read it later软件的阅读界面,除了最上方的状态栏,阅读区域占满了整个屏幕,没有任何诸如"返回"."关闭"的导航按钮,实际这些按钮是隐藏着的,我把这种隐藏看不到的导航称之为"隐性导航&q

电商网站导航设计超全面指南

  伴随着互联网的成长,通过电子商务网站实现商品交易越来越频繁,而访客在面对越来越庞大的信息量时会感到迷茫,因此,优秀的导航设计能够提高网站的易用性,对实现电子商务网站的高效运作具有实际意义. 另,电子商务网站的首页导航设计必须本着用户体验为佳的原则,既要将网站中的所有信息都在有限的导航栏中体现,又要为用户反馈出重要的帮助信息.网站因其独特的重要性和不可替代性,在电子商务网站设计中日渐凸显出举足轻重的地位. 1.符合网站内容结构 在设计电商网站的导航之前,事先应该对网站整体的内容有一个全面的了解

五种移动应用导航设计总结

  下图是<移动应用UI设计模式>一书的截图,截图中列出的是一些适合做主导航的导航模式. 其中跳板式导航.列表式导航和选项卡式导航最为常见,仪表式导航和隐喻式导航一般在拟物化设计或者是工具类的app中比较常见,超级菜单式现在会用到的比较少.由于这个行业发展速度很快,还出现了一些书中没有列出,但是在现在也很常见的导航模式,例如,出现于Android的侧边抽屉式设计,现在在ios中也得到了广泛的应用.下拉式菜单也会作为主导航出现. 下图是书中列出的一些只适合做次级导航的模式: 例如:页面轮盘式.图

Android 应用中十大导航设计错误

中介交易 SEO诊断 淘宝客 云主机 技术大厅 [核心提示] 这一次,我们就设计错误的话题展开,指出一些大家在安卓开发领域设计应用导航时经常被犯下的错误以便更好的避免他们. 大家好,这里是 2014 年第一期正式的 ADiA 教程.在上一次的设计错误文章里,我们已经简略的提过了一下导航设计上的错误,这一次,我们就这个话题展开,指出一些大家在设计应用导航时经常被犯下的错误以便更好的避免他们. 十大导航设计"反模式",Android 开发者联系团队为你用心呈现~ 希望大家看 (乖) 得 (