Number.55，分享一篇《写给大家看的设计书》读书笔记-字体与人生：
今天接着看《写给大家看的设计书》，看到了字体部分，对于字体的整个发展体系有了一定的了解，收获很大。虽然书中讲的大部分是英文体系的字体知识，但是对于中文体系的字体学习还是有一定的帮助。内容包括：字体关系、字体类别、字体对比。
1 字体关系
协调
|
what 如果只使用一种字体系列，在样式、大小、字体粗细等方面没有什么变化，就会产生一种协调关系。 |
|
效果 看上去很安静、非常正式，但是有时也会觉得乏味。 |
冲突
|
what 如果结合使用了多种字体，它们在样式、大小、字体粗细等方面很类似，就会出现一种冲突。 |
|
效果 （1）这种相似性会造成困扰，因为我们看到的不完全一样，但也并非完全不同，所以它们是冲突的。 （2）协调是一个稳妥有用的概念，但冲突务必要避免。 |
对比
|
what 如果结合的多种字体和元素彼此之间截然不同，就会出现一种对比关系。 |
|
效果 （1） 引入注目的亮丽设计往往包含大量对比，而且这些对比会得到充分强调。 （2） 对比不只是能增加作品的美感，页面上信息的条理性和清晰性与对比密不可分。 （3） 要在设计中增加对比，最有效、最简单而且最让人满意的方法之一就是利用字体。 |
2 字体类别
Oldstyle
|
What 基于手写字体创建的。 |
|
外观 （1） 粗/细过渡
（2） 截线：小写字母上的截线是倾斜的
（3） 强调线：如果在曲线笔划的最细部分画一条线，这条线将是对角线，称为强调线（stress） |
|
效果 Oldstyle字体几乎没有什么显著的特征会影响阅读，它们本身不会分散人的注意力，使得Oldstyle字体成为显示大量文字的最佳选择。 |
Modern
|
What 历史的演进，字体变得机械，新的字体不再遵循手中所拿笔的笔迹。 |
|
外观 （1） 截线：Modern字体有截线，不过它们的截线是水平的，而不再倾斜，而且这些截线很细。 （2） 粗/细过渡：Modern字体就像一座钢铁大桥，结构很严格，笔划中有剧烈的粗/细过渡。 （3） 强调线：由于不存在笔的倾斜，所以强调线完全是垂直的。 |
|
效果 （1） Modern字体看起来往往有一种冷酷、高雅的感觉。 （2） Modern字体外观很醒目，特别是设置得非常大时，有一种让人震撼的感觉。 （3） 由于有剧烈的粗/细过渡，在显示大量正文时，大多数Modern字体都不是很好的选择。 |
Slab serif
|
what （1） 工业革命，产生一个新的概念——广告。 （2） 开始人们采用Modern字体，但是远处看，看到的都是一条条垂直线，就像一个栅栏。 |
|
外观 （1） 截线：小写字母上的截线粗，且是水平的 （2） 粗/细过渡：Slab serif的粗/细过渡很小，甚至没有 （3） 强调线：垂直强调线 |
|
效果 （1） 粗/细对比很小的许多Slab serif字体，可以提供很好的可读性，它们可以很好地用于显示大量文本。 （2） 与Oldstyle相比，总的看来，设置为这种字体的页面更暗，因为它们的笔划比较粗，而且粗细相对单一。 （3） 由于其简洁、直接的外观，Slab serif常在儿童图书中使用。 |
Sans serif
|
What 指笔划末端没有截线的字体，直到20世纪早期，才取得广泛成功。 |
|
外观 （1）截线：没有截线。 （2）粗/细过渡：笔划中没有粗细过渡。 （3）强调线：没有强调线，因为根本没有粗/细变化。 |
|
效果 （1） Sans serif字体的粗细几乎总是单一的，这说明笔划中几乎没有可见的粗/细过渡，字体的粗细都一样。 （2） 大多数Sans serif字体的粗细都是单一的，也有很少的几种字体稍微有一些粗/细过渡。 |
Script
|
What 看上去利用一个书法笔或书法刷手写的所有字体，都属于Script类字体。 |
|
效果 （1）Script字体就像奶酪蛋糕，要少用，这样才不会让人觉得恶心。 （2）绝对不能将大段文本设置为这些有趣的字体，而且绝对不能设置为全大写。 （3）Script设置得非常大时，可能会让人印象特别深刻。 |
Decorative
|
What 如果一本书全部使用一种字体，读这样一本书让你很想把它扔掉，那大致可以认为这种字体属于一种Decorative字体。 |
|
效果 （1） Decorative字体有趣而且特别，很易于使用，有时更廉价，而且你一时想表达的任何突发奇想都可以使用这种字体。 （2） 正是因为它的特别，所以这种字体的使用要有限制。 |
3 字体对比
大小（size）
|
What 顾名思义，就是指字体的大小。 |
|
不要保守 （1）字体大小的对比非常明显。 （2）为了有效使用大小对比，绝对不能保守，要力求明显，不要让人觉得这是一个失误。 （3）字体大小对比并不意味着必须让字体很大，而只是要求应该有对比。 |
|
再三建议不要全部使用大写 （1）文本设置为全大写时，与同样的文字使用小写相比，所占的长度可能是后者的两倍。 （2）如果将文本变成小写，将有更好的可读性。 |
|
要以一些有煽动性的非常规方式造成大小对比 （1）许多印刷符号设置得很大时会非常漂亮。 （2）使用一个大小非比寻常的项，看看能不能在别处重复这个概念。 |
粗细（weight）
|
what （1）字体的粗细是指笔划的粗细度。 （2）粗细对比是为页面增加视觉效果最容易而且最有效的方法之一，而且无需重新做任何设计。 （3）粗细对比不仅能使页面更加引人注目，也是组织信息的最有效的方式之一。 |
|
大多数字体系列都设计为包括多种不同的粗细 （1）常规regular （2）粗体bold （3）半粗体semibold （4）极粗extra bold （5）细体light |
|
不要太保守 （1）如果结合两种不同字体系列中的字体，一种字体通常比另一种要粗，所以要特别强调。 （2）要粗细字体对比，而不是中粗字体的对比。 |
|
衷心希望你至少引入一种非常粗的黑粗体 如果你的页面看上去“灰乎乎”的，而且没有空间来增加图片，也无法抽出引用文字把它们设置为图片，就可以用非常粗的粗体设置关键短句。 |
结构（structure）
|
what （1）字体结构是指这种字体是如何建立的。 （2）每种字体类别都有类似的结构，每个类别的结构有很大差别。 （3）Robin原则：不要把同一个类别中的两种字体放在同一个页面上。 |
|
初学者的选择 （1）如果你刚刚了解到字体结构存在差异的有关概念，要想选择有对比的结构，一种容易的方法就是选择一个serif字体和一个sans serif字体。 （2）serif字体的结构中通常存在粗/细对比，sans serif字体则往往有一致的粗细。 （3）将serif与sans serif结合，是一种经过了时间检验的组合方法。 |
形状（form）
|
what 字母的形状是指它的外形，字符可能有相同的结构，但是“形状”不同，可以简单地把形状对比认为是大写与小写的对比。 |
|
两种形状对比 （1） 大写/小写
（2） roman字体和italic字体的对比
|
方向（direction）
|
what （1） 就是文字有一定的倾斜度。 （2） 尽管可以理解为文本有一定倾斜方向，但更多地认为方向对比是指水平文本与瘦高文本列的对比。 |
|
强调一点：不要设置方向 （1） 只有当你能明确说出原因时，才可以设置有方向的文本，你要能够说明为什么这种字体必须有方向，为什么它能增加美感或促进表达。 （2） 实现字体方向对比时，还可以介入布局中的其他部分，如结合图片或线条来强调方向或形成方向反差。 |
颜色（color）
|
暖色（红色、橙色） 暖色是前进型的，会引起我们的注意，我们的眼睛很受暖色的吸引，所以只需很少的一点红色就可以产生对比。 |
|
冷色（蓝色、绿色） 冷色是远离型的，总是在我们的实现中后退，需要更多的冷色，才能产生有效的对比，要有效地与一个冷色进行对比，通常也需要使用更多的冷色。 |
|
“黑白文字也能产生颜色” （1） “颜色”是由不同的字母粗细、结构、形状、字母内的空间、字母间距、 行间距、字体大小或x-height大小等产生的，即使是同一个字体，也可以创建不同的颜色。 （2） 很细、很薄的字体中，字母间距和行间距较大，会创建一种非常淡的颜色（和材质）。 （3） 紧紧压缩在一起的粗体sans serif则会创建一种深色。 |
结合多种对比
|
（1） 不要保守：大多数有效的字体布局都会充分利用多种对比。 （2） 要得到更多的例子和想法：可以拿一本好的杂志看看，吸收思想。 （3） 尽量明确地说出你看到了什么：如果可以用语言说清楚这种关系的变化，说明你确实已经掌握。 （4） 指出问题，你就能找出解决方案：试图找出一个更好的解决方案之前，必须发现问题所在，要找出问题，必须努力寻找相似性，而不是差异。 |
感谢阅读！
我是Glen，【公众号JiGlen】，觉得好的话，可以关注一下哦！
0岁的产品人，爱互联网，爱生活，坚持分享产品干货！
大家也可以在PC或MAC上登陆以下网址查看以往文章：
http://chuansongme.com/account/Ji_Glen
扫一扫
1663
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
