写给大家看的设计书

本书给没有设计背景的人提供一套可操作的框架，用于制作名片、传单、简历、新闻简报等日常页面。全书分两部分：第一部分是四条设计原则加颜色运用，第二部分专讲字体排版规范和字体搭配。

作者用"约书亚树"作为引子：她住在一条街上十三年，直到读了一本认树的书，才第一次"发现"邻居院子里的约书亚树——其实有八成家庭都种了。能说出名字的东西才能被看见，被看见才能被控制。四条原则的价值在于给你一套语言，让你能具体指出页面上哪里出了问题。

四条基本原则

亲密性（Proximity）

相关的内容物理上靠近，不相关的内容保持距离。

操作方式：微眯眼睛，数页面上有多少个视觉停顿点。超过三到五个孤立单元，就要检查哪些项可以合并成一组。标题与其所属段落之间的距离要小于它与上方内容的距离——如果两边距离相等，读者无法判断这个标题属于哪段内容。

工具选择有实际影响：用段落间距设置（段前/段后空间）而不是连打两个回车——两个回车产生固定大小的间隔，无法精确控制亲密性。

亲密性的直接结果之一：页面上的空白会自动变得有序。孤立元素之间"截留"的空白是散落的，没有美感；归组后，空白聚合成较大的区域，反而让页面看起来更宽松、更有呼吸感。

要避免的问题：标题上下留出同样大的间距；把标题靠近上方的内容而非下方所属段落；给每条项目之间留相同空白。

对齐（Alignment）

任何元素都必须与页面上另一个元素存在视觉联系，不能随意放置。

左对齐和右对齐产生一条"硬边界"——即使两个文本块相距很远，那条看不见的线也会把它们连接起来。居中对齐产生"软边界"，视觉上找不到那条线，力度弱。

书中明确建议：在掌握基础之前，强制自己避开居中对齐，因为它是新手的默认选项，产生乏味、正式、中规中矩的印象。有意选择居中是另一回事——婚礼请帖或徽章的庄重感就来自居中，但必须是经过考虑的决定，而不是什么都不做时的默认状态。

常见陷阱：在左对齐正文上方将标题居中——这在一个页面上制造了两套对齐系统，标题悬浮在空中，与上下文都没有视觉联系。解决方式：选定一种对齐，贯穿整页。如果同一页上确实需要两种对齐方式，让两组元素之间共享某条对齐线。

要避免的问题：混合使用居中、左对齐、右对齐；把缩进段落的标题居中；标题和正文用不同的对齐基准。

重复（Repetition）

让某个视觉元素在整个作品中反复出现，制造统一感和可识别性。

可以重复的内容：粗体字、颜色、线宽、项目符号形状、空间比例关系、字体。读者一旦感知到某种元素在重复，就会认为整个作品由同一个人掌控。多页文档中（新闻简报、宣传册），重复是让第3页和第13页"属于同一本东西"的主要手段；没有重复，翻到任意一页都像是进入了另一个出版物。

操作步骤：先找出页面上已经自然重复的元素（比如标题都是14磅黑体），然后把它做得更突出——换成更粗的无衬线体，视觉上会立即有分量。也可以引入纯粹为了建立重复而设计的新元素：每个页面底部的色带、每个标题下方1磅的横线、固定形状的装饰符号。

重复过量会失效。如果页面上所有东西都很大很粗，没有任何东西能脱颖而出。对比（下一条原则）是重复的平衡机制——有了一致的背景，对比才能真正突出关键内容。

对比（Contrast）

两个元素摆在一起，要么完全相同，要么截然不同——类似但不相同只会产生冲突，让读者以为这是排版失误。

12磅和14磅字体之间没有对比，只有冲突。0.5磅和1磅的线之间没有对比。深棕色文字在黑色背景上没有对比。读者看到两个类似却不相同的元素，会以为这是失误，而不是设计决定。

对比的两个目的：吸引视线（决定读者是否愿意停留在这个页面上）；组织信息层级（让读者一眼看出哪里是标题、哪里是说明、哪里是联系方式）。

实现对比的途径：字体大小（差距要足够大）、字体粗细（细体对超粗，而不是常规对半粗）、字体结构（衬线体对无衬线体）、字形（大写对小写、罗马体对斜体）、颜色、方向、线宽。书中反复强调：不要保守。如果要制造对比，就加大力度。

字体排版规范

打字机习惯的遗留问题

打字机使用等宽字体，无法打出斜体、破折号或弯引号，用加两个空格、全大写、下划线来弥补这些限制。这些习惯在使用比例字体的现代排版中都需要纠正。

标点后一个空格：两个空格在正文里会产生明显缺口，阻碍阅读，让作品看起来陈旧。

弯引号而非直引号：开引号形似双6，闭引号形似双9（" "）。软件通常自动替换，但不总是，需要检查。打字机直引号（"）是英尺英寸符号，出现在正式文档里是明显的业余标志。

撇号是闭单引号（形似9），意味着省略了字母。"Rock 'n' Roll"在缺少字母处用撇号；"'60s"中撇号在6前面，因为省略了"19"。

破折号用真正的破折号（——），不是两个连字符（--）。Mac上是Option+Shift+-，Windows上是Alt 0151。

全大写比小写难读：读者识别单词靠词形（"海岸线"），全大写的词都是矩形，无法靠形状区分，只能逐字母读。要让文字更大，把全大写改为小写反而可以放更大的字号、在同样空间内获得更好的可读性和对比效果。

不要用下划线：下划线是打字机时代的斜体替代品，现在可以直接用斜体。强调文字用粗体、字号变化或不同字体，比下划线更专业。

六种字体类别

了解字体类别的目的是识别结构上的相似性——因为把同一类别的两种字体放在一起会产生冲突。

旧式体（Oldstyle）：基于手写体，衬线有角度，笔划粗细过渡缓和，强调线倾斜。代表字体：Garamond、Caslon、Palatino、Minion。这类字体的特征不醒目，不会分散注意力，是大段正文的最佳选择。

现代体（Modern）：衬线水平且极细，笔划粗细对比剧烈，强调线垂直。代表字体：Bodoni、Didot。大字号时震撼，但正文中细线几乎消失、粗线过于突出，产生"眩目"效果，不适合大量文字。

粗衬线体（Slab serif / Egyptian）：衬线粗且平，几乎没有粗细变化，整体均匀厚实。代表字体：Clarendon、New Century Schoolbook、Memphis。可读性好，常用于儿童读物，但页面整体比旧式体更暗。

无衬线体（Sans serif）：笔划末端无衬线，粗细均匀。代表字体：Helvetica、Arial、Futura、Frutiger。书中明确建议：不要只用Helvetica/Arial——这两种字体粗细变化范围窄，无法产生强烈对比。引入一个包含极细和极粗版本的无衬线字体系列（如Formata、Syntax、Eurostile），页面效果会立即提升。

手写体（Script）：模仿书法或手写，有连笔或非连笔两种形态。只用于标题、短句，绝不设置为大段正文，也绝不全大写。字号可以做很大。

花体（Decorative）：风格鲜明、个性强烈，用途有限。同一页面只放一种，否则两种"有趣"的字体会互相争夺注意力，产生冲突。

字体搭配的六个对比维度

搭配原则的起点：同一页面不要使用同一类别的两种字体，因为它们的结构相似，产生冲突而非对比。发现搭配有问题时，重点看两种字体的相似性，而不是差异——相似性是冲突的来源。

大小对比：差距必须足够大，不要12对14磅，不要65对72磅。把某些元素做很小会加强中心点的对比——读者不需要很大的字才能找到；只要有需要，自然会去读小字。把全大写改成小写可以在同样空间里放更大的字号。

粗细对比：细体对超粗，不是常规对半粗。大多数系统自带的字体系列里粗体还不够粗，引入一种真正黑的超粗无衬线体能立即改变页面重量感。信息层级主要靠粗细区分——标题粗、正文细，目录中一级索引粗、二级索引细，读者不需要数字辅助就能看出层级。

结构对比：衬线体对无衬线体是经过时间检验的安全搭配（两者的笔划结构完全不同）。仅靠结构对比还不够，通常需要同时加大大小或粗细的差距。同一页面上两种无衬线体很难搭配，因为它们结构相同；如果必须用，利用同系列中粗细差异极大的成员来建立内部对比。

形状对比：大写字母与小写字母的字形完全不同，一段全大写文字和一段小写文字产生形状对比。罗马体（竖直）与斜体（倾斜或飘逸）也是形状对比。不要把两种斜体或两种手写体放在一起——它们有相同的形状（倾斜、飘逸），会产生冲突。

方向对比：水平方向的宽标题对垂直方向的窄列，产生视觉张力。文字倾斜（角度排布）要有明确理由——"这个方向能给页面一种向前的动力"，而不是随意为之。不要在角落里放倾斜的文字。

颜色对比：暖色（红、橙）是前进型的，少量就能主导视线；冷色（蓝、绿）是后退型的，需要更大面积才能与暖色抗衡。黑白文字也有"颜色"——字体粗细、行距、字间距、大小共同决定文字区域的深浅度。在全是黑白文字的页面上，通过改变字体的粗细和大小，可以在视觉上区分出两个色调不同的区域，比只用一种灰度的页面更有层次感。

颜色运用

色轮基础

三原色（黄、红、蓝）→ 等量混合相邻原色得到三间色（橙、紫、绿）→ 再次混合得到六种第三色。共十二种基础色调组成色轮。

向色调加黑色得到暗色，加白色得到亮色。利用暗色和亮色，可以在任何一种颜色关系的基础上大幅扩展选择——儿童产品的红黄蓝三原色配上各自的暗色和亮色后，就可以摆脱幼稚感，变成复杂而有层次的配色方案。

常用颜色关系

互补色：色轮正对面的两种颜色（如红与绿、橙与蓝）。对比强烈，其中一种作主色，另一种用于点缀强调。红绿搭配容易让人联想到圣诞节；换成红绿各自的暗色，就能产生厚重而丰富的效果。

三色组：色轮上等距的三种颜色。红黄蓝（基色三色组）是最常见的儿童产品配色，绿橙紫（间色三色组）也有类似的和谐感。

分裂互补三色组：选一种颜色，找到它的互补色，然后用互补色两侧的颜色替换互补色本身。比直接使用互补色更柔和，颜色边界更细腻。

类似色：色轮上相邻的颜色，共享同一基础色，协调感强。适合季节性或情绪统一的设计（冷色系表达冬季，暖色系表达夏季）；加入不同亮度变化后效果更醒目。

单色：同一色调加不同量黑白。黑白照片就是最常见的单色方案——黑色（色调）加上各种深浅的灰（暗色和亮色）能产生极为丰富的视觉效果。

暖色与冷色的使用规则

暖色前进，冷色后退。少量暖色就能抢占视线，搭配暖色和冷色时，暖色面积要明显小于冷色，否则暖色会压倒一切。如果需要冷色产生足够的存在感，需要用大面积的冷色。

色质问题：色质（颜色的明暗度、深浅度）相近的颜色放在一起会产生"视觉抖动"，文字几乎无法辨认。如果用深色组合，确保其中一种比另一种浅得多；如果在浅色背景上用白色文字，加一点阴影分隔。

CMYK与RGB

印刷用CMYK（青、品红、黄、黑四色油墨叠加），屏幕用RGB（红绿蓝光直接进入眼睛）。RGB的颜色在屏幕上更鲜艳，因为是直接发光；转为CMYK印刷后会损失部分鲜艳度，这是正常现象。最佳实践：在RGB模式下处理图像，最后再转成CMYK。

各类版式的实用建议

书第8章针对具体版式逐一讨论，反复出现的问题可以归纳为几类：

字号偏大：名片上12磅显得笨拙，9-10磅才能兼顾信息密度和视觉干净感。正文字号不一定要12磅——辅助信息（期号、日期、联系方式备注）可以做到8磅甚至更小，需要的人自然会读到，不需要的人不会被它干扰。

空白被截留：空白散落在各元素之间而不是聚合成有秩序的区域，看起来像是"剩余空间"而不是有设计意图的留白。改善方法：把相关元素归组，空白自然聚合。

传单的中心点缺失：传单上所有内容都是同一尺寸、同样粗细，读者视线没有落脚点。先确定一个最重要的信息作为中心点，让它比其他内容大得多或粗得多；其余内容可以做很小——读者如果感兴趣，自然会去读小字；如果不感兴趣，把小字做大也没用。

报纸广告的特殊逻辑：报纸版面本身信息密集，有大片空白的广告会自动脱颖而出——读者眼睛天然被空白吸引。留白比填满版面更有效，而且留白后标题可以用精细的手写体或旧式体，不必为了"醒目"而用又大又粗的字体。

名片信息取舍：去掉所有多余信息。"电话""邮箱""网址"这些标签词不需要写出来，格式本身就能说明；传真号码（如果不常用）可以不放；强调名片的整体精美感比把老年人也能轻松看清每个字更重要。

四条原则的使用顺序

书在最后给出一个设计流程，顺序本身有意义：

1. 确定中心点：读者最先看什么，这个元素需要与其他内容形成最强烈的对比
2. 按逻辑分组（亲密性）：先在纸上或心里规划信息归属，再在页面上操作
3. 建立并维护对齐：所有元素与某条对齐线挂钩，特别注意对齐的照片、标题与正文之间的关系
4. 找出可以重复的元素：检查已有的一致性，决定哪些可以加强
5. 建立强烈对比：如果页面上所有东西都大而粗，就没有对比——对比要黑白分明，不能保守

分组之前无法谈对齐（不知道哪些元素属于一组），没有对齐就无法判断什么在重复，没有稳定的重复背景就无法靠对比突出关键信息。

关于字体选择的最低配置建议

书反复提到：大多数人电脑里自带的字体系列粗细范围不够，只有常规和普通粗体，无法产生真正强烈的对比。

至少需要：

• 一个旧式衬线字体系列（用于正文）：Garamond、Caslon、Palatino、Minion任一
• 一个包含极细和极粗版本的无衬线字体系列（用于标题和对比）：Formata、Syntax、Frutiger、Myriad任一
• 有了这两个系列，大多数设计场景都能覆盖

不推荐的默认字体：Times New Roman（作为标题字体太弱）、Arial/Helvetica（粗细范围太窄，作为标题用加粗版本不够粗）、Comic Sans（手写体误用场合太多）。书中明确说"把这几种字体从你的字体选择中去除"。