firefox和IE中使用带有utf8的webfonts的特殊字符问题

Question

我ü使用UTF-8编码和字体' ü'和' ü' 的char有问题.

使用safari和chrome是没有问题但是当我在Windows或Mac或IE上的Firefox时,问题可以在这里看到:

ü并且ü是来自Google的webfonts - Helvetica是一种本地字体.

在BrowserStack上也测试了它 - 同样的问题.

那么我该如何解决这个问题呢？

有问题的网站

Answer 1

原因是你有一个以分解形式表示的字母"ü",因为"u"后跟一个组合分音符,例如

<strong style="color: #CE5A5A;">Von der Gru?ndung im Musikpark zur Marktfu?hrerschaft</strong>

用"ü"U + 00FC LATIN小写字母U替换"ü"(U + 0075 LATIN SMALL LETTER U U + 0308 COMBINING DIAERESIS)和DIAERESIS.它们可能看起来完全相同,但它们可能不会 - 在这种情况下,它们不会,因为Lato不包含U + 0308,因此浏览器从Arial或其他字体中选择它,导致排版灾难.

如果您使用W3C HTML5验证程序检查页面,您将收到一些警告"文本运行不在Unicode规范化表单C中."其中至少有一个以分解形式引用"ä"(在"lädt"中,这是也很糟糕地显示了),它也应该修复.

当您以预组合形式使用Unicode中存在的字符的分解形式时,例如"ä"和"ü",文本不在标准化表格C(NFC)中.这不是无效的,但它并不常见,并且可能会导致这样的问题,而且一般的W3C策略(虽然在HTML5 CR中没有说明)有利于NFC.

Answer 2

对于 2019 年仍在寻找此问题解决方案的人来说，有一个 ES6 解决方案，这将解决您的所有问题:)

string.normalize('NFC')