如何为WordPress网站添加谷歌字体
您的网站使用了正确的字体吗?
随着移动端互联网用户的日益增多,网站字体已逐渐成为网页设计师,出版商和零售商的重点关注对象。为此,BBC和英国《卫报》近日推出了专为手机阅读设计的新型字体,并调低了企业购买商业字体许可的相关费用。
当然,即使您并无庞大的预算,您同样可以更新站点字体以获得更棒的阅读体验,为浏览器和设备设计相一致的外观,并进一步降低页面加载时间以助您提升SEO排名。
何种字体最适合您的站点?
无论您是设计爱好者或热衷于尝试所有新奇事物,您都将在网站字体上打开新世界的大门。日前,网络上已有成千上万种开源字体可供下载和使用,用户可以购买其中几千种字体。
由于您希望网站字体易于加载和使用,那么您最好只在谷歌字体库中进行挑选。谷歌字体库是一种开放源代码的字体存储库,其中提供的字体缓存迅速,页面加载时间短,非常方便用户在小屏幕上阅读。截至目前,谷歌字体库共提供近848种字体系列,其中823种系列适用于英文文本。
因此,为缩小可选范围,您需要遵循供职于Canva的Janie Kliever 提出的字体选择基本原则:
2-3种字体是多数站点的理想数量。如果您坚持只选用一种字体,您的网站可能看上去千篇一律,访客也很难区分标题和主要内容。然而,一旦您选用的字体超出2-3种,整个网站不仅看上去杂乱无章,也会给用户留下不专业的印象。
选择有对比度的字体,创建视觉层级。比如,您可以使用粗体或衬线(serif)字体打造醒目标题,并采用简单的sans serif字体作为主要正文,要知道,这些字体完美支持智能手机扫描。
此外,Google Design提供了排印和字体的详细概述,当然,您也可以在挑选网站字体:新手指南中为您的网站找到最适合的字体。其中,您应该注意以下几点:
该网站是准备长期运营还是短期运营?长期运营的网站需要安装不同风格的字体系列。
该网站的文本块篇幅多长?如果文章通常包含五个或更多段落,相信衬线字体是个不错的选择。
该网站常用的字号?越简单的字体在小号字体下更容易阅读,但是作为标题可能不够醒目。
该网站访客会选择其他语言版本吗?如果答案是肯定的,您需要选择支持多脚本字符的字体系列,以正确显示各语言版本。
最后,该指南还针对特定场景为读者推荐了几款热门字体,希望对您有所启发。当然,您也可以点击这里浏览全部谷歌字体。
挑选适合自己网站的谷歌字体
当您遍览谷歌字体库时,面对着这繁杂的目录,您可能一时无法找到适合自己的网站字体。比如,以帮助宠物照料网站寻找字体为例,我们想为该网点的标题找到醒目、专业且充满诙谐元素的衬线字体。
首先,定位谷歌字体库中的搜索过滤侧边栏。在这里,您可以选择衬线字体类别,并根据年龄,热门程度或按名称的字母顺序来过滤目标字体。
接着在语言栏中,您可以选择“拉丁”选项挑出支持英文的全部字体(您可能有点疑惑,但我们的确使用拉丁字母表)。
然后,您可以选中对应的复选框以打开滑动菜单,并根据不同风格(如轻字体,加粗或斜体等字体变体),厚度,倾斜度和宽度对选项进行微调。
在选定“serif”和“Latin”后,您便为这家宠物照料网站挑选出了174种标题字体,不过感觉Bree Serif的效果最好。为预览网站文案,您需插入光标,清除虚拟文本,并输入“我们的宠物照料服务菜单”以替换默认文案。(当然,您也可以点击“应用所有字体”按钮以避免重复输入。)
您不仅可以使用滑块菜单在8-112像素之间调节字体大小,而且还能够使用左侧的下拉菜单预览文案的句、段呈现效果,或者字母和数字在对应字体下的外观。
此外,别忘记点击“+”按钮将Bree Serif加入底部的字体常用栏,在这里,您可以收集一些您偏爱的常用字体。当您准备最后的安装时,请点击黑色的选项栏,HTML和CSS代码将为您的网站安装字体。总之,您可以尽情下载喜欢的字体,但是由于下载会占用一定的时间和网站空间,谷歌通常建议您不要过多下载。
如何在您的网站上使用谷歌字体?
如果您愿意向网站添加代码,则可以根据Google Fonts API入门指南,参照样式表选择网站所需的字体系列和样式。此外,您还将了解如何优化字体以显著减少标题和logo的字体文件大小。
相反,对于那些不愿意编程网站代码的用户来说,他们可以安装相应的WordPress插件,让其帮助自己安装并管理谷歌字体。而其中最为著名的要属Easy Google Fonts,迄今已逾30万次下载。安装这款插件之后,您不仅可以免去编程站点主题代码的烦恼,同时还可以获得一份谷歌字体大全,再也无需手动选择和下载任何字体。
Easy Google Fonts在WordPress仪表盘的自定义版块添加了字体菜单,在这里,您可以为您站点主题的不同标题和文案搭配对应的字体,风格,颜色和其他文本元素。
您可以查看网页变更的实时预览,访客登录后只能看到您保存和应用之后的效果。为变更非主题默认控件的文本元素,Easy Google Fonts支持用户创建自己的字体控件,而该控件将显示在Typography(字体排印)菜单中。当您选定想用的谷歌字体,并确定预览显示正常,这时您可以保存和应用此次变更,以实时更新您的网站。
更新字体,升级网站
要知道,更新站点字体不仅意味着赋予网站全新的外观,其实还为访客提供了更为优秀的用户体验。尤其在这个智能手机撑起半边天的时代,要想为网站赢得大量的回头客,设计加载迅速的字体以提升受众阅读体验堪称实现这一目标的不二法宝。
相关阅读:WordPress主机比较常见的问题