下载本文档
版权说明:本文档由用户提供并上传,收益归属内容提供方,若内容存在侵权,请进行举报或认领
文档简介
1、· 良好位置感的设计作者来源:JunChen 发布时间:2007年08月06日 · 好的设计和不好的设计,就像是一块硬币的正反面。之前我们看到的都是硬币的反面,只要翻转一下,就可以看到正面了。 上次我评论了上网四大郁闷事,很大原因是导航混乱、位置感不强造成的。有一次参与朋友公司的讨论时我说道,网站就像是一个信息群岛,岛屿和岛屿间是相连的,差别在于你是用独木桥还是高速公路,桥边(路边)是美女的诱惑还是指示牌。良好位置感的设计,主要解决三个问题:我从哪里来(为什么我在这里)?我在哪里(这里是哪里)?我将去哪里(下一步怎么走)?就像是一个迷宫,你所处位置
2、正面有三条路,背面有三条路,你可能一下子就迷失了,忘了从哪条路来,也不知道下一步该走哪条路。 在不同的情境中,这三个问题的主次不同。但大部分情况下,第二个问题(我在哪里)更重要一些。 一种设计是在国外被叫做 Breadcrumb 的东西(延伸阅读:Breadcrumb Navigation: Further Investigation of Usage),就是童话里利用面包屑找到回家路的聪明小孩的故事。这个设计不仅仅用在资讯类网站的分类层级导航,也常常被延伸到那些“下一步、下一步”的交互过程中。比如: 如果你对 B
3、readcrumb 使用率有疑问的话,推荐你阅读上面给出的延伸阅读文章。 我曾经想设计一种记录用户在站内访问路径的 Breadcrumb,这个和一般的“您的位置”有些区别,类似于访问历史。后来我发现实际上 Taobao 或者其他购物网站的商品浏览历史(站内访问历史)可以算是一种变体。 然后还有一种设计似乎是亚马逊独创的动态 Tab 设计(延伸阅读:亚马逊网站导航栏的变迁史),即当前所在的分类作为当前的 Tab,突出显示(动态 Tab 设计的创意应该来自于利用 headings 级别文字
4、表示当前页面,这一点 Amazon 仍然在使用): 插一句话,怎么样设计算是突出呢?W3 有一个对比度标准算法:亮度差异大于125,色彩差异大于500。起码得做到这一点吧。 利用 Tab 作位置导航有很大的优势,结合 Breadcrumb 和 Tab 还产生了一种变体,在 Yahoo! 的一些频道中已有运用: 另一个问题是,对于资讯类网站,用户(访客)可能并不是从首页进入的,可能通过搜索引擎或者外部链接。这种情况下如何是好呢?除了以上方式的综合运用,我曾看到过在页面上给出搜索框,并给出来路的关键词,提示用户可以再次进行站内搜索的。比如: 以上可能更多侧重于信息架构方面,举的例子也估计是见多不怪,但我想说的是创新永远不会是凭空产生的。所以我们可以通过追根溯源的方式去学习,来增强我们的思考能力。我赞同一个观点:设计师应该是发明家。在产品设计上,你应该比他人想的更前
温馨提示
- 1. 本站所有资源如无特殊说明,都需要本地电脑安装OFFICE2007和PDF阅读器。图纸软件为CAD,CAXA,PROE,UG,SolidWorks等.压缩文件请下载最新的WinRAR软件解压。
- 2. 本站的文档不包含任何第三方提供的附件图纸等,如果需要附件,请联系上传者。文件的所有权益归上传用户所有。
- 3. 本站RAR压缩包中若带图纸,网页内容里面会有图纸预览,若没有图纸预览就没有图纸。
- 4. 未经权益所有人同意不得将文件中的内容挪作商业或盈利用途。
- 5. 人人文库网仅提供信息存储空间,仅对用户上传内容的表现方式做保护处理,对用户上传分享的文档内容本身不做任何修改或编辑,并不能对任何下载内容负责。
- 6. 下载文件中如有侵权或不适当内容,请与我们联系,我们立即纠正。
- 7. 本站不保证下载资源的准确性、安全性和完整性, 同时也不承担用户因使用这些下载资源对自己和他人造成任何形式的伤害或损失。
最新文档
- 白酒酿造生产工艺优化方案
- 智能家居消费直播带货方案
- 医疗器械经营培训
- 桥梁支座更换加固设计方案
- 建筑垃圾消纳场工程地质勘察报告
- 充电桩场站地块工程地质勘察报告
- 2026自动驾驶高精地图采集标准与地理信息安全监管趋势研究
- 高中三年级英语基于语篇的完形填空解题策略教学设计
- 高二物理《楞次定律的微观机理与定性定量统一建模》教学设计
- 初中数学八年级下册图形的旋转第二课时教学设计
- 2026年全国高中数学联合竞赛一试(A卷)试卷及参考答案
- 山东省济南市2026-2027学年高中三年级摸底考试暨开学考化学+答案
- 2026年浙江经贸职业技术学院高职单招笔试英语试题库含答案解析3套试卷
- 节能技术在化工中创新课题申报书
- 《中华人民共和国生态环境法典》应知应会测试题100道
- 2025年山东公务员考试申论试题及答案(B卷)
- 船台施工方案
- 2026年非小细胞肺癌诊疗指南
- 千牛平台服务条款协议合同
- 2024年中核集团招聘笔试参考题库含答案解析
- 动叶调节轴流风机动调机构详解
评论
0/150
提交评论