toc
- 对齐＋视觉权重
- 颜色
- 规模
- 大写文字
对齐＋视觉权重
仅靠宽，高，以及坐标X，y值，电脑没法精确的指导物体的视觉重量。作为设计师我们需要对此进行一种叫做视觉调整的补偿。
播放按钮中的三角形是居中的？错。在圆中居中画一个三角形，看起来是不平衡的。
左侧播放图标看起来是居中的，但是它在矩形中却是不居中的。
“正确”的播放图标并没有显得不平衡，然而它很明显偏移了中心很多，而不是一点点。为什么？视觉权重。视觉权重或者重量重心偏左一点，这就造成了视觉上的不平衡，就是它实际上并没有。
解决这个问题，我们需要手动推动三角形直到它看起来居中。
颜色
对于颜色的视觉调整就更加微妙。再次强调的是，这是关于物体的重量，以及颜色的多少。
总结来说，图标的填充色和文字都是同样的绿色，但是其中的一个比另一个看着要亮一点。
左边的图标和文字使用相同的颜色，左侧的使用不同的颜色。为了做到相同的视觉感觉，我在sketch中加深了文字“HSB”值。
这看来很微妙，但是你可以看到图标比文字看起来颜色深一点。要调整它，要么让图标变亮或者让文字变的暗一点——我建议你选择那个能够让你达到Web内容无障碍指南的颜色。
我推荐在你的设计中使用HSB | HSL值，除去其他优势，这样可以使用“L”和“B”来快速调整颜色的亮度。
规模
规模时我们大脑对于物体包含字体尺寸的感知。当我们看到同样120 × 120px的矩形要比圆形大。所以为了视觉平衡，需要将圆放大一点。
左侧都是120 × 120px，圆看着小点，右侧的圆126 × 126px，这样才能和方形看着一样大。
就像我们所有的视觉调整一样，这个也很微妙，但是这些调整能够让设计看起来正确。这是一个微调的元素——上下增加了1px直到它感觉正确。
注意曲线上下的狄多点已经高于X字高，低于基线，同样的你可以看到7个字母。
这在字体设计中很常见，字母曲线可能会超过大写字母高度低于基线等。如果你使用Garamond字体写一行，然后在基线和X字高画两道线，你会发现曲线会超过这两条线。如果这些超出不存在，你就会发现这些字母相对于旁边的字母显得太小。
大写文字
最后一个例子可以很明显说明视觉调整的必要性：当大写的文字和正常文字一起的时候，大写文字远比正常文字要突出很多，因此需要视觉调整。
上面的大写文字远比旁边文字大，下面的小写文字调整到2倍才让其视觉上平衡。
除非设计上特意为了突出大写文字，大写文字需要减小大小，譬如16px到14px或者12px到11px。
－－－－
当设计大型项目的时候，这些细小的调整叠加最终就会影响到网站整体的观感。如此对细节的关注才能让好的设计变棒！
一旦这变成工作流程的一部分，减小文字2px或者推动三角形10px来达到视觉正确需要时间，当这就造就了设计的像素完美。
电脑或者甚至是人工智能（AI）都无法理解一小块设计中的上下文环境，因此它们不能像设计师一样做出精确的视觉调整。等到电脑可以在孤立设计的上下文设计语言中做出理性的判断，我们才能在复杂设计中历它的判断。
我们不能期望电脑替我们完成所有的工作，我们应该依赖我们的眼睛和我们的直觉。设计师每天锻炼自己的直觉，我们应该相信这些直觉，尽管电脑告诉我们不要相信。
