起因现场：http://www.flickr.com/photos/fenng/3409309938/

起因:白鸦说fenng找的blog模版土鳖，冯大辉截图反击说UCDchina才土鳖呢，

Fenng的截图：《一个宽屏用户的鼠标长途奔袭..》

白鸦 說︰
哈哈哈。 说你土鳖吧，你还不服。
这个问题是这样的：
1、在1024下，中间没有空档。主要用户群的分辨率是1024，你是非主流用户。
2、左边如果不采用固定宽度，在宽屏下会被严重拉宽。 阅读区域太宽，对阅读者的眼睛是不健康的。
你可以看看google、百度的搜索结果，以及google reader、gmail，内容区域都是固定宽度的。
我们的宽度综合了1024下的效果，和人眼最合适宽度的数据，作了稍微比google宽一点的 调整。
3、左边是主要的内容显示区域，用户要阅读的地方。 右边是辅助内容，不重要。
一个页面能只有一个重要的区域。 所有就让辅助内容在最右边呆着，免得干扰左边内容。
改天，给你上上课。你太土了，以后再提这种问题会被人鄙视的。我都不好意思了
下周让你在咱们的眼动议下看看你的三栏blog，读者是多么的注意力不集中 …
發表於 10小時前。 ( 永久連結 )

一 ，我不喜欢掺和讨论，不过手头有一些客户的数据，就说两句。
1． 1024是主流设计屏宽，但是1024及>1024分辨率的用户并不是主流用户。数据截图如下。

数据日期区段:2009年3月4日~2009年4月3日。

结论: 屏宽分辨率等于或小于1024的用户未超过平均数，已经是非主流啦。

NO 1： NO 2 NO 3 NO 4 NO 5

二 “左边如果不采用固定宽度，在宽屏下会被严重拉宽。 阅读区域太宽，对阅读者的眼睛是不健康的。”

截图是白鸦个人blog：http://uicom.net/blog/ 在1280屏宽分辨率，ff浏览器下的效果。
页面结构为宽度自适应设计，阅读区域宽达850px，每行约70个汉字。

“阅读区域太宽，对阅读者的眼睛是不健康的。”这句话非常正确的。

850px宽的文本阅读区，会让用户变成摇头电扇不说，阅读时注意力难以集中，耐心下降，容易跳行，行首行尾无法正常衔接，阅读连续感被破坏。
屏幕阅读本来就比纸本阅读的速度慢，用户对内容的耐受力也会下降，失败的阅读区设计会赶走很多用户。

到底阅读区域的宽度为多少是合适的?

请看下面这篇翻译的论文《CAI课件里电子文本的设计原则》作者：Liu Zhanrong, CCRTVU

“对于设计电子文本，本文主要提到下列看法和建议：
- 理解电子文本和书面文本没有本质上的区别；
- 屏幕上的阅读速度比在纸张上阅读同样的文字要慢20~30%；
- 文字字体和布局本身诸多因素（如行距、字体、字号大小等）的变化会明显影响用户的阅读速度和对阅读的态度；
- 小号字体比大号字体更容易阅读；
- 文字行应该较短，在8~10个英语单词之间；
- 文字应该采用句法移行方式；
- 文字应该以语意（意群）为单位来显示（如一次一个概念）；
- 文字特征如黑体、斜体、字号等如果适当运用可以起到突出显示、吸引注意力的作用；
- 文字应该与左边距对齐；
- 文字显示应该大小写体综合使用；
- 应该避免使用跳跃式垂直滚动的方式；
- 平稳式垂直滚动可以用来浏览或查阅窗口里的内容，而不宜用作主要显示方式；
- 使用垂直滚动方式时，应该采用高于用户喜欢的20%的滚动速度，否则静态显示更有助于用户理解所显示的内容；
- 水平滚动应该采用20个字符的窗口，每次向前滚动5个字符，应该由用户来控制滚动速度；
- 教学辅导性文字材料里的交叉参考有助于用户浏览获得除主材料之外的更多辅助材料；
- 用户在前三次接触交叉参考资料时的作用不很明显；
- 计算机屏幕上显示文字材料时的位置是很有讲究的。”

• 英文单词的平均宽度为6~8，8~10个英文单词的字符数为60~80，加上空格，折算为汉字，文字行宽度在30~40个汉字为合适。
• 传统纸本阅读，（请随便拿起几本本最常见的32开的中文书，数一下每行的汉字数，）在30~35之间。
• 30~40个字符，以字号为较便于阅读的14px来计算，加上浏览器默认字间距，宽度为450px~630px之间最为合适。
• 结论：阅读区域的宽度为450~630px，每行30~40个汉字是比较合适的。其它相关（如行距，屏高，提升阅读速度，文字阅读的水平与垂直滚动 方式，有兴趣的同学可以在上面的论文中找到一些参考理论。）

三

你可以看看google、百度的搜索结果，以及google reader、gmail，内容区域都是固定宽度的。
我们的宽度综合了1024下的效果，和人眼最合适宽度的数据，作了稍微比google宽一点的 调整。
左边是主要的内容显示区域，用户要阅读的地方。 右边是辅助内容，不重要。
一个页面能只有一个重要的区域。 所有就让辅助内容在最右边呆着，免得干扰左边内容。

先看下表

1 关于google的3个应用，内容区域宽度都是固定的说法是不客观的。

2 不同的产品具有不同的应用类特点。
如何布局取决于每个区块的不同属性、功能性、主次性，产品所有者的资源与优势，以及该应用的战略，时效等要素。
将其它成功的应用随便拿来佐证比较的做法是不科学的。

3 fenng所指出的问题症结所在 是指“页面布局中间的大块留白”。而不是“单个内容/功能区宽度是否固定的问题”。

4 “布局是否居中，整体宽度是否固定” 和 “某栏功能区宽度是否固定” 是两个论题。

5 google的上述应用中，只有google 搜索结果页面存在布局中间留白的问题。

6 从视觉布局特点上：

• Google右栏的信息数量、区域面积 与左栏比较 差异很大，右栏在视觉上的比重很轻。
• UCD china是一个三栏网站，从信息数量和区域面积上（信息价值这个我就不好判定了），左边和右边是份量相当的。 和google 左重右轻的特点 没有可比性。
• 所以UCDchina 这样的留白处理会在视觉上造成不适，而google不会。

7 从功能布局特点上：

• 搜索结果页面要求便于集中快速查询，所有功能和内容都集中在单栏就可以完成。
  右栏的广告 在功能性，使用价值 与左栏都没有可比性。
• 而UCDchina 左侧两栏是主要信息区。右栏是辅助索引和操作区，其中包含了：全站检索，内容发布入口，登录，订阅这4个网站中最重要的操作区域。
• 所以UCDchina 这样的留白处理会严重阻断用户操作的连续和流畅性，而google没有这个问题。

8 体现页面中视觉重心，引导用户视觉轨迹的方法有上百种。
强迫用户去看什么， 把你想给用户展现的和用户需要用到的区域之间划上一条银河显然不是个好主意。

用户体验正成为一块用来随时砸向别人的理论砖头。但同时，大部分人对这个概念摸不着头脑。更多人把用户体验与可用性、UCD混为一谈。用户体验在国外的定义指的是一个用户使用一个产品过程中时的全部体验，包括他们的印象和感觉，能够忍受的问题，疑惑和BUG的程度。用户体验的概念的提出实际是体现在开发观念和设计立场上。可用性只是设计良好用户体验中的一个原则，并且不是绝对优先原则。而UCD（以用户为中心）同样只是立场之一，而且也不是绝对立场。

当可用性与视觉感官、运行效率、实现成本冲突时，怎样选择？
当UCD与商业需求、设计约束、技术约束冲突时、怎样选择？

用户具有个体差异，使用体验又是主观心理过程。每一个产品的目标用户可能多样化、群体界线不明确，其共性难以把握。这一切让用户体验的成为一个没有“绝对”没有所谓对错的世界。

像腾讯的mini新闻推荐弹出框那样，点击推荐位上某个图片，进入的不是新闻的内容页面，而是有着更多花花绿绿图片的二级频道页。这样做好不好，从可用性角度肯定是不好的。简直等同欺骗用户。但从商业利益角度是好的，可以得到赢得更多PV。

这之间怎么平衡？把引导用户进来的目标内容放在频道页的第一屏容易找到的位置，同时使用_blank弹出。这样用户不会浪费更多时间就能很快找到目标内容，也愿意回头顺便看看其它内容。

用户体验的真正价值所在不光是让用户用的舒服，更重要的是一种引导。当用户在浏览某一篇内容，还有其它哪些内容值得向用户推荐；当用户使用某一功能时，还会有兴趣使用其它哪些功能。在有社区性质的网站中，如何让用户在使用过程中结识到更多他可能希望认识的人。

引导的用途除了让用户在网站多点击多停留，还有让陌生用户快速对网站形成正确认识，帮助用户找到有效的内容和功能，帮助用户顺利完成任务流程，激发用户活跃度等。。。

深度挖掘这些关联元素，引导用户更多得使用你的产品，（在web项目中，用户越多的使用就代表着更多的商业价值）比单纯把产品做得“好看”“好用”要难得多。这种关联性往往在底层逻辑设计和产品结构设计阶段就要考虑到。关联的逻辑和算法如何保证快速、高效和安全，关联的结果是否真正符合用户习惯和期望的内容。关联的表现方式和频率如何在无形中完成引导，而不影响用户的目标与使用，更不能让用户觉得厌烦。

当然不是说推荐像腾讯那么干。腾讯那样并不是一种高明的引导手法，和标题党一样，带有中国资讯站惯用的流氓气味。

实现引导的手法有很多种：
1、 通过关联性或推荐性内容引导
2、 流程引导
3、 用户行为过程或结果中产生引导
4、 提示页面中产生引导
5、 视觉吸引产生引导
6、 细节处理中完成引导
……

______________________________________________

1、通过关联性或推荐性内容引导
这是最传统也最普遍的做法。内容站时期是使用编辑添加的关键字或者系统分词来关联到“相关阅读”

用户贡献内容时期关键字换成了TAG，但很少有站点用好过。TAG作为一种单层的信息分类分类方法，由用户来添加和收藏。对其用户行为的记录是产生推荐性内容的数据分析来源。有效的个性化的推荐，配上
“你有可能会感兴趣的**”（内容）
“和你志趣相投的**”（用户）
“我们认为这个适合你”（商品）
“你可以试试**”（功能）
这l类有诱惑性的语言，用以刺激用户产生连续性点击行为。

TAG的优势在于灵活，弱点也在于灵活。
网状的信息组织结构容易松散(难以查找难以分类难以建立层次)，
用户的添加随意（直接把标题复制进tag，再打两个空格，不少人干过。。。），
难以用规范约束（照片和photo同时存在），
热门tag的关联有效性差（美女、互联网这种标签有什么用）。

另一种定义上的推荐是通过投票或某种排序将有价值信息过滤出来（Digi），这个适用于有针对性内容或用户群的网站/频道。

这种传统的做法虽然普遍，但是要用得好并不容易，需要在全站的信息架构、内容需求关系上有全局把握能力。

2 、流程引导
这种引导方法多出现在功能性网站中。比如在首页或者登录页、欢迎页这种新用户最常进入网站的地方。

常见的手法有用鲜明的图示给出一个流程或任务示意：（如图）

或者 “从这里开始” “新手试用” “随便看看”这类相关按钮或链接

————————————————————————————————————————

3、用户行为过程或结果中产生引导
在用户使用网站的行为过程中给予相关流程的提示或相关操作的链接。当用户的行为产生结果时，根据结果给予用户相关的建议或判断。

比如右图当用户注册登录完毕，在应该显示好友列表的地方，新用户的好友数量是0。如果就显示空白列表，或者一个无关痛痒的默认好友，（有多少人喜欢那个默认好友呢）岂不是大大的浪费浪费。引导新用户交朋友或者进行邀请：（如图）
当用户没有完善个人资料，未填写居住地时，在显示页面中不要出现空白或者无，刺激用户去完善填写吧：（如图）
在用户列表页、检索结果页这类有可能得不到有效结果的地方引导到相关功能，也是对新功能进行推广好办法：（如图）
在需要用户贡献内容的地方，如果并无内容，也不要省懒显示空白，多加一个判断，可以引导用户进行内容补充。这类的应用完全可以举一反三：（如图）

————————————————————————————————————————

4、 提示页面中产生引导

不少产品设计人员总是在首页频道页等重要一级页面寸土必争，精打细算，却在许多看起来不太重要的流程页面大肆浪费。

这些页面包括登录页、退出页、提交返回页、提示错误页、帮助页、检索无结果页。。。等等等等。

想想你们是不是草草就把这些页面丢给技术人员去处理，“随便打几个字就行了”“按常规做法做吧”！ 别忘了，这些在用户最容易觉得沮丧、无助、迷惑的时候，给予正确的引导、帮助和建议。一个精心规划的提示页面往往可以影响用户选择关闭窗口还是发生一串连续点击。

“按照你设置的检索条件在**网站没有查找到任何结果，何不调整搜索条件试试我们的高级检索！ 在页面下方再次检索”

“你的上传成功了，点击此处去我的相册。或者看看别人的最新更新的相册?”

“你的在线聊天请求被驳回了，没关系，点击此处来看看其它在线MM。现在有12045个有缘人正在等候你的邀请。”

————————————————————————————————————————

5、 视觉吸引产生引导
视觉吸引产生的引导有三种做法，一种是根据页面布局在用户的视觉轨迹中发生引导作用，一种是通过页面结构影响用户的视觉重心完成引导行为；一种是通过鲜明的颜色、漂亮的样式、动画等吸引用户的注意力。

在导航中想着重推出的频道：（如图）
出现在vip用户展示列表中的大按钮，点下去进入付费业务的介绍：（如图）

_____________________________________________

6、 细节处理中完成引导

细节的引导处理就要看项目的具体需求了，精心设计产品中的各个角落，每一个细节的布局都会在无形中完善用户的任务心理模型，处处埋下“商机”，并为网站增加有价值的点击。

引导用户使用诚信级别验证的功能：（如图）
老奸巨滑的阿里巴巴永远为竞价排名商户留出的“第一页：

好了，举了那么多例子，相信大家可以在实际开发工作中举一反三。但引导用户这件事不光是停留在几个链接几个按钮的处理上的，最重要的引导还是体现在产品结构的设计中。没有对产品和商业需求的良好把握，没有整站结构打好基础，几个链接是解决不了问题的。

而这就需要产品设计师们去真正用心思考产品，理解你的产品的优势、资源、竞争环境。和战略部门多沟通吧。

————————————————————————————————————————

最后回到开题的UCD立场：

UCD并不等同于讨好用户。用户体验不能做得被动。产品诞生的目的永远为了满足是商业需求。用户是服务对象，值得尊重但不是被牵着鼻子走。看见过哪个服务业公司是被客服部门牵着走么？

遇到类似UCD和商业需求有冲突的时候，解决方法是要视项目和产品具体情况的不同而定的，可以取舍，可以曲线救国。综合考虑，在产品、内容、商业利益和开发成本之间把握平衡。但更多的时候我们可以在最初的产品设计中考虑避免冲突，而对用户的引导就是一直比较艺术和隐含的兼顾之策。