以用户为中心的设计

对网页宽度设计的问题应如何讨论?

作者:JunChen  |   发布: (网友)稻草   |   时间:2009-04-07 03:21:10 文字大小:- +

网页多宽才合适这个话题上,白鸦一开始就抛出了650这样一个数字。后来我在 GR 里面分享的时候写:【其实 650 是不准确的...或者说不够严谨。与显示器尺寸、DPI 有关。用字数也不行,与字的大小也有关。】

关于这个严谨不严谨的问题,后来在 Gtalk 上与鸦又更详细的讨论了一番。分享知识,整理如下。

1、Web 排版设计上,没有一个单位(指CSS长度单位)是可靠的。哪怕在CSS中理想化的分成了相对长度单位和绝对长度单位。所有单位(非像素单位通过 DPI,或者更准确的说是 PPI)均被转化为像素。像素为什么不可靠?14.1寸4:3显示器,1024分辨率下每 100 像素物理宽度约为 27.98mm,1400分辨率下每 100 像素物理宽度约为 20.47mm。这里的实际宽度指的是用尺子量出来的宽度。

2、讨论这个话题的时候,应该从视角、视距(眼睛与显示屏的距离)出发,得出最佳物理宽度。然后再从用户群的显示器尺寸和分辨率设定上,去换算为像素。但是,在这个显示器尺寸、分辨率百花齐放的年代,用物理宽度是最佳的。

3、人因工程上说人眼专注阅读的视角是 25 度(约为正常视角的 1/5),距离显示器 45-50cm。通过计算可以得到物理宽度为 19.95cm-22.17cm。约等于一把尺子的长度。于是再换算到显示器上(仍按 17 寸 1024×768 分辨率,横向物理宽度是 34.544cm),就可以得到 591-657px 这个数字。取整之后,可以认为是590-660px 这个区间。但前提仍然是 17 寸 1024×768 分辨率。

最后,还有字号大小的问题,这个比较难,因为需要考虑到在 45-50cm 这个视距下,最佳的笔画物理粗细。

另外提醒下这里讨论的是专注阅读的内容宽度。扫视又是另外一种情况,但应当也可以用人因工程(Human Factors)来解释。

PS. 以前常用每100像素物理宽度为多少来面试设计师。

更多
打印  |  相关话题:屏幕分辨率和布局   |  类别:信息和交互   |  源地址

UCDChina的书

《UCD火花集2》封面
UCDChina编著,定价35元
从卓越网购买 从当当网购买

《UCD火花集》封面
UCDChina编著,定价25元
从卓越网购买 从当当网购买

《应需而变——设计的力量》封面
UCDChina团队成员JunChen译,定价29元
从卓越网购买 从当当网购买

《网页设计解析》封面
UCDChina团队成员周陟著,定价62元
从卓越网购买 从当当网购买

《赢在用户》封面
UCDChina团队成员Angela译,定价29元
从卓越网购买 从当当网购买

《用户体验的要素》封面
UCDChina团队成员Angela译,定价25元
从卓越网购买 从当当网购买