50%的用户选择了明亮的网站。有趣的是很多选择深色或者白色网站的用户是出于一些与设计无关的原因。比如一个用户认为Dropbox是最印象深刻的因为她已经有了Dropbox账号。 文字的主要目的是帮助用户去做你需要让他们做的事情——不管是探索产品,学习如何玩一个游戏,还是浏览一些令人愉快的故事。 遗憾的是,在网站和应用排版中有很多相互矛盾的选项,并且没有一个适用于所有情况的严格规则(否则事情也太简单了吧)。但是你可以做一些事情,以保证你为网站或应用选择的字体对你和你的用户有所帮助,而不是跟你唱反调。 字号与行长 文字的尺寸和布局会对在线阅读的体验带来巨大影响。年龄较大的人或者有视力障碍的人在面对小字的时候尤其痛苦。即使是视力正常的人盯着屏幕太久后也会觉得疲劳——当他们为了阅读不得不斜视或者放大时会感到激怒。 看看下面这个例子:对于台式机来说,正文较好的处理方式是每行50-75个字符,字号不低于16pt。
对比下面这个页面,每行有100个字符,并且字体更小。
这个问题在手机上有所延伸。对用户来说在一个小的明亮的屏幕上阅读是一件很头疼的事情。比较好的做法是在手机上每行显示30-40个字符。下面是在智能手机上看到的两个网站,第一个使用了30-40个字符,而第二个使用了为台式机设计的网站上的尺寸。
因为写死的字号(比如,16px)在不同的设备上显示效果不同,所以试着使用rem单位去定义字号(译注:rem是CSS3引入的字体大小单位,是指相对于根元素的字体大小,便于实现响应式设计)。 文本的颜色对比度 关于文本颜色和可读性,有两种不同意见: 一种认为高对比度更好,白底黑字是最具有可读性的组合; 另一种认为太大的对比度反而难以阅读,使用灰色阴影更好。 应用多少对比度需要微妙的平衡。因为屏幕之间的差异太大,在设计师的屏幕上显得足够深的灰色在用户的屏幕上可能更淡。 在手机上有足够的对比度尤其重要,因为用户可能需要在户外或者明亮的地方使用。 W3C网站内容可及性指南是一个不错的开始。他们设定了最小对比度的标准,保证适度低视力的用户能够阅读你的文本。你可以使用一个对比率工具快速找到你设定的对比度是否在合适范围中。 但是纯黑的文本(#000000)对于诵读困难者来说更难以阅读,并且经过长时间阅读后会导致眼睛疲劳。 很多设计师选择使用非常深的灰色或者实际的黑色(而不是纯黑),比如#0D0D0D,#0F0F0F,或者#141414。 一旦你选择了颜色,让真实用户在自然环境中使用任何你能想到的设备试用是绝对需要的。如果任何测试用户在阅读你的文本时遇到了麻烦,那么有理由相信你的客户正在遭遇相同的问题。 我们的研究结果:衬线与非衬线 在传统的印刷排版中有个常识,衬线字体可以通过在水平方向上温和地引领视线而提高可读性和阅读速度。 但是关于这两种字体的实际区别的研究结果非常不确定。我们需要自己做试验,所以我们做了一个研究,让30个用户阅读两个除了字体之外完全相同的页面(A使用的是Arial,B使用的是Times New Roman),并测量阅读时间和理解程度。 我们得出的结果同样是难下定论的。 阅读非衬线字体页面的用户平均阅读速度高了9%,但是差异没有达到统计显著水平。并且,用户的理解率也非常接近:阅读衬线字体页面的用户的理解分数高了1%,同样也是不显著的。 唯一值得注意的区别是阅读衬线字体的用户抱怨的次数是另一组的两倍(表示段落很难阅读的用户在衬线字体组和非衬线字体组分别是6人和3人)。 所以衬线字体有什么问题呢? 首先,衬线改变了每个字母的轮廓,所以它们对有诵读困难症或视力障碍的人来说更难识别。 (责任编辑:本港台直播) |