在网页设计中要避免的6种字体

当你在做下一个网页项目时,避免使用这些字体。

没有发现。

网页设计中最糟糕的字体并不一定设计得很糟糕。

许多看起来很棒,而且我们经常会遇到。但他们的受欢迎程度也是他们的毁灭。当我们一遍又一遍地看到相同的字体时,我们对它们就变得麻木了,这促使我们对面前的内容产生更少的兴趣。

背景也是关键。在需要专业感的设计中,俏皮的字体会显得不协调。另一方面,过于严肃的字体会使一个风格更有趣的网站崩溃。

当然,有些字体在屏幕上看不清楚。

在我们开始之前,让我们来讨论一下一种字体是否适合网页设计。

易读性

易读性是一个主观的术语,它可以归结为区分一个字母和另一个字母的容易程度。不太容易辨认的字体往往是字母之间过于相似,以及小写字母和大写字母之间没有清晰区分的字体。当文本的字体不清晰时,就很难阅读。这将导致更糟糕的——更重要的是,更不容易获得的——用户体验。

其他影响可读性的因素包括:

  • 中风的重量:无论是大字体还是太细的字体都很难阅读。处于中间位置的字体更容易辨认。
  • 中风的对比:粗笔画和细笔画之间的比例,当比例过高时,可能会造成问题。不同大小的笔画混杂在一起,文字看起来混乱不堪,阅读起来令人沮丧。
  • 计数器字体中的留白,如果留白太小,会影响阅读。如果没有负空间,像“e”或“o”这样的字母就会被压扁,很难区分开来。
  • 字体的个性:装饰性和古怪的字体可能只适合作为显示字体,而那些柔和和更保守的字体可能在正文中很管用,但它们在更大的范围内可能会很无聊或无趣。

可读性

易读性和可读性是字体的两种不同特征。字体的易读性来自于它的设计。字体的可读性几乎完全掌握在设计师的手中,颜色、大小和间距等样式选择都影响着他们的感觉。

网页设计中应该避免使用的字体

最被滥用的字体

影响

字母书写的影响字体

发行于1965年的《冲击》具有一种清晰的风格,可以很好地转化为金属字体。20世纪90年代中期,从Windows 98开始,它在数字时代站稳了脚跟,微软在标准化网络类型的努力中推动了它的采用。

Impact有干净的字体,便于浏览。问题是它太常见了,随处可见——从办公室冰箱上的便条到剪贴画和表情包。考虑到它的过度饱和,《Impact》通常看起来笨拙且过于简单。

海维提卡

用Helvetica输入的字母
图片来源:维基

Helvetica植根于瑞士设计,具有一种永不妨碍的中立性。苹果、塔吉特和松下等品牌都在使用它,甚至还有纪录片关于它。

Helvetica字体也许是时尚字体设计的一个很好的例子,但现在它无处不在,让人感觉太安全了。Helvetica当然有它的位置,但有这么多字体,为什么不尝试一些让你与众不同的字体呢?

工整的哥特式

铜版哥特和样本字母在铜版哥特字体
图片来源:维基百科

铜版哥特式似乎遍布与法律、会计或其他传统商业领域相关的网站。这种过度使用已经让它变成了印刷上的陈词滥调。铜板哥特也有短截衬线设置与粗笔画重量,使它一个艰难的尺寸刚刚好。

在网络上释放你的创造力

不需要编写一行代码就可以构建完全定制的、可用于生产欧宝体育在线首页的网站——或者超高保真度的原型。只有Webflow。

订阅成为一个Webflow内幕
谢谢你!你已经订阅了!
哦!订阅的时候出了点问题。
免费入门

这是网页设计中最难做到的

维瓦尔第

用维瓦尔第字体输入的字母表
图片来源:维基百科

《维瓦尔第》用它的墨色和幻想的繁体吸引了你——尽管它对美学很有帮助,但它的易读性很差,而且在大多数网站布局中太容易分散注意力。

出血的牛仔

字母输入流血牛仔
图片来源:Fontmeme

《血淋淋的牛仔》并不总是一种受人唾骂的字体。它的“狂野西部与垃圾摇滚”的氛围曾经让人感到新奇和危险。但其不规则的字体在较小的尺寸下难以辨认,给用户的可读性带来了很大的问题。

“出血牛仔”也是一种有点过于具体的字体——这使得它很难融入到大多数(如果不是全部的话)设计中。

钢网

模板和样本字母写在模板字体
图片来源:维基百科

模板会让人觉得非常大胆。除非你设计的网站正好适合这种字体,否则最好避免使用这种字体。此外,这种字体没有小写字母的选项,使得许多人无法使用这种字体。

为你的设计找到合适的字体

字体在以一种人们可以轻松阅读的方式呈现内容方面是必不可少的。网页设计师应该避免的字体最终是那些容易混淆、难以访问或过度使用的字体。

学习更多关于排版的知识将会帮助你成为一名设计师。看看Webflow的排版阅读列表扩展你的知识,让你更好地了解如何为你的作品选择最好的字体。

发表

2022年7月14日

类别

资源

加入谈话

Webflow是什么?

免费试用
关于设计师的更多信息

设计师

可视化画布中CSS、HTML和JavaScript的强大功能。

的相互作用

可视化地建立网站交互和动画。

更多的互动

CMS

定义自己的内容结构,并使用真实数据进行设计。

关于CMS的更多信息

电子商务

再见模板和代码——可视化地设计你的商店。

更多关于电子商务

编辑器

在页面上编辑和更新站点内容。

更多关于编辑

举办

设置闪电般的管理托管在短短几次点击。

更多关于举办
Baidu
map