即使在使用 font-display:swap 之后，Page Speed Insight 仍会显示“确保文本在 webfont 加载期间保持可见”审核

编程问答 2022-04-25

问题描述

page speed insight

页面速度洞察建议在相应的 css 中添加一行 font-display:swap;，我在下面以 fa-solid-900.woff2 为例进行了此操作。当我查看 index.html 文件时，我可以确认此 css 已正确列在 <head> 标记中。但是，当我检查页面速度洞察时，它仍然将此字体列为审核。

澄清一下，这是一个 wordpress 网站，使用 autoptimize 内联了 css。

我有一种感觉，这可能是 css 的问题。可能顺序不正确，或者语法错误。但是由于我对 CSS 的了解有限，我就是不知道我不知道的东西。

index.html 文件中的 CSS：

            @font-face {
                font-family: 'FontAwesome';
                font-display: swap;
                font-style: normal;
                font-weight: 900;
                src: url(//sggtech.com/wp-content/themes/x/framework/dist/css/site/stacks/../../../../fonts/font_awesome/fa-solid-900.woff2) format("woff2"),url(//sggtech.com/wp-content/themes/x/framework/dist/css/site/stacks/../../../../fonts/font_awesome/fa-solid-900.woff) format("woff"),url(//sggtech.com/wp-content/themes/x/framework/dist/css/site/stacks/../../../../fonts/font_awesome/fa-solid-900.ttf) format("truetype")
            }

正在列出审核链接：

https://sggtech.com/wp-content/themes/x/framework/fonts/font_awesome/fa-solid-900.woff2

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）

autoptimizehtmlwordpresswordpress