【设汇主义】设计师的责任:以阅读体验为中心的排版指南

发表于 讨论求助 2022-03-10 10:45:38

随着网页字体和收费低廉的网页字体库的兴起,排版(typography)重新获得了举足轻重的地位,成为任何平面设计和网页设计中最重要的内容之一。

与此同时,非常多的设计师对排版的认识依然只停留在审美层面。我们习惯把排版(typography)与字体(lettering)混为一谈。事实上它们并不是一回事。只要浏览一下Dribbble网站中的“版式” 标签下的内容就知道这种误解有多严重了。

设计优美的字体给人的享受是无穷的,它同样也会影响对我们对排版的直观感受,因为排版和字体在视觉设计方面有很多相似之处。但如果设计师把所有心思都放在“哪款字体最精美”上,他很可能会忽略字体的实用功能以及它作为一种灵活而有用的设计手段的本质。

不止如此,我们还常常迫不及待地尝试最新的Open Type字体,以及用自由合体字来美化字体,或使用不完善的CSS连字符等, 一番折腾后,你用充满敬畏的目光打量着自己的新杰作,却不曾意识到除了对字体充满狂热的极客外,没有几个人会真的如此在意字体。然后说不定我们会忽然回到现实,认识到文本首先必须要保证能被一个正常人在不同的设备上浏览,无论浏览者的设备是最新款的Retina屏电脑,是Windows XP支持的极低分辨率显示器,还是具有测量血压功能的新概念智能手机。

“好字体并不是纯粹为了满足字体狂人的需要而存在的。它的主要目的是提供良好的阅读体验。”
– Oliver Reichenstein


目前绝大多数网页上的文本都是为即时阅读而预设的。互联网的本质特征之一就是信息的快速交换,它与读者的快速阅读习惯是相适应的。用户使用网站和App的主要目的是寻求有用的信息,而不是为了体验优美字体带来的愉悦感。别误会我的意思:我本人也常常被字体别致的标题所吸引,但同时,我们也不能忽视整体排版的功能性和正文文本的辨识度。

现在,我们就来深入探讨一下这个问题吧!

要事优先:关于项目研究


只有当字体和文本的辨识度都尊重用户的阅读体验时,用户毫不费力地读取信息才会成为可能。正如在其他类型的设计项目中一样,在开始实际项目之前有必要进行项目研究。培养做项目研究的习惯不仅有助于我们获得更有价值的信息,更重要的是能让我们习惯以客户的眼光看待问题,而不只是从自己的思维出发(我自己也时刻在与“自我”这个最重要的敌人作斗争)。

你或许早已熟知,在与数字技术有关的设计中,主要有内容,环境和用户.三个因素,甚至可以说任何设计中都包含这三个因素。如果我们能分别对与这三种因素有关的排版问题做一番考察,也许能获得一些具体的分析方法和有用的启示,而这些方法和启示将能帮助我们从整体上提升排版和字体带给用户的阅读体验。

内容与排版

设计排版时第一件要做的事就是阅读要处理的内容。当然,每一个设计师大概都知道这些内容的目标读者是谁,也知道这些内容的字面意义。但除了理解文本的性质和结构之外,我们还应当考虑它的难易程度,用户的阅读时间,阅读目的和文本的时效性。

覆盖所有排版元素

阅读要处理的文本的同时,要留意它的组织结构和包含的元素并记录下来。可以利用你记下的这些要点来草拟一份简单的项目风格指南。文本中除了最基本的元素如段落,标题和编辑类项目(editorial accessories)之外,还有其他一些元素需要你特别注意,例如重点文本,引用的文本,引用文本中的重点文本等,还有在今日的文本中占重要分量的表格和配图(figure captions)。理想的排版应该有与所有这些元素相匹配的不同字体。

在纯超文本中,你的排版还应覆盖所有HTML元素。你甚至应该创建一个HTML范本和一个包含所有要处理元素及处理规则的CSS文件,并将它命名为Project-Typography.html。它将会成为你的排版设计的基础,当你设计响应式断点(breakpoints)时,你就能看到它的功用。

估算阅读时间

用户的阅读时间各不相同,从低于每分钟100单词到每分钟近千单词都有可能。成年人的平均阅读速度在200-500单词/分之间。因此以250单词为单位划分文本,我们很容易就能计算出一篇文本大概所需的阅读时间。如果你能得到要处理的文本,只需将安装一款内容管理系统(CMS),将文本置于其中便可测出所需的阅读时间。

估算阅读时间的好处是能让我们根据用户阅读的速度来确定适合的行间距和段间距。如果所需的阅读时间很长的话,我们可以把文本分成更小的部分,或更简单一些,在关键点使用节选引文(pull quote)。

评估文本的阅读难度


许多阅读难度测试工具都能测试出阅读文本需要具备的文化程度,此类数据对设计师是有用的。例如,如果文本难度系数偏高,可以通过使用编辑类提示或增加脚注数量等方式来改善用户的阅读体验。

如果你的工作是和文本撰稿人共同来调整内容和排版,这类测试工具将有助于你们比较不同版本的文本的优劣。此类测试工具中比较典型的是Automated Readability Index(ARI)。API会重点测试文本中的字符数,单词书和句数,对实时监控比较有用。而Flesch–Kincaid Grade Level测试则更注重音节而不是字符,因此更适合用于实时评估。

另一个有效的测试工具是Flesch Reading Ease。它依据单词,句子和音节等综合做出判断。你可以根据得出的分数判断内容文本的难度。除英语之外的其他主要语言都有类似的测试工具。有些设计师可能并不熟悉此类软件,事实上教科书出版商和一些政府机构很早前就开始使用这类工具来评估内容文本在各类程度不同的读者中的接受难度。

采用手动方式测试文本的的适读性( reading ease )异常费时费力,因此我建议你直接使用Article Readability Stats这款软件, 这是Creative Nights团队开发出的PHP文本。

内容策略,信息架构和微观文本

如果我们能暂时放下排版问题,了解一下内容策略(主要指内容的策划,管理和编辑和信息架构 (主要指对内容的组织和描述)等概念, 我们或许会得到一些别的启示。

如果我们考虑一下文本的“时效性”的话,大概就不会那么急着在字体中体现最新的设计潮流了。这样,当下次使用这个文本时,也能避免编辑先生因为文本未做任何重新设计而对我们大发脾气。

类别标签--这是信息架构中的典型概念---可能会让网页设计师觉得十分棘手,因为导航条或列(column)之间的空间十分有限。我敢说任何一位网页设计师在自己的职业生涯中都有过试图以减短类别标签名称或对其重命名的方式来更有效地利用空间的经历。当然,我们尽可以采用更小或更密集的字体,但如果这些手段都不奏效的话,我们剩下的唯一的办法就是向负责文本架构的同事求救了。

因此除了正文之外,我们还必须考虑类别标签,指示性文本,小字说明,互动内容(如按钮和链接)及其他特殊文本。所有这些文本中的细节都被统称为微观文本(microcopy),它们也对网页文本的整体互动性有重要的影响。

文本环境与排版

随着网页设计标准的不断发展,网页设计表现出越来越明显的“趋同性”。虽然不同类型的项目还存在较大差异,但至少我们可以看到,智能手机的在功能上已经表现出很强的一致性了。

我们也同样知道,平板设备已经被普遍地用于展示,刷Twitter和在上厕所时浏览网页了(任何忽视这个事实的设计师都没有真正理解用户的需求)。下一代笔记本电脑的屏幕已经把96-DPI,30英寸宽的台式机显示器远远甩在了后面。然而,在我们赞赏网页设计的标准化的同时,却不能忽视不同用户和设备背后的多样性。

软件问题

如果是hint得很好的字体,在微软系统中应用Clear Type引擎时会有很好的显示效果。问题是hinting的过程很费时间,网页字体有的还是不很完美。因此,你应当把针对Windows系统下浏览器的字体测试工作当成是例行任务来完成。




这些截屏图中,Verdana, Proxima Nova, Arial, Adelle Sans and Georgia等字体均为16像素 (只有Proxima是18 像素)。截屏图均采集自Windows7支持的Firefox 18 浏览器。Proxima 和Adelle被渲染为网页字体。其余字体常被预装于各种OS中。截图中最上面5行字是在 未启用Clear Type引擎的模式下采集的。




同样需要设计师注意的一点是,不同的网页字体库提供的字体在质量上会有所不同。同一种字体,出自这家字库可能有很好的显示效果,而另外的字库就可能达不到要求。其主要原因通常是因为该字库的设计师没有花足够的时间去做hinting,或是因为他们的技术水平不高。

幸运的是,从总体上讲,各个字库提供的字体质量还是在不断提高。由于维护和调整字体需要花费很多精力,我建议直接付费购买字体,这样起码能为你在hinting上省去很多麻烦。而且,需求越大,就越能促使字体库的质量更快地提升。

如果你在你的项目中,Windows用户占有很重要的位置,那么可以考虑使用手工hint的字体,如LucasFonts开发的TheSans Office或其他为office应用而开发的一系列字体(这类字体的名称中通常都含有“Com,” “Offc” 或“Office”之类的字眼)。如果你觉得不值得为使用Windows较老版本的用户如此折腾,那最好在久经考验的Arial, Georgia or Verdana中选用一种。

如果你想深入了解字体渲染的问题,还可以参考这篇文章A Closer Look at Font Rendering。

硬件问题

像素密集度分布不均的问题是整个设计行业普遍存在的问题,排版这一领域自然也无法幸免。一个有意思的解决方案是将渐变字体做镶嵌入处理,与出版业中的平面设计师利用渐变字体更精确地控制油墨在纸上的显示效果的方式类似。如果你想详细了解这种方法,可以读一下这篇文章New Site With Responsive Typography。



即使是在同一家厂商的设备上,字符的渲染效果也不尽相同。这里展示的是像素设置为16的Adelle字体分别在n iPhone 3G, iPad 3和 iPhone 4S屏幕上的渲染效果,图片来自网页截屏并用PS做了放大处理。


另一个硬件影响排版的例子是为电子广告屏和电视屏幕设计排版,这些情况中,通常要使用更大的字号和更高的对比度。因此你可能会直接越过两个级别的字号,将普通样式的字体与特大号字体混合使用。仅仅在自己的台式机或Retina屏笔记本上预览显示效果是远远不够的,就像为移动设备设计排版时一样,在这些情况下你也必须在硬件上实测字体。

硬件类型

硬件和软件之外,另一个重要的环境类型就是交互方式。举例来说,在以设数字备为载体,以内容为中心的客户端,杂志,小说和教材中,句子之间的结构应该是清晰而紧凑的,这些文本的阅读路径通常是线性的。

而在同样以内容为中心的网站(包括所谓的小众网站)中,情况就更为多样,并且为了让读者更好地理解文本,网站一般都会以简洁的方式呈现信息。受到时效性的限制,App上信息的呈现方式更为直接,通常只有基本的要素和事实。项目和信息常以并列的形式出现。与线性文本中的句子不同,并列的“信息点”可以被用户不依靠上下文单独地理解,因此用户自由选择信息的程度更高。我们可以很确定地指出,App用户在阅读文本时采用的一定是随机的,非线性的,在不同信息点之间随意转换的阅读方式。

App环境下的文本内容也是最容易预测的。App用户典型的阅读行为包括:用平板设备分析网页数据和图表。编辑即时文本。通过站内信息查看自己是否中了彩票等等。

用户与排版


在互联网时代,每个人都是你的目标客户,在建设多语种网页时尤其应理解这一点。但假如仅仅是英文的“Return”都占了一个按钮的许多空间,哪里还有位置留给“Retour”(法语),“Zurück”(德语), “Povratak”(克罗地亚语),或是 “Visszatérés”(匈牙利语) 呢?

阅读障碍的问题


阅读障碍(Dyslexia)指的是一种无法正常阅读的病症。在阅读障碍症患者的大脑中,可能会把字符辨认成图像,或者把正写字母看成是反写的。一个反写的小写字母a,在阅读障碍者的眼中与斜体e没有区别。

由于拉丁字母字形的近似性,阅读障碍患者很难辨清设计师做出的不同字体。这并不是说我们必须的单独为此类认识设计一种字体,而是说,在设计字体时,设计师应该对此有所了解。

而且不止如此,据研究,每四例阅读障碍症 患者中都有一人存在注意力混乱的问题。




加粗处理为的是更明显地突出每个字母的特点。示例字体为Futura 和Open Dyslexic(一款针对阅读困难症患者设计的字体—译注)。




由于红,绿,蓝三种像素的综合作用,才能使字体正常地在屏幕上显示。不幸的是,在男性人口中,有一部分人眼中的字体较正常人看到的更为锐利或模糊,因为他们没有辨认红色色素的能力。你可以利用Color Oracle之类的软件来测试你设计的字体在色弱人群眼中看起来是什么样子。




色弱人群难以辨认字体的反锯齿(anti-aliased)特性。




功能大于形式

与一般流行的观念相反,我认为对优美的字体敏感并不是一种了不起的天赋。当然,拥有天赋会让你在事业开始时更占优势,但也仅此而已。你更应该学习的是了解你要做的项目以及如何挑选最合适的字体,这样才能使你的目光更精准。

谈一点题外话。许多设计教程和“how-to”类的书籍都教导说应该根据“设计风格”和视觉效果来选择合适的字体。而事实上,设计出特定的风格,唤起用户的感情和与众不同的视觉特色主要是图形设计师和UI设计师的职责。而一个排版或字体设计师应采用不同的角度,他设计的起点应该是项目的实际需求和目的,他应该有功利主义者的目光。当然,要确保一个项目的成功,这两种态度都不可缺少。

由于每个项目都有自己特定的目的,我们挑选字体时一定要结合各个项目的实际,像“优美”,“漂亮”之类的形容词,如果不放在具体的项目中考察,可以说并无多少意义。一种字体也只能放在项目环境中评判才有意义。如果单独地评价一款字体,我们只能从严格的技术意义层面来做判断。

有次我看到一封幼儿园的邀请函上使用的是Comic Sans字体,我忍不住翻了个白眼。但在某种意义上,我必须承认它在那种场合下不失为一种合适的字体---毕竟它的对象是我的儿子和他的小伙伴们---当然我不会同意随处都使用这种字体。假如我看到Comic Sans 字体出现在公司的会议记录中,我可能就要发火了。

SERIF 对SANS:谁挑起了它们的战争?

相信许多字体设计师都曾在衬线字体(serif)和无衬线字体( sans-serif )之间犹豫不决。正如我前面说过的,选择哪种字体应该根据具体环境决定,而不能仅凭设计师或客户的个人喜好。事实上,两种字体在辨识度方面没有差别,尤其是在屏幕高度密集的今天。

有时确实选用某种字体比较合适,这就需要我们花些功夫研究一下文本,进而做出正确的判断。例如,如果我们要呈现的是纵向定位的内容(例如一组汇率表或产品价格单),选用无衬线字体更为合适,因为衬线有强化水平感的作用。相反的,由于在平行文本中衬线能加强水平感,在要呈现线性的内容或文本中没有纵向定位的内容时,衬线字体就能发挥更大的优势。

这些道理很多设计师都懂,但在实际项目中,我们却常常做不到退后几步,从整体上把握问题。我很欣赏 Vitaly Friedman和Elliot Jay Stocks决定将sans serif字体用于 Smashing杂志网站正文的理由。 在仔细从整体上研究了页面布局和互动元素之后,他们总结道:

"Smashing杂志网站充斥着各类视觉元素,如截屏,按钮和动态广告等等---而sans-serif字体能给人一种理性,严谨之感。"
– Vitaly Friedman & Elliot Jay Stocks

测试单个字母

对字体辨识度的另一项重要测试就是在同一种字体下测试单个字母的差异。设计师通常用全字母句段(pangrams)或特殊字段来对单个字母进行测试。比较著名的例子有“The quick brown fox jumps over the lazy dog,” “Handgloves”和“Hamburgefonstiv”等。

而Jon Tan开发的aegh! iIl1 0O句段功能更多。它不仅能让设计师直观地判断一种字体的显示效果,还能显示出“i,” “I,” “l” “1” 及 “0” 和 “O”的不同特征。
我们甚至能把斜体,小型大写字母和数字都纳入此类测试工具中。例如,我们可以在测试串中假如斜体的e,以测试它与是否与反写的字母a太过形似,在细节更模糊的小字号文本中这项测试更为必要




避免使用没有特点的字型。从上至下:Top to bottom: League Gothic, Gill Sans, Myriad Pro, Neue Helvetica.




外文字体设计

设计字体时还必须考虑国际用户。如果你要面对的是一个百分百的外文网站(如阿拉伯语或越南语网站),你可能需要一个当地设计师对你进行一对一辅导。多数网页设计师都会为国际用户保留创建个人资料的选项,所以字体设计师既要确保他使用的所有字符都能与网页兼容,也要确保他设计的字体能在英语和西班牙语之外的文字中正常显示。每种语言都有自己特定的字符组合方式。例如,在匈牙利语和一些东欧语言中中,“gy”或“ij”的组合十分常见,更不用说二合字母(digraphs) (“ch,” “dž,” “ij,” “lj” and “ty”) 和三合字母(trigraphs)了(“dzs” and “sch”), which are usually represented with two and three separate glyphs, respectively。

同样奇怪的是在意大利语中,字母“k,” “j,” “w,” “x” and “y”仅仅只在外来词中使用, 其中有的还只能用于口语中—例如, 将“k”表示加强语气的“c”时 — 至少我在意大利旅行时听说的就是这样。这样导致的结果就是意大利语中常常有“cc,” “ll,” “tt” 或“zz” 这样的字母组合,当它们与“o” or “i相邻的时候,调整字间距就变得有些棘手。


在南欧语言中,姓氏常以字母“č”或“ć结束,如果在设计字体时图方便把变音符省去,或更糟糕一点,直接使用fallback字体,可能就会引起用户的反感。丹麦语和挪威语中存在字符“ø”,德语中有“ß”--这还仅仅是在拉丁字母体系内。




了解目标语言中的特殊字符和字符组合




为了更好地应对这些英语之外的变体拉丁字母,最好选用一种涵盖所有中欧语言字符的字体(如使用付费字体)。如果设计师要处理上面提到的在某些语言中的特殊字符组合,则选择一种专门针对此语言的字体也不失为一种办法,因为在目前的条件下,用CSS来hint字体仍然很难实现。

熟悉的字体与陌生的字体

研究指出人们用自己熟悉的字体阅读时有最好的阅读体验 (PDF, 11.5 MB)。即便是像Zuzana Licko和Erik Spiekermann这样的专家也支持这种观点。所以在选用一种字体之前,应了解一下它的历史并将它与目标用户习惯的字体做个比较。

Skolar是David Brezina设计的一款字体,它是针对学术刊物和多语种出版物而设计的,这也是 Times New Roman字体应用最广泛的领域。Skolar是一种新生字体,但它在特性和字形上与Times New Roman很接近,因此也易于被原来熟悉Times New Roman的用户群所接受。这不失为一种有效的策略,但为了争取目标用户的认同,最好多做些不同的尝试。




Skolar 字体与Times and Times New Roman字体。你能辨认的出两种times字体的不同之处吗?




由Connor Diemand-Yauman, Daniel M. Oppenheimer和Erikka B. Vaughan撰写的一份名为“不流畅语流对教育的积极影响(Effects of Disfluency on Educational Outcomes)”的研究报告 (PDF, 1.3 MB) 指出,与用户熟悉的字体相比,用户反而更容易记住陌生的,不易辨认的字体。该报告认为“不流畅语流”会激发大脑的处理能力,其结果是让用户的记忆力比平时更强。这并不意味着设计师应该选用最奇怪的字体,但这提示我们,使用与流行字体不同的字体也是一种选择。

响应式设计时代的字体显示

在网页设计领域,Condensed gothics,grotesques以及其他装饰性字体有重新兴起之势。它们具备不同的风格和字号,用于需要吸引眼球的报刊标题中和充当较长文本的分隔符尤其适宜。我不想在这篇文章中过多地探讨字体风格,因为现今网页中的标题字体很多都是为了服务SEO营销,以吸引最多的用户为目的,这与实体出版业中的标题设计有所不同。然而,我们有必要了解在充满变动的网页环境中,将密集型字体用作标题的潜在风险。

如果不注意各种设备显示屏的差异和长宽比,在包含多个单词的标题中使用“skyline”类型的字体,或许还可以与横屏和桌面端设备兼容。但在智能手机以竖屏模式显示时,这种字体就会占用过大的纵向空间,尤其是当单行的标题在设备上以双行显示时。这个问题固然可以通过压缩字体的大小来部分解决,但其显示效果毕竟远不如在桌面端上表现得那么好。
相反的情况也同样存在。如果我们优先考虑字体在移动设备上的设计,那么可能出现这样的后果:在小屏幕上显示完美的大字号字体,在桌面端显示时就会变得过大。

在优先考虑纵向阅读环境的案例中,一个更可行的方案是选择一种小字号的宽松型(extended)字体作为密集型字体的补充。这样,即使当宽松型字体在某些设备上显得太小时,也能够用密集型的字体来替补它。




以League Gothic字体展示的单行标题在移动设备上几乎无法辨认。在设成多行标题的情况下又会占用过多的纵向空间。






Nimbus Sans密集型字体与Nimbus Sans 宽松型字体的显示效果对比




字体的混合使用

混合字体主要是为了在设计中创造紧凑和生动的效果。然而在大多数情况下,一旦读者开始阅读之后,他们更注重的是句段的结构和排列方式,而不是字体设计的美感。在字体设计的细节无法完美显示的低分辨率屏幕上,这种情况表现得更为突出。请认真思考我的建议,如果不是绝对必要,请别一次使用太多字体。

另一个避免把排版搞得一团糟的经验之谈是,尽可能使用x-高度一致的字体。对字号相同的字体进行x-高度的比较,能很清楚地看出不同类型的字体是否适合放在一起使用。挑选合适的网页字体需要耐心,更需要细心。如果字体的x-高度互不匹配的话,即便能通过将不同大小的字母置于同样的基线上来部分地改善,但想要达到满意的效果却十分困难。




Aller 字体与Minion Pro, Georgia和Adelle字体的混合使用效果。请注意为何图中的Minion Pro 和Georgia字体格外需要调整行高。




一个稳妥的办法


混合使用字体最简便的办法莫过于从字体的关系和我们所熟悉的常识入手。一种字体即使一套系统,它包含的子类别可以按照一定的标准(如字号,字宽等)于其他字体系统自由组合,所以如果我们选用属于同一个系统的字体就能省去很多麻烦。不妨试试那些字型丰富的大型或超大型字体系统,这些系统不仅有基本样式的字体,通常还包括常规,斜体,加粗,加粗斜体等不同变体字型。而超大型字体系统除了以上这些之外,一般还包括衬线字体及与其对应的非衬线字体,用于文本显示的字体甚至是渐变字体。

不要太在意这些字体的分类标签,因为不同的字库使用标签的方式也有所不同。而且大型字体系统与超大型字体系统的界限也不是那么泾渭分明。例如,有些字库中衬线字体和无衬线字体有多种字号可供选择,但字宽的选择却很少。尽管很多字体系统的基本字体样式都很有限,但由于它们有很多的变体,基本上也能满足我们排版时的需要了。如果你对如何混合使用字体感到头疼,从一套字体样式丰富的字体系统开始永远是一个稳妥的方法。




JAF Bernino Sans字体在字号和字宽上有多种变体形式。灰色的字体是伪斜体(fake italics),又被称为slanted romans。某些浏览器勉强可以用CSS把字体显示成伪斜体,但在版设设计中,伪斜体被视为是一种罪恶




同一个设计师设计的字体组合也起来很方便,由于拥有共同的DNA,它们在比例,字形,笔触等方面常常具有共同的特性。我特别推荐Jos Buivenga, Veronika Burian, Matthew Carter, Nikola Đurek, Adrian Frutiger, Jose Scaglione, Mark Simonson和Erik Spiekermann等人设计的字体,他们都是我心中的字体英雄。

最为最后的手段,你还可以尝试使用同一个字库中的字体加以组合,因为字库一般也提供用于组合的字体。订阅与字体相关的newsletter是一个聪明的办法,newsletter中的建议通常都来自于为字库工作的专家级设计师,设计师通过这种方式可以不断地获得字体组合方面的有效信息,他对适合组合的字体也会越来越了解。这么做的一个额外收获是,假以时日,你收到的newsletter将会变成一个有用的资料库。

如果你一定要坚持以自己的方式组合字体,请确保不同字体之间有足够的对比度以使排版在整体风格上保持一致。不要使用风格互相冲突的字体,因为这样会分散用户的注意力。而如果字体的相似度太高的话,同样可能激怒用户,因为它们会造成辨认上的困难。除非你有完全把握,否则不要使用邻近的字号(如常规字体和中号字体,大号字体和特大号字体等)。

编辑类项目与排版

展示型和装饰性的字体适合用于较短的文本,如标题和提升引语等,因为其主要目的是营造某种氛围和打破长篇文本的沉闷感。而正文字体则侧重实用性和对长篇文本的支持性。持续的阅读会让用户感到厌倦,使人难以集中注意力的网页阅读尤其如此。

“灰色可能对设计师来说没什么,但它却是阅读者的死敌。”
– Erik Spiekermann


为了减轻读者的阅读压力,每隔一段文本就要插入一个标题或提升引语。由于提升引语通常包含文本中的重要信息,因此选用展示型的字体较为合适。各个标题属于主文本的一部分,最好使用与主文本的变体(如小型大写字母)。当然,我说的这些只是指导性建议,而不是强制性规定。

设计师的责任

设计师在做决定时还要考虑到以下两个重要方面:第一,如果读者不喜欢你的排版设计,他们会利用设备或应用自带的“自定义”选项来调整它。他们一般会把版式变得更为普通,这样一来,你原来设定的字体就全被毁了。我听说在以前,当设计师必须在IE浏览器中用固定的行高单位去匹配不固定的字符单位的时候,即使对字体大小做很微小的调整都可能都会导致页面崩溃。

第二,网页阅读没有物理界限的特性既是一件幸事也是一种诅咒。从积极的方面来说,文本有无限的空间向下延展。从消极的方面来说,设计一个布局平衡的页面变得更为困难,因为在许多网页中,根本不可能一眼看到页面的底部。因此编辑类内容在提升用户的阅读体验上就显得格外有意义。因为你不能指望用户在一个下拉式页面中,一口气从头读到尾。

当你的项目面向的是所有人时,你不应该持有任何成见。我们在做排版设计时,要想着自己的作品可能会在各种不同的硬件设备上被浏览,会以完全不同的清晰度显示。我们要尽力保证使用自己字体的文本在不同的时间,空间,设备,受众等条件的差异下,依然有优越的表现力。简单粗暴的设计时代已经一去不返,当前,我们设计师的最大的责任就是尽可能深入而全面地了解手中的项目,以明智地作出决定,高效地完成任务。


【设汇主义】

设计,不仅需要非同一般的创意,更需要默默的积累与学习。设汇主义,汇聚与设计有关的一切,从行业精英的经验心得,到最实用最解渴的设计技巧,从国际前沿的设计新动向,到设计的历史与趣事,“设汇主义”专栏内容将为你提供源源不绝的灵感,助你早日钻破束缚的茧,化为五彩斑斓的蝶!

翻译:刘海静

视觉中国专稿,转载请注明出处,谢谢!


发表
26906人 签到看排名