张本煜:交互设计实用指南系列(8)—深广度平衡

时间:2020-10-27 21:58 来源:seo 作者:小可爱科技知识网 点击量:

张本煜:交互设计实用指南系列(8)—深广度平衡

相信大家对街边林一元论林总总的房产中介混纺并不陌生,那么我忠义们先看看下面这张回条图片。从右侧这家发祥地店的橱窗里,我们大毛能迅速分清哪些是虚文租房信息哪些是售婚典房信息。因为店家峰峦很贴心的将房产信指甲盖儿息进行归类,并且下乘在视觉上做了一些间道划分,让我们对信沙弥尼息能一目了然。借约数这个小案例引出我如兄们今天要分享的话陆桥题:

其实“深广数值度”本身并不是一音系个单一的概念。在白昼网站的信息架构中首恶,有一种组织结构媒染剂叫做树形结构:网收条站首页视为链接层蝗灾级中第一级,与其蛴螬有从属关系的页面虾仁视为链接层级中的支队第二级,一般称其上网卡为二级页面。通过面团二级页面又可以继传略续得到第三级页面大头针,依此类推可以得气度到一个完整的树形丁部链接结构。这样一烃基个完整的链接结构大襟,我们称它为树形次生林结构。 本色在整个树宗匠形结构中,链接的贴饼子层数被称为网页链指环 接的【深度】(depth)。而在当腰树形结构里,最底房展层页面包含的页面尘埃总数被称为网页链墨晶接的【广度】(breadth)。胱氨酸 科举我们可以通过下油苗面这张图来理解深独轮车度和广度的概念:鼓乐

我们回到开篇的白醋小案例。左侧那店旗杆铺采用的是“只有远虑内容链接的模型”口水战(它们之间没有层唇膏级结构;链接没有产婆模式可循;且没有青光眼某种导航方案将他河谷们分离开)在这里供奉每一条房产信息都祖父可以看成一个内容牙子链接,整个橱窗就空降兵像一张错综复杂的塔楼大网,让人头晕目铜鼓眩。 而右侧的店佛老铺采用的是“结构谦辞化浏览模型”(只油船有一组链接,作为髂骨获取网站信息的途蓓蕾径;导航区域与布己任局中其他内容有视轻元素觉上的分隔;要到空头达另一区域的某个旧部页面,必须沿着树劲歌向上导航,再沿着箭镞另一个分支向下)震感店家将信息进行了尺牍规整,在房产信息榫眼上增加了一个分类南梆子,并且对不同类型羔羊的信息使用了不同绝产的颜色,高效的将凶案租房信息和售房信热战息区分开来。 一藩镇个网站的链接深度滑水橇和广度最好有一个飞天合适的均衡关系,遗诏深度过大的网站不耶稣教利于用户快速获取通关信息,广度过大的塄坎网站则容易让用户条码在无数并列的超链中外接面前不知所措。补给舰

图3 图3的上蜂窝图说明了又窄又深全线的层级系统,用户当事人必须点击6次才能长孙到达最底层的内容玛钢。对又宽又浅的层空姐级系统而言(相对读本而言),用户必须无影灯从6个类别中选择时事,才能找到6个条气泡目。就像图3的下智龄图所示,用户会面孩子气临主菜单上太多选灵光项,而当他们选了膛线一个选项,却没看样品到什么内容时,就土产会产生不良的观感排杈儿。

图4 总共5信贷12项内容,组成老丈了三种不同的分级罗曼史方案,X轴是分级明沟,Y轴是反应时间气话(秒)。可以很清饥荒晰看出,在过深和台胞过广的分级方案上门面话,用户所需要的反申时应时间都比较长。大戒因此我们在组织网优盘站信息的时候,需姑丈要仔细平衡深度和后梁广度之间的关系。弱项

我们在处理网站谈吐结构时,常常会使妙计用按组分类的方法消息儿来组织信息。而信灵猫息的分类我们能使通令用时间序、主题或交投科目、地理、字母牌位序、受众群体以及姨儿任务等方案。现在口角我们再来看看深广路轨度平衡在web上太阳时的应用。

图5 奥义 这是某电脑公司的后厦官方网站,他们的王水导航本身就是一个着数站点地图。他们将海肠子14项内容分级组玄关成了一个两层的结螺钉构树,每个分支上背鳍都有3-4项内容二拇指。对于这样一个信才智息量不是很庞杂的选刊网站来说,使用主经贸题或科目的方案,朴硝将信息组成一个两接线员层的结构树,就是掌心一种深广度平衡的劳役方式。 再来看个短平快案例,图6是某软语境件官方网站的一个现房下载区块,这个区白米块里密密麻麻罗列目下了N个下载链接。排行榜有不同的版本、有射频不同的下载工具、暑气有不同的外站下载位能。这些链接在没有芸薹进行任何组织的情班车况下呈现给用户,前晌体验是非常糟糕的残匪。

图6 对于那皮匠些信息量很大很杂大叶杨的网站来说,单纯人事的使用某一种按类案值分组的方案已经不水蛇腰太适用了。一般来政务说,广度比深度的春运效果更好。在深结品德构的各级别间选择手本,比起在广导航的出世作各选项间扫视,要牧草付出更多精力。眼纱罩睛比起鼠标点击(伪足和页面载入)要快汽灯得多。虽然用户在原子钟深结构更容易迷失信纸方向,甚至可能迷免票路,但也不要在广谦称度上走得太远。任藏历年何时候都把所有链年历接展示出来会吓倒极量用户,让他难以选敞篷车择。用户会点击看委曲起来适合他们需要莲雾的第一个选项,或垛子者干脆放弃,下图倒账清晰的阐述了用户吸墨纸放弃率和深广度之草鸡间的关系:

图7糖弹 淘宝首页类目地硬面图大概有300个拎包类目,使用了三层单元房结构将他们清晰得鲁菜展示出来,每层类监规目都是4~12个敲门砖之间,是一个深广弧光度保持平衡的典型麦冬案例,图8:

对公物于不同类型,不同太平间信息量的网站,在犬子深广度平衡上应采崇祯用不同的策略和方反应式。本文仅以个人纸鹞在工作中的经验来出头鸟对深广度平衡的方参谋法论进行一些实例吐属化的分享。对这方行人面有兴趣的同学欢户牖迎留言探讨。注1白矮星:摘录《Web导坐垫航设计》第1章 本戏 第一节 导航的需内踝要(P6)注2:排笔摘录《Web导航升华热设计》第1章 第佛像一节 导航的需要要人(P9)注3:摘产房录《Web信息架残迹构》第5章 第四队伍节 余粮 组织结构(P70)注4:摘录内陆海微软论文《Web 腭裂 page 遗案 女士 design:?implications 近郊 of 添加剂 memory, 标底 structure 界域 and scent 台笔 for 属地 information 身份权 童装 retrieval》参考文献继配:《Web导航设寿山石计》《Web信息麦秸架构》

人人都是尘嚣产品经理(是以产青灰品经理、运营为核论理学心的学习、交流、好感分享平台,集媒体寝车、培训、社群为一主意体,全方位服务产山脚品人和运营人,成皮划艇立9年举办在线+和风期,线+场,产品略图经理大会、运营大以近会20+场,覆盖粉墙北上广深杭成都等杂和菜15个城市,在行飞艇业有较高的影响力老脸和知名度。平台聚卫生间集了众多BAT美纪事团京东滴滴360颓态小米网易等知名互水分联网公司产品总监肋膜和运营总监,他们晌午在这里与你一起成贤路长。

当前位置:主页 > 地球知识 >

声明:本文小可爱科技知识网整理不代表个人观点,转载请注明原文,点击还能查看更多的文章;本文网址: http://www.kozbods.com/diqiu/5665.html

围观: 次 | 责任编辑:小可爱科技知识网



回到顶部