织梦CMS - 轻松建站从此开始!

我的网站

写给设计师的字偶距调整指南(2)

时间:2016-05-06 15:19来源:designschool 作者:未知 点击:
04. 宁愿过度调整字偶距也不要冒风险 过于紧凑的文本会难以阅读,字号较小时尤甚。字偶距不足的另一个坏处是字母离得太近会挨在一起,有时候看起来

04. 宁愿过度调整字偶距也不要冒风险

过于紧凑的文本会难以阅读,字号较小时尤甚。字偶距不足的另一个坏处是字母离得太近会挨在一起,有时候看起来就是一个完全不同的字母(甚至单词!)。下面这个绝妙的例子可以充分说明问题:如果 r 和 n 的字偶距太近了会发生什么呢?它们看起来就是个 m(顺便给排印术语表加了条目)。

由于可读性和易读性是任何设计中涉及排版时的首要考量,所以不知如何操作时,最好把字母的字偶距拉得稍微大一些,以免让读者眼睛疲劳或造成任何可能的误解。

05. 颠倒一下

有时很难看出应该在哪里调整字偶距,因为大脑首先想要知道字母的含义是什么。一个扭转注意力的方法是把字体上下颠倒过来,这样就可以专注于字母的字形以及字偶距,而不被单词本身分心。

06. 最后再调整字偶距

就设计流程而言,字偶距调整应该是排版和涉及空白调整的工作流程的最后一步。一定要选定字体之后再开始调整字偶距,因为同一字偶距对不同字体看起来效果是不同的。正是这最后一步的字偶距调整让设计看起来更优雅,更专业。

但是在开始调整字偶距之前,应该酌情花工夫看看其他几种空白调整:字距和行距。

字距:亦称字元间距,这个「空白」决定了文本整体的紧凑或稀疏。字偶距调整的是一对儿字母的间距,而字距让选中文本使用同一间距,可以一次选中一个单词,一个句子,一段或者一页。如果有必要进行字距调整,就在调整字偶距之前做。

行距:就是文本行与行之间的垂直距离。在使用文字处理软件的时候,应该设置过行距吧,这是个常见的功能。尽管没什么必要调整多行文本的字偶距,了解一下改进设计时可以调整哪些间距还是不错的。

另外说明一下,不少程序可以选择许多不同的字偶距设置。除了手动调整字偶距(这个效果总是最佳的)外,还能看到字偶距的「度量标准」或「视觉」[注](参考: https://helpx.adobe.com/cn/illustrator/using/line-character-spacing.html) 选项。度量标准使用字体设计师提供的内置于字体文件中的字偶距。视觉则忽略上述设定,根据某种算法对字体重新进行空白调整和字偶距调整。这篇文章介绍了这些选项的工作原理以及该如何选用。

07. 何时调整字偶距

我们反复指出过,调整大且明显的版面的字偶距时的效果最佳,比如,大标题、标题、横幅或带文字、标识及链接的主角照片。但是大块的内文没必要调整字偶距(尤其是手动调整),因为:

1) 字偶距不会对典型的内文字号,比如 10,11 或 12 点,带来可见的影响。

2) 许多字体,尤其是高质量字体,有成百上千的内置字偶距配置。大多数场景下,这些调整过字偶距都会考虑字体的独有的字母形状和结构,没有必要手动调整字偶距,对成段的文本尤其如此。

此外,把一整页文本过一遍,调整字偶距会耗费数小时,没有这么多时间可用。不要花这么多时间在字偶距上,应该全局考虑对哪一块进行调整可以获得最佳效果。

08. 付诸实践

字偶距需要身体力行的设计概念——既要理解其工作原理又要擅长使用它。除开始着手字偶距型项目外,还可以通过Kerntype这个网页游戏磨砺字偶距技巧(还能得到反馈)。

这个游戏并没有教程,工作原理如下:给你一个需要处理字偶距的单词,首尾字母是固定的,然后移动剩下的字母实现视觉上的均匀分布。

完成后,选择 Both 并点击 Compare ,就可以看到你调整的字偶距(白色字母)与推荐方案(蓝色字母)的对比结果。和推荐方案越接近比分越高。这种练习可以帮助你适应依据视觉调整字偶距的过程。

09. 给网页设计师的话:你也能调整字偶距!

通常认为,调整字偶距是图像和排版设计师处理静态排版设计时才会用到的东西。但自从网络兴起,对字体有了解的网页设计师和程序员也想调整字偶距。现在也有一些工具可以帮助调整字偶距。Kerning.js,就是一个用 CSS 处理网页排版中字偶距的脚本。这里可以学习更多与网页相关的字偶距处理及其他排版技术。

该你了……

知道为什么字偶距很重要了?但愿如此!错误的字偶距会让设计看起来不专业(有时甚至看起来特别愚蠢),不过现在了解了在设计作品中该做什么了吧。不过要当心…… 一旦开始留意糟糕的字偶距,就会发现它无处不在,招牌和广告牌上,商品包装上,所有你能想到的地方上都有。(我已经警告你了哦!)

(责任编辑:RGB)
织梦二维码生成器
顶一下
(1)
100%
踩一下
(0)
0%
------分隔线----------------------------
发表评论
请自觉遵守互联网相关的政策法规,严禁发布色情、暴力、反动的言论。
评价:
表情:
用户名: 验证码:点击我更换图片
栏目列表
推荐内容