Windows字体问题以及如何为客户调试

Question

最近有一位客户发送了一张票，抱怨他们的字体发生了变化（在一周左右的时间内）。网站上的字体大概十年没有变过。我怀疑可能是最近一次 windows 与更改时间一致的更新正在影响他看到的字体，或者更有可能是他这边的设置发生了更改。

我们使用的字体

font-family: "Helvetica Neue",Helvetica,Arial,sans-serif

据我了解，Helvetica Neue 可能会被 windows 上的其他内容替换，因为仅通过谷歌搜索，我发现 windows 中不包含字体。

我的问题是，有没有什么方法可以帮助他调试它以弄清楚到底发生了什么？它确实让该用户难以阅读该网站，我想修复它，并且也确定我在说什么。我通常会非常努力地不只是回复“在我的机器上看起来不错”。检查它显示了与我上面发布的相同的字体系列。

None 中 css 中的字体选项似乎是显示的内容。

我在字体中看到的一个显着特征是字母 de 重叠或接触。

这是针对网络内容的，提到的浏览器是最近 Chrome，我也测试过（验证了完全相同的版本号）但没有问题，而我没有的 Edge。

Answer 1

调试方法：查看具体电脑是否安装了Helvetica字体。您可以通过转到 windows 的字体设置来执行此操作。要打开字体设置，只需打开 windows 搜索并输入 Font:

字体设置将向您显示计算机中安装的可用字体。在搜索栏输入Helvetica，查看是否安装了Helvetica字体：

如果不是，你可以去那台电脑上下载安装字体，问题就解决了。

CSS解决方法：为了避免以后再出现这个问题，可以在项目中包含该字体的.ttf文件，并使用@font-face将其设置为字体你的项目。

@font-face {
  font-family: "digital-7";
  font-style: normal;
  src: url("~/assets/fonts/digital-7.ttf");
}

你可以这样使用它：

.container{
  font-family: "digital-7";
  font-size: 4em;
  color: black;
}

Answer 2

我没有可靠的消息来源可以提供，但这种情况以前发生在我身上。这是我安装了一个类似名称的错误字体造成的。

阅读大多数网站简直就是地狱，我必须获得一个 chrome 扩展名才能将所有内容更改为 Arial 以便于阅读。询问他们是否在其他网站上也遇到了这个问题，然后告诉他们删除他们计算机上的“Helvetica Neue”字体文件（如果有帮助，我的名为 Helvatica Neue56878）。这解决了我的问题。

Answer 3

如果您无法访问他们的计算机，将很难查明确切原因。 Windows 字体替换是这种情况下的罪魁祸首：

如此处所述：

https://office-watch.com/2021/windows-substituting-arial-font-for-helvetica/

"Windows 被设置为在看到对 'Helvetica' 的引用时使用 Arial。这发生在 Windows 级别并且不仅仅适用于 Microsoft Office。大多数网络浏览器得到同样的事情 – 要求在网页中显示“Helvetica”的网页将改为使用 Arial 字体。这让网页设计师发疯，特别是因为 CSS 可以从一系列首选字体中进行选择。

在 Windows 注册表的深处是 HCLM\SOFTWARE\Microsoft\Windows\NTCurrentVersion\FontSubstitutes，它列出了替换项。“

此外，如果您运行比较 arial 与 helvetica neue...使用您提到的视频一词，您会得到：

请注意字符 'd' 和 'e' 之间的字距调整（letters/characters 之间的分隔）的差异。与 Helvetica Neue 相比，Arial 出现 'clumped'。

Windows字体问题以及如何为客户调试

Windows font issue and how to debug for customer

css

fonts