Google 字体示例页面和单独页面中的用法之间的 Barlow 渲染差异

Barlow rendering difference between Google Fonts example page and usage in a separate page

我们在 Web 应用程序中使用 Google 字体免费提供的 Barlow。这是在 Google's example page 上呈现时示例短语的外观。 (如果要复现,需要自己输入自定义文字,将滑块调到14px。)

请特别注意 i 底部与其上方的点之间的明显 space,以及 f 顶部的清晰度。

这是在我们的应用程序中呈现的同一个短语的外观,如此 Code Pen

注意 i 及其点之间的泥泞 space,以及 f 的泥泞顶部曲线。

我已经尝试查看相关元素的所有样式,但我找不到任何应该对这些元素产生不同影响的样式。网络选项卡清楚地显示正在加载字体的粗体版本;这看起来不像是人造粗体。

这可能看起来微不足道,但实际上我们对字体在我们的应用程序中的外观有很多抱怨,特别是粗体小写 i 看起来像 l

有人知道这里会发生什么吗?

更新: 在 Mac 上使用 Chrome;我可以在 Firefox 中确认同样的问题。这是在外部显示器上...在视网膜上没有问题,因为有更多细节。

问题原来是 a problem with the source repo:"hinting got missed in the most recent commit" 而 Google 标本(看起来正确)是 "actually running an earlier version."

令人高兴的是,维护者能够在后续版本中修复该问题。