如何为网站选择字体?

4

我不是网页设计师,更多的是网站应用程序的服务器端开发人员。就像音盲一样,我猜我是字体盲……也许我不知道我需要什么。

当你看Facebook时,它的

font-family:"lucida grande",tahoma,verdana,arial,sans-serif;

stackoverflow

font-family:Arial,Helvetica,sans-serif;

gmail

font-family:arial,sans-serif;

nytimes.com

font-family:georgia,"times new roman",times,serif;

维基百科

font-family:sans-serif;

人们是如何做出决策的?这是否与页面设计的其他因素有关?为什么这些网站有如此多的变化?是否有可读性的标准?

4个回答

7

在SO上:

除此之外,需要注意的是,对于网页,由于为了确保人们看到你想让他们看到的内容,你必须选择每个人都拥有的字体,所以只有非常有限的字体可供选择。

[编辑] 由于这个答案被接受,我认为我应该改进它。

我最近发现了一篇非常有用的博客文章,介绍了关于网络字体和不同操作系统的概述

此外,还有一个非常好的关于网络字体构造的解释。

酷而新:动态文本替换

对于那些重要的实现非标准字体(例如h1或甚至h2标签)的网站,一项真正酷的新技术是sIFR。这篇博客文章展示了它的实现方式。


3

首先,你需要做的最重要的决定是你想使用有衬线还是无衬线字体。在印刷媒介中,长文本通常使用有衬线字体,但大多数人更喜欢在计算机上使用无衬线字体。正如我所解释的那样,衬线可以作为眼睛可以抓住的锚点,因此使用衬线字体更容易阅读大段文字。对于大段文字来说,无衬线字体往往会更快地使眼睛疲劳。

关于实际字体,我想这更取决于个人口味。

最重要的是,建议网站最多只使用2至3种不同的字体。否则,它会干扰网站的一致性和易用性。在这种情况下,减少就是更多。


3
无论你选择什么字体,你的声明都应该以 ,sans-serif; ,serif; 或者, monospace; 结尾,因为这三种是用户代理保证渲染的唯一三种字体。
Arial、Verdana、Times 和 Courier 已经在我使用过的每个商业浏览器上呈现过。但是我知道在 Linux 上的开源浏览器通常不会有 verdana。
Georgia、Tahoma 等等都是一种完全的赌博,我建议远离它们或者备选更常见的字体。请注意,浏览器会挑选列表中能够呈现的第一个字体。

0

Facebook的字体声明似乎有点过度,除了Lucide Grande通常在Mac OS上找到,Tahoma在Windows上找到。如果您想玩得安全,一个单一的字体,在大多数操作系统上都可以找到,如Arial、Verdana或Times New Roman是可以的,接着是一个通用的(衬线、无衬线、等宽字体),如果指定的字体找不到,告诉浏览器选择适当的字体进行渲染。关于网页字体和CSS的学习资源,w3schools.com是一个很好的资源 - http://www.w3schools.com/css/css_font.asp

至于可读性 - 衬线字体在字形末端有一些细节,称为衬线,有助于填充字母之间的空间,使眼睛更容易水平跟踪文本。传统上,无衬线字体被认为在屏幕上更容易阅读,但这是由于旧版网络浏览器对衬线的渲染较差。现代网络浏览器使用操作系统级别的反锯齿技术(平滑)来更准确地呈现字体。

无论你做出什么选择,都应该考虑使用衬线字体和无衬线字体的组合来帮助在网页上建立强有力的信息层次结构。例如,你可以选择衬线字体作为标题,无衬线字体作为正文。

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接