网页设计中字体和图片的匹配技巧

有人说中文网页的设计没有字体设计,因为网页可以使用的中文字体非常有限,只有粗体、宋体、微软雅黑等。可以使用,这给中文网页的美感带来了损失。相比英文对字体的考虑,网页上的中文字体太随意了。

当然,这种说法在某种程度上是正确的,但我们应该从另一个角度来看。中文网页中的字体确实仅限于这些字体,但并不代表中文网页没有字体设计。

理解网页设计中的“词”

我们简单地将网页中的文字划分为可替换和不可替换的部分。

可替换词是可以通过后台管理进行编辑的词,如博文、产品描述等。网页制作过程中设置了不可替代的字符。后台管理不为字符提供编辑条件,只能通过网页代码进行修改,如导航、Banner等。不可替换的文字完全不能修改,但是修改一次会花费一定的金额,所以修改间隔,比如导航修改,需要经过代码,Banner中文字的修改也需要重新设计Banner图片。

备选字符只能使用网页允许的给定字体,因此中文字体的选择范围较窄。然而,不可替代的字符可以通过图片等来显示。并制作成透明背景的图片。这时字体的使用和排版都比较灵活,设计师会有足够的创作自由。

设计使用的字体都有一定的设计技巧,字体替换不是很容易。

这里所谓的带图搭配也是指这种可以设计的人物。

字形观察

字体是图形,然后是承载信息的文本。因此,在选择与图片相匹配的字体时,需要重点考虑文字的形态特征是否与图片相协调。

在选择字体之前,观察图片中的形态特征。如果插图以插图的形式呈现,那么插图中的风格细节,以及这种风格所表达的时空氛围感,都可以为你选择与之搭配的字体提供依据。例如,英语中的无衬线通常更现代,而衬线则更古典。

上述字形带来的形态特征与图片的匹配是使图文完美匹配的途径之一。此外,我们知道一些特殊的风格化字体也可以表达一种特殊的氛围。

我们需要观察和解构“形”的能力。同时,还需要对字体所承载的风格特征进行分类。英语不仅要精挑细选,中文也要慎重考虑,而不是以期待遇到漂亮字体为目的进行设计,结果是失败。

字体也可以在原有字体的基础上进行设计和“变形”,当然不能频繁改动。根据主题做一些“微调”,让气氛更加饱满立体。

比如填充圆字母的空心部分,增加了一种可爱感,也非常兼容有图片的角色形象。

字间距和行距

用你敏锐的设计师的眼睛观察字形,区分不同字体的特点,是你选择较大字体时需要的能力。所以非常适合张图片,Banner等。其中文本需要显示为图片。我们的字体可以显示在段落中。这时,形状的特征逐渐淡化,我们更注重字与字之间的关系,即字间距。

一般来说,字距的选择总是由字体本身及其与空间的关系决定的。字距较小时,传达出紧凑感,而宽松的字距可以表达出轻松感。

比如大规模显示字体之间的距离总是很近,因为字体本身已经占据了足够的空间,如果在字体之间增加更多的空间,整个空间就会被填满。所以我们也可以说,字距是根据整个空间来调整确定的。同时画面显示更加集中,所有箭头真的是“千夫所指”,字间距缩小,有轻微的集中感。

相对较小的字体略显轻松闲适,与之相匹配的画面也是一堆木头,与木匠的自然舒适相联系。

它也适用于汉语世界。但不同的是,中文字体之间的距离应该更远,以保持单一字体的独特显示。因为汉语中的每一个字都可以看作是具有一定意境的画面,所以保持字距是汉语展示中保持美感的关键。

当字体垂直显示时,上下字距应该加宽。这是因为我们人类的眼睛对于上下顺序的阅读习惯并不熟悉,如果字间距比较近,很容易形成字与字之间的视觉粘连。行距不同。检查行距时,字体变成了段落,出现在一段中的字体就是段落。你应该注意整个段落的灰度值。所谓灰度值就是字体的密度。

大行距,像大字距一样,可以传达紧凑和轻松的感觉。同时,行距还与字体的颜色、字距、字号和形状有关。英文行距可以是标准比例尺的1.5倍,但是,所有规则都取决于条件。如果在特殊场合,仍然可以选择更大或更小的行距进行显示。

明确字体的字间距所创造的密度,行距会带来段落的灰色几何。配合字体本身的显示形式,可以更好的选择匹配的图片。对字体有更多的了解,对不同风格字体的形状有一个大概的了解,这样在使用的时候就不会到处瞎找合适的字体了。通常对于字体的积累是极其重要的。记得给自己打造一个字体,这样在图文匹配的时候就可以得心应手了。