facebook的信息内容构架评析

2020-11-03 09:52 jianzhan

原文:http://uicom.net/blog/?p=762
facebook的信息内容构架设计方案,是现阶段为止互联网技术上我见过的最有效的信息内容构架。
每次学习培训,我基础都必须拿20分钟上下的時间来分析它,包含老的、新的、被抄袭的。 1直准备把这个分析全过程写下来,但讲的情况下能够图音并茂,写的情况下的确表述起来很难。
今天权且1试,期待能把学习培训师讲到的內容表述出30%。(只写如今页面上主要表现出来的物品,分不清析栏目区划早已拓展性难题了)
先看facebook老版页面的信息内容构架:(在1024辨别率里,照片宽度不可以彻底显示信息,提议独立开启照片看)

点一下变大
大构架的发展趋势和变化全过程:
1、最初,facebook的全部信息内容构架关键分为3个一部分:“系统软件关键导航栏区”(如上图,蓝色一部分。包含LOGO和两个所有导航栏)、“运用导航栏区”(如上图,黄色一部分。包含1个全局性运用(检索)和全部的运用目录)、“內容显示信息区”(如上图,橙色一部分。关键分为部分导航栏、主內容、輔助內容3个绝大多数,有N多关键內容)。
因为“系统软件关键导航栏区”、“运用导航栏区”的常态存在和內容多种多样,在客户应用时常常会影响客户对关键內容的关心。 因此,facebook在视觉效果设计方案上,特地根据移位非常突显了“內容显示信息区”(如上图,橙色一部分。我看到一些设计方案师说“facebook的视觉效果很烂,把那个部位歪曲了很傻”,实际上她们压根沒有看出设计方案者的用意,很傻!)
2、后来,facebook加上了“合作汉语翻译”,这是1个全局性作用。依照1般的设计方案思路,这个“汉语翻译”的部位挑选能够:放在“所有导航栏3(设定)”的部位,或做为“所有导航栏2(运用)”的1个常态新项目。
但facebook沒有这么做,以便更好的主要表现其牛逼的UGC风采,facebook的设计方案师大大加剧了“汉语翻译”在导航栏上的比重。“四不像”的把这个运用,突显在了“內容显示信息区”的右上角,另外在“所有导航栏3(设定)”里加了1个語言切换的导航栏(后来大约是发现“語言切换”的应用频率非常少,如今给替换到了底部版权信息内容的右边)。
3、再后来,facebook推出了IM作用。针对facebook来讲这是1个常态运用,在信息内容构架上务必常态存在。因而她们把“及时通信”融合了“信息内容通告”1起作变成“情况栏”的方式。 (我猜测,这个情况下facebook的设计方案师们早已有了“实际操作系统软件”的构想)
这是1个很造型艺术性的设计方案,解决的十分好。并且IM自身设计方案做的十分轻巧易用。 在此以前我以前猜想,她们将会会把IM放到“系统软件关键导航栏区”的“收件箱”的部位,結果我错了,她们寻找了更好的设计方案方法。
4、现如今,因为“系统软件关键导航栏区”(如上图,蓝色一部分)、“运用导航栏区”(如上图,黄色一部分)是常态存在的內容,占有了页面很大占比的部位,再再加內容显示信息区(如上图,橙色一部分)自身还必须1些“关系导航栏”“友善导航栏”早已“题目”的內容,致使每一个网页页面真实展现“內容”的地区非常少非常少。
做为1个网站,这沒有甚么大难题。但做为1个“运用服务平台”,这无疑有许多的阻碍,页面內容呈现比较严重受到限制,客户的视觉效果一直消耗“常态导航栏”上。想想假如你的实际操作系统软件页面,1/3室内空间长期性被系统软件菜单占有,你会不容易奔溃?
我对老版设计方案的,几个关键点评
1、逻辑性清楚,层级明晰认真细致。拓展性好。但在內容展现上,欠缺自主创新。
2、facebook全部网站的关键是“我的”,这便是他顶部系统软件关键导航栏区(如第1张图,蓝色一部分)。此外,顶部也有“所有导航栏3(设定)”。全部顶部是网站的关键,客户不能能被客户或第3方更改,也是facebook的官方保存“地区”。
但,这里有个细节她们1直轻手轻脚沒有真实放宽,便是那个权宜之计的“home”。
客观事实上如今绝大多数客户回到主页都会点一下logo,facebook在主导航栏上撤销了“home”,但又害怕彻底撤销,因而在“所有导航栏3(设定)”那个区 域前面加了1个“home”,并且还把这个连接和logo的连接作了区别,1直维持着对数据信息的检验(包含全新的信息内容构架设计方案也1样作了连接区别,在检验数 据。有兴趣爱好人能够看看logo的连接和home的连接详细地址不1样)
3、facebook的关键导航栏实际上是“运用导航栏区”。这里危害了关键內容区的显示信息。
“系统软件关键导航栏区”和“运用导航栏区”包围着着內容显示信息区的做法,构造和逻辑性都很清楚,并且非常容易了解。
4、关键內容区有1个设计方案1直存在争议:
例如,在“照片”的网页页面,facebook加了两个连接“我的照片”“有我的照片”,这两个连接被解决变成“友善导航栏”,客户点一下后到了新的页面,新的页面没法回到当今“照片”的运用。
但,就中国客户(我并不是很坚信在这个地区存在中国外客户应用习惯性的误差)的应用习惯性看来,这两个连接应当被作为“关系导航栏”乃至“部分导航栏”解决。这也是UCH在抄袭facebook时做过的为数很少的“好修改”之1。
上1页12 下1页 阅读文章全文