海外社媒SNS代运营Tiktok代运营公司
Revive Old Posts

您为 WordPress 网站选择的字体在整体设计中发挥着重要作用。 无论如何,这不是事后的想法。 如果您需要查看证据,只需将所有标题更改为 Comic Sans 即可! 好吧,这有点激烈。 但是,对于排版,即使是最小的变化也会产生重大影响。 感谢网络(尤其是谷歌),有大量免费的网络字体可以帮助您选择最好的字体。 因此,如果您正在寻找一些灵感或对当前网站进行字体升级,我强烈建议您浏览下面的列表,探索设计界必须提供的一些最佳网络字体。

2018 年最佳免费网络字体

https://www.youtube.com/watch?v=ldU4sIoGQ50

订阅我们的 YouTube 频道

以下是 2018 年可用的 40 种最佳网络字体(而且它们是免费的!)

1.机器人

best-web-fonts-1

Roboto 是几何形状和友好曲线之间的结合。 它创造了一种自然的阅读节奏,适用于标题、标题或体型。 精简版 Roboto Condensed 也非常受欢迎。

获取字体

2. 游乐场展示

best-web-fonts-2

Playfair 受到 18 世纪后期书写/印刷技术转型的影响; 当羽毛笔被尖头钢笔取代时。 它还受到字体设计师 John Baskerville 和 William Martin 为“Boydell Shakspeare”设计的字体的影响。 它非常适合标题和标题。

海外社媒SNS代运营Tiktok代运营公司

获取字体

3.打开Sans

best-web-fonts-3

设计为良好的中性字体 Open Sans 非常友好和可读。 适用于标题、标题或正文。

获取字体

4. 蒙特塞拉特

best-web-fonts-4

这种字体最初是由 Julieta Ulanovsky 创建的。 她的字体设计灵感来自她在布宜诺斯艾利斯附近的蒙特塞拉特看到的所有漂亮的标志和海报。 在所有大写字母的短标题上看起来很棒。

获取字体

5. 梅里韦瑟

best-web-fonts-5

这种衬线字体非常适合在所有类型的屏幕上阅读正文,因为它是为 Web 构建的。 它也适用于标题。

获取字体

6. 拉托

best-web-fonts-6

Lato 专为企业使用而设计。 它具有专业的外观,适用于各种尺寸。 它的半圆形细节也赋予它一种吸引大众的温暖。

获取字体

7. Bebas Neue

best-web-fonts-7

这种无衬线“全大写”字体非常流行,被认为是最好的免费网络字体之一,这是有充分理由的。 它为您的网站标题创建了令人惊叹的显示!

获取字体

8. 诺托三世

best-web-fonts-8

Noto Sans 的独特之处在于它的创建是为了在多种语言中看起来都很棒。 由于字母之间的水平间距,它在正文和包含大量内容的页面上看起来很棒。

获取字体

9. Source Sans Pro

best-web-fonts-9

Source Sans Pro 的设计主要考虑了用户界面。 这将是一个很棒的菜单字体,但也可以用于其他内容,例如正文。

获取字体

10. 奥斯瓦尔德

best-web-fonts-10

这种无衬线字体是一种很棒的网络字体,因为它的形成是为了适应数字屏幕的像素网格。 它是一种窄字体,不会占用大量空间,因此非常适合包含大量文本的大标题。

获取字体

11. PT Sans

best-web-fonts-11

PT Sans 是名为“俄罗斯联邦的公共类型”项目的一部分,旨在使多种语言的文本显示统一(类似于 Noto Sans)。 这种字体有多种用途。

获取字体

12. 魔方

best-web-fonts-12

rubik 字体是由 Philipp Hubert 和 Sebastian Fischer 设计的,旨在创建一种带有略微圆角的无衬线字体,其中字母完美地嵌入了魔方的正方形内。 该字体适用于标题和正文。

获取字体

13. Nunito Sans

best-web-fonts-13

这种无衬线字体是 Nunito 的非圆形版本。 它是一种流行的用户界面字体,非常适合仪表板、餐厅菜单和价目表等内容。

获取字体

14. Fira Sans

best-web-fonts-14

这种流行的网络字体最初是为 Mozilla FirefoxOS 设计的,以便在所有屏幕尺寸上清晰易读。 将其用作具有多种用途的现代类型。

获取字体

15. 无工作

best-web-fonts-15

这种无衬线字体被设计为简化的网络字体,在所有屏幕上看起来都很棒。 为大而宽敞的标题显示使用较重的权重,为易于阅读的正文使用常规权重。

获取字体

16. 爆米花

best-web-fonts-16

Poppins 是一种基于梵文设计的现代几何无衬线字体,突出了这种漂亮字体的几何圆形。 随意将此字体用于标题和正文,以获得非常赏心悦目的设计。

如果您没有注意到,它也是我们博客上使用的字体。

获取字体

17. Josefin Sans

best-web-fonts-17

这种字体是 Josefin Slab 的姊妹字体(也是一种很棒的字体)。 它的设计在几何上优雅,并增添了复古感。 对于较大的标题使用负字母间距,您可以保留它为您的正文提供的漂亮的默认字母间距。

获取字体

18. Ubuntu

best-web-fonts-18
Ubuntu 是一种为网络设计的无衬线字体,旨在成为一种通用字体。 适用于标题、标题、按钮和正文。

获取字体

19. PT 衬线

best-web-fonts-19

PT Serif 是 PT Sans 系列的新成员,因此两者作为字体配对可以很好地协同工作。 这是一种和谐的类型,几乎适用于任何事物。

获取字体

20.木里

best-web-fonts-20

这种无衬线字体非常适合具有极简设计的网站。 它最适用于大标题,但也适用于正文。

获取字体

21. 阿尔沃

best-web-fonts-21

Arvo 是一种几何衬线字体,旨在成为适合多种用途的“混合”字体。 它可用于标题、标题和正文。

获取字体

22. 氧气

best-web-fonts-22

这种 sans serif 字体是由 Vernon Adams 创建的,考虑到了用户界面。 它的设计清晰易读,因此在所有屏幕尺寸上看起来都很棒。 将其用于正文、菜单项和按钮!

获取字体

23. 罗威

best-web-fonts-23

Raleway 是一种优雅而纤细的 san serif 字体,可能最适合用于标题、副标题和标题。

获取字体

24. 诺托衬线

best-web-fonts-24

与 Noto Sans 一样,Noto Serif 旨在以多种语言在网络上看起来很棒,并且是一种出色的多用途字体,在所有屏幕上看起来都很漂亮。 将它与 Noto Sans 一起用作完美的字体配对。

获取字体

25. 努尼托

best-web-fonts-25

Nunito 是一种略微圆润的无衬线字体,非常适合大型显示排版。 它是一种流行的用户界面字体。 对大标题使用常规权重看起来非常好。

努尼托

26. 档案

best-web-fonts-26

Archivo 是一种怪诞的(较旧的)无衬线字体,具有很好的技术感觉。 它在网络上作为标题字体看起来特别好。

获取字体

27. Abril Fatface

best-web-fonts-27

顾名思义,Abril Fatface 是一种“更大”的类型。 它旨在改造经典的 Didone 风格。 特别是19世纪的英法广告海报。 这种字体非常优雅,可能最适合标题和标题。

WordPress花园建议你也读一下这篇文章  如何更改 HTML 字体颜色

获取字体

28. 外 2

best-web-fonts-28

Exo 2 是 Natanael Gama 设计的 Exo 的新版本。 这种现代字体具有技术和未来感。 与 Exo 不同,Exo 2 也适用于正文。

获取字体

29. 巴洛

best-web-fonts-29

Barlow 的灵感来自加利福尼亚的公众(车牌、标志、公共汽车等)。 该设计略微圆润,并具有浓缩版本,可在不占用大量空间的情况下制作出色的标题。

获取字体

30. Slabo 27px

best-web-fonts-30

Slabo 27px 是一种独特的字体(与其姊妹字体 Slabo 13px 一样)专门针对以其名称中的像素大小进行查看进行了优化。 这使它成为一种出色的网络字体,用于清晰、略微浓缩且易于阅读的标题。

获取字体

31. 阿莱奥

best-web-fonts-31

Aleo 是一种平板衬线字体,类似于流行的 Lato 字体。 它采用时尚和半圆形的细节设计,使其成为标题和正文的不错选择。

获取字体

32.流沙

best-web-fonts-32

这是一种显示无衬线字体,仍然是网络上的流行选择。 它具有几何设计,非常适合标题。

获取字体

33. 库珀休伊特

best-web-fonts-33

这种现代无衬线字体设计有独特的几何拱形,与其浓缩显示效果很好。 这种字体作为标题在所有大写字母中看起来都很棒,但也可用于常规正文文本。

获取字体

34. Ostrich Sans

best-web-fonts-34

Ostrich Sans 是一种现代无衬线字体,非常适合标题、徽标和标题。

获取字体

35. IBM Plex Sans

best-web-fonts-35

这种现代字体专为反映 IBM 品牌精神而设计。 它具有中立和友好的吸引力,可在您的网站上用于多种用途。

获取此字体

36. 鸬鹚

best-web-fonts-36

这种独特的字体是由 Christian Thalmann 从头设计(主要是绘制)的。 要突出字体的复杂性,请在您的网站上使用此字体以显示标题等更大的显示。

获取字体

37. Alegreya Sans

best-web-fonts-37

这种 sans serif 字体最初是为文学作品设计的,因此它作为正文的效果非常好,因为它始终保持和谐的段落间距。

获取字体

38. 自由富兰克林

best-web-fonts-38

这种无衬线字体是经典字体 Franklin Gothic 的现代版本。 将其用于标题或正文。 如果用作标题文本并与 Libre Baskerville 作为正文文本搭配使用,效果非常好。

获取此字体

39. 自由巴斯克维尔

best-web-fonts-39

这种漂亮的网络字体是一种高质量的字体,似乎非常适合独特且可读的正文。 如果与 Libre Franklin 搭配使用,效果会很好。

获取此字体

40. 斯巴达联盟

best-web-fonts-40

League Spartan 是一种单重(粗体)无衬线字体,非常适合创建强大而漂亮的标题和标题。

获取字体

脚本字体呢?

如果您发现列表中缺少脚本(或手写)字体,那么您没有错。 但这并不意味着没有一些很棒的免费软件(Mali、Indie Flower、Pacifico 和 Dancing Script 等等)。 您还可以查看这个漂亮的免费和高级脚本字体列表。

一些关于字体配对的快速提示

当希望更新网站的排版时,最好考虑不同字体如何协同工作。

以下是一些帮助您入门的提示:

  • 保持简单——不要一次使用太多字体。
  • 保持可读性。
  • 反着想。 例如,将衬线与无衬线或粗体与细线配对。
  • 或者,把它留在家里。 在同一个系列中使用不同的字体粗细和样式。
  • 尝试匹配您的内容的情绪。
  • 试验并保持有效的方法。

(对于 Google 字体,您还可以使用他们的免费配对工具)

有关字体配对的更多信息,请查看我们关于 7 个关键原则的完整文章。

最后的想法

我希望这个字体列表将有助于为您的下一个项目找到完美的字体。 请记住,其中许多字体将具有不同的粗细和样式,您可以调整它们以创建无数设计。 所以尽情探索吧!

干杯!

海外社媒SNS代运营Tiktok代运营公司
Revive Old Posts