正如配音演员的语调可以影响听众是否喜欢播客或有声读物一样，字体也会影响人们对所阅读内容的感受。根据一项2021年的研究，字体选择可以将读者的积极情绪提高多达13%。
随着字体的演变以适应网页，设计师除了字体给人们带来的感受之外，还需要考虑许多可用性因素。在选择网页字体时，字重可变性、字体支持的语言数量以及跨设备的加载时间和可用性都至关重要。
要为你的网站设计选择最佳字体，请在下方找到 Framer 的最佳实践，以及最佳网页字体的汇总。
如何为你的网站选择最佳字体
Open Sans 和 Lato 等字体无处不在是有原因的：它们易于阅读、全面且用途广泛。但你不必拘泥于最普遍的字体来为你的当前项目找到最合适的。以下是在选择网页字体时需要注意的地方：
首先解决易读性问题
用户大约需要50毫秒来决定是否停留在你的网站上。如果你的网站排版难以阅读，访问者可能就不会停留。
易读性讲究的是平衡：易读的字体将拥有足够高的下行字母，以便于识别，但又不会高到与大写字母混淆。其笔划宽度会有所不同，但不会明显到引起眼睛的注意。
最后，一些细微的细节，例如衬线，可以帮助眼睛在字母之间建立联系，但过多的连接和装饰可能会分散注意力。字母之间的间距等因素也可能起作用——再次强调，你需要达到平衡。
寻求广泛范围
下载华丽的字体却发现它缺少项目所需的字重、字形和语言的广度，这很快就会导致沮丧（并浪费时间）。当你浏览字体时，请确保字体系列包含多种字重。理想情况下，它也是可变的，这意味着字重可以在同一个字体文件中从最细到最粗动态变化。你的选择越全面，你的网站设计在未来就会越灵活。
了解你正在下载什么
对于你使用的任何字体，请仔细阅读许可规则，以确保你或你的客户拥有按你预期使用该字体的权利。虽然 Google Fonts 等服务上的常见、中性字体是开源的，这意味着它们可以免费用于商业用途，但许多定制或独特的字体只能通过付费许可或字体铸造厂订阅获得。
无论是从字体铸造厂获取许可文件还是下载开源字体，请确保你获取的是 WOFF/WOFF2 文件，而不是仅限于桌面的文件，如 OTF 或 TTF。
使用 Framer 构建时，你可以使用Framer 自己的开源字体集合。你还可以上传你自己的自定义字体（但请注意自定义字体可能会减慢加载时间）。
25种最佳网站字体
Inter
Satoshi
Manrope
Ribes
Aspekta
Domine
Ojuju
Instrument Serif
Barlow
Chakra Petch
Unbounded
Tanker
Public Sans
Ortica
Space Grotesk
Cabinet Grotesk
Pencerio
Stardom
Zodiak
Melodrama
Archivo
EB Garamond
Caprasimo
Gambarino
Epilogue
1. Inter
字体类型：可变；无衬线
Inter是一款功能性强、简洁的无衬线字体，旨在提高易读性。它由瑞典工程师 Rasmus Andersson 于2017年在旧金山创建。经过更新，它可以在任何地方被任何人使用：它有超过2000个字形、147种语言和可变字重，使其适用于几乎所有用途。
最适合：
现代设计
正文和/或显示文本
设计前卫的品牌、电子商务、作品集
2. Satoshi
字体类型：可变；无衬线
由 Deni Anggara 为印度字体铸造厂设计，Satoshi是一种带有工业感的几何无衬线字体。几何元素的俏皮与无衬线实用主义之间的张力使其成为一种迷人的字体风格。Satoshi 可以为各种行业的品牌注入生命力，无论是设计公司还是消费品品牌，它都能带来平易近人、注重设计的品牌形象。虽然它的字形库相对较小，但它是可变的，支持10种字重和135种语言。
最适合：
现代设计
正文和/或显示文本
设计前卫的品牌、消费品、电子商务、作品集
3. Manrope
字体类型：可变；无衬线
Manrope是一种现代无衬线字体，设计时考虑了多功能性，使其适用于数字和印刷环境。通过几何结构和人文主义细节的平衡，Manrope 在保持精致感的同时，也显得平易近人。其宽泛的字重范围支持从细微的正文到醒目的标题，确保在任何尺寸下都具有可读性和视觉冲击力。与更严谨的无衬线字体相比，Manrope 更平滑的曲线和开放的形态传达了清晰和温暖，使其非常适合现代、用户友好的设计。
最适合：
数字产品和界面
品牌和编辑设计
科技、初创公司和现代消费品牌
4. Ribes
字体类型：无衬线
虽然传统字体的水平笔划细而垂直笔划粗，但像Ribes这样的反差字体则恰好相反。由此带来的独特、陌生感让你眼前一亮。凭借其怀旧感和引人注目的几何形状，这款有趣的字体非常适合具有独特和略带复古风格的品牌。Ribes 通过Collletttivo字型公司来到 Framer，由 Luigi Gorlero 设计，包含三种字重。
最适合：
具有复古风情的现代设计
显示文本
食品和饮料、娱乐、设计前卫的品牌
5. Aspekta
字体类型：可变；无衬线
凭借其平衡的形状和流畅的曲线，Aspekta是一种可以信赖的字体，它支持易读性和多功能性。与 Inter、Pretendard 和 Helvetica 一样，Aspekta 足够中性，通过正确的样式设计，它可以显得智慧和创新，也可以显得时髦和潮流。Aspekta 是可变的，提供20种静态字重和18种语言，适用于各种品牌、电子商务和营销用例。
最适合：
功能性强、平易近人的设计
正文和/或显示文本
户外装备、家居用品或健身品牌
6. Domine
字体类型：可变；衬线
专为网络上的长篇阅读而设计，Domine将印刷报纸和杂志的传统带入了互联网时代。通过缩短衬线，Impallari Type 的设计师 Pablo Impallari 使 Domine 即使在微小尺寸下也能在屏幕上轻松渲染。渴望在早餐桌上沉浸在杂志特写中的怀旧读者会觉得 Domine 让他们感到舒适。
最适合：
知性、温暖的设计
正文和/或显示文本
新闻媒体和博客、文具品牌、出版公司
7. Ojuju
字体类型：可变；无衬线
另一种反差字体，Ojuju的设计师 Chisaokwu Joboson 和 Mirko Velimirović 从传统非洲舞蹈服装和1970年代非洲电影海报中汲取灵感。Ojuju 提供可变字重和七种固定字重，用途广泛，引人注目。
最适合：
非洲风格的设计
显示文本
娱乐、食品和饮料、家居用品
8. Instrument Serif
字体类型：衬线
专为同名品牌代理机构Instrument设计，这款字体为互联网时代更新了复古衬线字体。由于其紧凑的风格在较小尺寸下可读性较差，因此推荐用于带有略微不敬（正如任何优秀的品牌代理机构都应如此）的显示字体。
最适合：
知性、有主见的品牌
显示文本
新闻媒体和博客、文具品牌、代理机构
9. Barlow
字体类型：无衬线
设计师 Jeremy Tribby 从加州公共基础设施中汲取灵感，创造了Barlow，这是一款多功能的无衬线字体，也提供半紧凑版和紧凑版。由此产生的广泛范围使 Barlow 成为一种可以独立承载整个品牌的字体，无需第二种字体，从醒目的展示时刻到密集的正文。Barlow 非常适合具有社会公益或 civic engagement 组成部分的项目。
最适合：
现代、功能性设计
正文和/或显示文本
公共服务、食品和饮料、科技、健身
10. Chakra Petch
字体类型：无衬线
Chakra Petch是来自标志性泰国字体铸造厂 Cadson Demak 的独特声明字体。其锥形角具有几何效果，可以使字体看起来像刻在玻璃上或像素化，为设计师提供了广泛的美学范围。尽管它充满趣味性，Chakra Petch 仍然具有高度的易读性，即使是斜体，也使其适用于各种网站。
最适合：
时髦或未来主义设计
显示文本
科技、设计前卫的品牌
11. Unbounded
字体类型：可变；无衬线
凭借其人字形细节和斜视字怀（意指圆形字母的内部形成侧向泪滴状，而非圆形），Unbounded的独特之处恰到好处地吸引你的注意，而不会让人感到不知所措。Unbounded 的开发者认为这款字体是首次通过区块链资助的项目，这使其成为科技和金融品牌合适的选择。
最适合：
俏皮、未来主义设计
显示文本
科技、金融、健身、设计前卫的品牌
12. Tanker
字体类型：无衬线
最适合：
有主见的、积极的设计
显示
政治、新闻或交通品牌
一款带有圆角笔划的紧凑型无衬线字体，Tanker感觉就像属于一部战争纪录片的电影海报，或是一场抗议活动的标语。它在表达主张的同时，其圆润的细节又赋予了它柔和、亲切的一面。
13. Public Sans
字体类型：可变；无衬线
由美国总务管理局开发，旨在使政府网站现代化，Public Sans故意保持中性。它优先考虑易读性和可访问性，使其成为公共服务、法律或金融领域的专业网站的有力选择。
最适合：
现代、功能性设计
正文和/或显示文本
公共服务、法律、科技、金融
14. Ortica
字体类型：衬线
Collletttivo将Ortica称为“书法衬线”，因为它具有圆润的曲线和锐利的衬线。它的 Angular 版本让人联想到切割的宝石，让读者想起餐具或彩色玻璃窗。作为一种大型、华丽的显示字体，Ortica 具有令人眼花缭乱的活力。
最适合：
优雅、现代的设计
显示
食品和饮料、酒店、奢侈品牌
15. Space Grotesk
字体类型：可变；无衬线
基于固定宽度字体但经过更新以提高易读性，Space Grotesk对于软件工程师和设计师来说会立即感到熟悉。在任何字重下都很有趣，并包含各种字形，Space Grotesk 非常适合任何注重科技的现代项目。
最适合：
未来感、友好的设计
正文和/或显示文本
科技、科学或汽车品牌
16. Cabinet Grotesk
字体类型：可变；无衬线
Cabinet Grotesk独特的笔划连接和弯曲的笔画末端使其比普通的无衬线字体更具趣味性，同时仍然易于阅读。凭借大量的字形和连字，印度字体铸造厂的设计师们意图将其用于编辑设计。Cabinet 是寻求将其现代网络形象与传统尖锐的编辑印刷设计相结合的品牌的完美选择。
最适合：
精致设计
正文和/或显示文本
编辑、时尚和生活方式品牌
17. Pencerio
字体类型：草书
很难找到一种不显得过时、俗气或完全难以辨认的草书字体，但Pencerio恰好符合要求。凭借庞大的字形库和均匀的笔划粗细，这款字体可以在所有优雅的场景中独当一面，从邀请函到社论。
最适合：
带有复古气息的优雅现代设计
显示文本
食品和饮料、酒店、生活方式
18. Stardom
字体类型：衬线
由 Indian Type Foundry 设计，旨在用于超大尺寸，Stardom是杂志设计师梦想中的标题字体。它让人想起《Vogue》和《Elle》等杂志的印刷辉煌时代，其前卫的下延笔划使其充满新意。
最适合：
精致设计
显示文本
社论、酒店或奢侈品牌
19. Zodiak
字体类型：可变；衬线
Zodiak被其设计师称为“坚固”的衬线字体，具有强大的笔画末端和大量的字符。无论是设置醒目的标题还是密集的正文，Zodiak 都传达出一种老式精致与现代多功能性相结合的感觉。这款字体非常适合将自己定位为思想领袖或潮流引领者的品牌。
最适合：
知性、温暖的设计
正文和/或显示文本
新闻媒体和博客、文具品牌、出版公司
20. Melodrama
字体类型：可变；无衬线
Melodrama的高对比度笔划传达出强烈的戏剧性，无论是在屏幕上还是在下班后。想象它出现在一张老好莱坞黑色电影海报上，或者在烟雾缭绕的酒吧菜单顶部，使其成为一个确切知道自己定位的生活方式网站的理想选择。
最适合：
经典、复古风格设计
显示文本
夜生活、食品和饮料、娱乐或酒店品牌
21. Archivo
字体类型：可变；无衬线
在全球超过一百万个网站中使用的Archivo是一款高性能的字体，其根源在于美国的标题排版。自2021年以来，它已作为可变字体提供，字重从超细到超重，大大增加了其多功能性。
最适合：
智能、亲和的设计
正文和/或显示文本
科技、媒体或医疗设计
22. EB Garamond
字体类型：可变；衬线
作为16世纪原始字体基础的现代再现，EB Garamond于2019年进行了更新，成为可变且适用于网络的字体。其低对比度的笔触和柔和的衬线，即使在最清晰的现代屏幕上，也感觉像是刚用墨水描绘出来的。
最适合：
经典、严肃的设计
正文
新闻、出版物和学术界
23. Caprasimo
字体类型：可变；无衬线
最初设计作为Cooper Black的备用字体，Caprasimo具有20世纪70年代教科书或专辑封面的复古感。它在大型尺寸下表现出色，突出了其弯曲的终端和厚重的连字，同时给人一种深情而有趣的感觉。
最适合：
经典、复古风格设计
显示文本
服装和配饰品牌、书籍封面、音乐和娱乐项目
24. Gambarino
字体类型：衬线
与 Instrument 类似，这款由 Théo Guillard 设计的紧凑、复古风格衬线字体最适合标题：其倾斜的笔划连接在大型尺寸下效果最佳。可以尝试将Gambarino用于罐装鸡尾酒的广告或可持续棉花品牌。
最适合：
经典、复古风格设计
显示文本
食品和饮料、酒店、家居用品
25. Epilogue
字体类型：可变；无衬线
凭借其圆润的特征和时髦、简洁的细节，Epilogue感觉就像属于上世纪80年代意大利乡村的鸡尾酒菜单。而且它有18种样式，感觉更像是一对字体而不是一个大字体家族。
最适合：
具有欧洲风情的经典设计
正文和/或显示文本
食品和饮料、酒店
网页字体与网页安全字体
当人们谈论“网页字体”时，通常指的是在网站 CSS 中定义、在线托管并以 WOFF/WOFF2 文件等网络优化格式上传到服务器的字体。但仅仅因为字体在网络上并不意味着它一定是网页安全字体。
为了使字体成为网页安全字体，即使服务器或自定义字体文件失败，它也应该能够加载。为此，字体需要安装在用户设备上。
在网络早期，所有的网页字体也都是网页安全字体，因为字体样式是在网站的 HTML 中定义，而不是 CSS 中，并且托管在用户的个人计算机上。这就是为什么许多早期网站都使用 Times New Roman、Arial、Tahoma 等基本字体。当自定义字体在大约2009年或2010年通过 CSS 可用时，网络焕然一新。现在，网站可以拉取更有趣的字体。
如今，一小部分字体，如 Arial 和 Times New Roman，通常会预装在所有设备上。这些字体是网页安全的，而像 Barlow 这样的更现代的字体则只被视为网页字体。
在 Framer 上找到您最适合的字体
Framer 允许你直接从平台为你的项目选择最佳字体：除了涵盖开源字体的全面库，你还可以轻松上传自己的字体，在任何网站设计中使用。
选择了完美的字体后，请注册 Framer，并从Framer Marketplace中的可复用网站模板开始你的设计之旅。