认识网页设计(Design)中的“字”
首先，我们简单将网页里的文字分为可替换和不可替换两个部分。
可替换的文字也就是能通过后台管理进行编辑(Editor)的文字，例如博客文章、产品说明等。不可替换的文字是在网页制作过程中所定下的，后台管理并不提供文字的编辑条件(tiáo jiàn)，通过网页代码才能修改，例如网址导航、Banner等。不可替换的文字并非完全不能修改，只是修改一次会耗费一定的成本（Cost），因此修改的间隔时长，比如导航的修改需要经过代码，而Banner里的文字的修改也需要重新设计(Design)Banner图片。
可替换的文字只能使用(use)网页所允许给定的字体，因此中文字体的选择(Select)面较窄。但不可替换的文字则可以通过图片等方式展示，将其制作成透明背景（background)的图片，这时，字体的使用和排版都是灵活的，设计(Design)师就会有足够的创作自由度。
下面这个设计(Design)中所使用(use)的字体就经过了一定的设计，字体更换并不十分容易
字形合一，网页设计中的图文配
这里所谓的与图片的搭配，也是指的这类可以经过设计的文字。UI视觉设计一个软件产品在编码之前需要做的就是交互设计，并且确立交互模型，交互规范。三是用户测试/研究，这里所谓的“测试”，其目标恰在于测试交互设计的合理性及图形设计的美观性，主要通过以目标用户问卷的形式衡量UI设计的合理性。如果没有这方面的测试研究，UI设计的好坏只能凭借设计师的经验或者领导的审美来评判，这样就会给企业带来极大的风险。
字形的观察
字体首先是一种图形，然后再是可承载信息的文字，因此，当你挑选一款字体来搭配图片的时候，你需要集中去观察文字的形态特征是否和图片协调。
在挑选字体之前，首先观察图片里的形态（pattern)特征。如果配图是以插画的方式呈现，那么插画里的风格(style)细节，以及此类风格所表达出的年代感和空间氛围，都提供给你挑选与其所搭配（collocation)字体的依据。比如英文中的无衬线体通常较为现代，而衬线体较为古典。
下面的页面中的配图经过曲线造型，因此，与此搭配（collocation)的文字采用了Adelle无衬线体，可以看出字体中的圆弧处理(processing)和配图中曲线的流转造型相呼应。
字形合一，网页设计中的图文配
如下设计里的配图都是零散的矩形，因此与此相应采用的字体为graphik，这个字体的特点也是表现出非常清晰的几何边缘。
字形合一，网页设计中的图文配
以上的字形所带来的形态特征与配图相呼应即是一个能让图文实现完美搭配（collocation)的方式之一，此外，我们知道一些特殊的风格(style)化字体也能表达出特别的氛围。
例如下图中的机器看上去非常有80年代的机械（machinery）感，而这种造型也营造一种技术(Technology)世界里的怀旧感，因此像素文字最适合与此相搭配（collocation)。
字形合一，网页设计中的图文配
从这几款英文字体的实例图文配中，我们需要配以对“形”的观察解构能力。也同时需要对字体所承载的风格特征作出一定的归类。非但英文需要精挑细选，中文也需要认真的斟酌（zhēn zhuó)，而不能以期待偶遇一款好看的字体，以好看为目的进行设计(Design)，最终结果都是失败之作。
字体还可以经过一定的设计，在原有的字体基础上进行一定的“变形”，这当然就更不能频繁（frequency)更换。根据主题而进行一定的“微调”，让氛围表达得更加丰满立体。
如将圆圆的字母中空的部分填实增加了可爱感，与配图的角色形象也非常搭配。
字形合一，网页设计中的图文配
字距和行距
观察字形，用你敏锐的设计师的眼光来区别不同字体的特征，这是挑选比较大的字体时需要具备的能力。因此，非常适合用在首图、Banner等需要将文字做成图片所展示的情况下。而我们的字体还有形成段落进行展示的时候。这时，形的特征逐渐隐去，我们更多关注字与字之间的关系，即字距。
一般情况下，字距的选择(Select)总是根据字体本身以及其和空间的关系来决定，当字距较小时，传递出一种紧凑感，而字距宽松又能表达出一种轻松感。
比如大型展示字体的距离总是以相互靠近为佳，因为字体本身已经占据了足够的空间，如果再在字体间增加空间就会让整个空间被填满。因此，我们也可以说，字距根据整个空间进行调整确定。与此同时，配图也是以较为集中感的方式展示，所有箭头真是“万夫所指”，因此字距缩小，略有集中感。
字形合一，网页设计中的图文配
而相对较小的字体，略带轻松和闲适，与此搭配的图片也是一堆木材，联想到木匠的自然惬意感。
字形合一，网页设计中的图文配
在中文的世界里同样适用，然而不同的是，中文字体的距离应该更加远一点，以保持单个字体的独特展示度。UI设计学习UI设计师的涉及范围包括高级网页设计、移动应用界面设计，是目前中国信息产业中最为抢手的人才之一。因为中文的每个单字都可以看成一幅图画，拥有一定的意境，因此，保持字距是中文展示能保持美感的一个关键。
字形合一，网页设计(Design)中的图文配
当字体变为垂直展示时，更应该拉宽上下字距。这是由于我们人眼并不熟悉上下顺序的阅读习惯，如果字距较近则容易形成字与字的视觉粘连。
而行距则不同，当你考察行距时，这时字体已经变成了段落，成片出现的字体则是段落，你要关注的就应该是整个段落的灰度值。所谓灰度值就是字体的疏密。
较大的行距和较大的字距一样都能传递（transmission)出紧凑和轻松的不同之感，同时，行距也关联着字体本身的色彩、字距以及字体大小以及字体最终的形态。UI设计学习“UI”的本义是用户界面，是英文User和interface的缩写。UI设计师简称UID（User Interface Designer），指从事对软件的人机交互、操作逻辑、界面美观的整体设计工作的人。英文的行距可以以1.5倍作为标准尺度，然而一切规则都是依靠条件(tiáo jiàn)而存在，如果在特殊的场合，依然可以选用更大或更小的行距展示。
这一段落的字体等安排配合了配图中所传递（transmission)出的儿童的教育成长这一主题，选用较为圆润的字体，字距较宽松，体现出轻松的氛围。字体本身采用和LOGO一样的色彩，比黑色字体更透露出趣味。
字形合一，
评论(0)