视觉设计师的五项技能修炼方法(2)

四、使用字体

字体才是内容与用户的交互界面，学会处理字体也是网页设计的基础技能之一。在使用字体的时候，有如下几点需要加强练习：

字体的选择

字体重量的组合

字符间距

行高

当然这里讨论的是丰富程度远超中文网页字体(Web Font)的西文字体，在字体的选择时，有以下两个原则：

多种字体重量(Weight)的优先;

有Condensed的字体优先;

基于这个选择原则，四套最受欢迎的英文网页字体分别是Helvetica Neue。Roboto。Avenir以及Open Sans。

字体重量和样式丰富的字体集在页面设计时有更大的选择空间和丰富的组合方式。不同重量和风格的字体通常有不同的含义，例如以最简单的斜体(Italic)为例，它的使用含义可表达在正文中的“强调”，例如强调某个词、某个专门定义、特定名称;也可以表达引言;而粗体大写通常是表达强烈的标题性文字。

不同字体的组合可以体现更加舒适的阅读体验，在下面的例子里，我只使用了一种字重的：

当我们学会不同字重的组合时，阅读体验将会变得更加好，用户从字重中就可以识别文字的含义。

这里有一个小技巧，大标题通常使用超粗字重，超粗字重适当缩小字母间距效果会更加紧凑，在CSS中定义letter-spacing一定量的负值，例如下面的对比：

五、使用颜色

颜色通常是一个初级设计师比较头疼的事情，我们对于色彩的敏感往往不能够很好地对色彩进行搭配，但通过一定的练习也可以达到好的效果，这里我的练习方法是填色练习。

首先，下载一个UI模板的PSD文件，下面是一个完全没有颜色的PSD：

找一张你喜欢的图片用蒙板的方式放在框体上面，变成下面的样子：

从图片上吸附两种主色，一冷一热，进行填充，就变成了下面的样子：

反复重复锻炼，可以形成下面多个色彩搭配的，用这样的方式可以帮助你培养你对色彩的配搭感觉。

只要我们不那么贪心(使用多于两种的颜色)，从艺术作品中借鉴某些颜色的配搭，选取冷热两种主色，再加上不同灰度的黑色作为辅色，或者冷热主色的不同透明度的色阶，一个简单的网页界面色彩的管理是足够胜任的，如下面这个界面的设计：

写在最后

我并不像很多设计师是从工业设计开始设计生涯的，也并没有接触过专业的美术基础教育，在我的工作里也并不需要我进行细节的视觉设计，但是我相信，基础视觉设计技能是谈论设计的基础。同时我也看到，很多视觉设计师并没有养成“干净”的设计习惯，对于留白、字体、栅格的使用都非常随意，我相信本篇的内容对他们也会有些帮助。

因此，一个非专业视觉设计师视觉方面的修炼，就是以下五步：

练习草绘;

严格使用网格(对TM齐);

练习留白;

练习字体组合表达内容;

练习色彩搭配。