Question

我正在尝试在我的网站上使用“HelveticaNeueLTStd25UltraLight”。在OSX上，它在每个浏览器中看起来都很完美。在Windows上，它太可怕了：

铬： Chrome

IE： enter image description here

我正在使用以下CSS（如果重要）：

    @font-face {
    font-family: 'HelveticaNeueLTStd25UltraLight';
    src: url('../fonts/HelveticaNeueLTStd25UltraLight.ttf');
}


body{font-family:'HelveticaNeueLTStd25UltraLight'; font-weight:normal;}

/*** IE FONT ***/
@font-face {font-family: 'HelveticaNeueLTStd25UltraLight';
    src: url('../fonts/HelveticaNeueLTStd25UltraLight.eot');
    src: url('../fonts/HelveticaNeueLTStd25UltraLight.eot') format('embedded-opentype'),
         url('../fonts/HelveticaNeueLTStd25UltraLight.woff') format('woff'),
         url('../fonts/HelveticaNeueLTStd25UltraLight.ttf') format('truetype'),
         url('../fonts/HelveticaNeueLTStd25UltraLight.svg#HelveticaNeueLTStd25UltraLight') format('svg');
    font-weight: normal;
    font-style: normal;}

有人可以解释为什么会这样吗？我能做些什么呢？如果我必须使用其他字体，哪些字体可以安全使用？

Answer 1

Windows在浏览器中的字体渲染比OSX或iOS更糟糕。有时您可以通过选择浏览器抗锯齿看起来不太糟糕的特定字体大小来修复它。还有text-rendering: optimizeLegibility CSS属性，但根据我的经验，它往往弊大于利。

选择更适合网络显示的其他字体。 Google Web Fonts是一个很好的起点。他们有许多优秀的现代字体，这些字体都经过优化，可以用作网页字体，最重要的是它们提供了CSS等等 - 你需要<link>到<head>中的外部CDN CSS文件和你很好。 “Lato”和“Raleway”是我用来代替Helvetica Neue的字体。

此外，由于Helvetica Neue LT Std是一种商业字体，因此无论如何嵌入该字体几乎肯定是非法的，所以...

Answer 2

每个浏览器使用不同的方法呈现不同的字体，这就是为什么要包含这么多不同版本的字体，因为每个浏览器都使用不同的字体。 OSX拥有最好的字体渲染引擎之一，东西看起来很棒，但是在IE或FF或Chrome中看一下，事情往往会有所不同。除了尝试更厚一点的字体之外，你没有什么可做的。

你可以看到font-weight: 500可能有帮助。

瘦字体在Windows上无法正确显示

2 个答案: