使用 CSS 规则“文本渲染:优化易读性"是否安全?在所有文本上? [英] Is it safe to use the CSS rule "text-rendering: optimizelegibility;" on all text?

问题描述

我注意到这个 woo 主题 例如将它设置在 HTML 标签上，因此整个网站的文本都设置了它.我读到它会导致性能问题，但那是前一段时间.有些人建议只将它添加到标题和大文本中.

I noticed this woo theme for example has it set on the HTML tag and therefore the whole site's text has it set. I read that it can cause performance problems but that was a while ago. Some people suggested only adding it to headers and big text.

现在规则改变了吗?浏览器的性能好吗?

Have the rules changed now? Do browsers perform well with it?

推荐答案

否:多年来，各种平台上存在许多导致文本无法显示或显示不正确的错误(见下文).如果您的目标是启用连字，则实际上有标准属性 <代码>font-variant-ligatures 定义在 CSS 字体级别 3，提供完全控制:

No: there have been many bugs over the years on various platforms which cause text not to be displayed or displayed incorrectly (see below). If your goal is to enable ligatures, there's actually standard property font-variant-ligatures defined in CSS Fonts Level 3 which offers full control:

font-variant-ligatures: common-ligatures;
font-variant-ligatures: common-ligatures discretionary-ligatures historical-ligatures;

参见font-variant 用于其他可以启用的排版功能，例如小型大写字母、替代字母形式等.

See font-variant for other typographic features which can be enabled such as small caps, alternate letter forms, etc.

在 font-variant-ligatures 之前 &添加了相关属性，旧的 font-feature-settings 属性允许启用相同的功能.这是一个较低级别的接口，不再推荐，除非启用没有更高级别接口的 OpenType 功能.

Before font-variant-ligatures & the related properties were added, the older font-feature-settings property allowed the same feature to be enabled. This is a lower-level interface and is no longer recommended except to enable OpenType features which do not have a higher-level interface.

http://blog.fontdeck.com/post/15777165734/opentype-1 有一个简单的例子:

h1 {
    -webkit-font-feature-settings: "liga", "dlig";
    -moz-font-feature-settings: "liga=1, dlig=1";
    -ms-font-feature-settings: "liga", "dlig";
    font-feature-settings: "liga", "dlig";
}

http://elliotjaystocks.com/blog/the-fine-flourish-of-the-ligature/ 也有更多讨论.

流行的 HTML5 Boilerplate 项目两年前由于各种渲染问题将其删除:

The popular HTML5 Boilerplate project removed it two years ago due to various rendering problems:

https://github.com/h5bp/html5-boilerplate/issues/78

我今天早上刚修复的两个 Chromium 错误导致 Windows XP 上的 Chrome 21 要么根本无法执行字体替换，要么显示丢失的字符符号而不是使用不同字体的符号，以及显示文本错误地与其他元素重叠:

Two Chromium bugs which I just fixed this morning caused Chrome 21 on Windows XP to either fail to perform font substitution at all, displaying the missing character symbol rather than using one from a different font, and displaying text incorrectly overlapping other elements:

http://code.google.com/p/chromium/问题/详细信息?id=114719

http://code.google.com/p/chromium/问题/详细信息?id=149548

请参阅 http://aestheticallyloyal.com/public/optimize-legibility/ 了解其他一些问题.

See http://aestheticallyloyal.com/public/optimize-legibility/ for a few other concerns.

http://bocoup.com/weblog/text-rendering/ 强调了兼容性问题Android 和一般性能问题

http://bocoup.com/weblog/text-rendering/ highlighted compatibility problems on Android and general performance issues

这篇关于使用 CSS 规则“文本渲染:优化易读性"是否安全?在所有文本上?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！