Lighthouse 中的“链接没有可识别的名称”错误

ARTRU
链接没有可识别的名称

在使用 Lighthouse 或 PageSpeed Insights 等工具检查您的网站的过程中,您可能会收到“链接没有可识别的名称”的警告。在本文中,我们将了解这些错误以及如何修复它们以增强用户体验并提高网站在性能测量工具上的得分。

“链接没有可识别的名称”错误是 Lighthouse 和 PageSpeed Insights 等性能测量工具中报告的最常见错误之一。它通常出现在链接没有文本内容或仅包含无关紧要的字符(如“单击此处”)时。

与以下内容相关的错误 辅助功能 (用户体验、可访问性)在 Lighthouse / PageSpeed Insights 中。

灯塔中没有描述文字的链接错误
错误“链接没有可识别的名称”

在这种情况下,错误是由于缺少图像引起的 替代 (替代文本)。目的是当图像、按钮、图标加载失败时,将显示替代文本。

怎么修

要修复“链接没有可识别的名称”错误,您需要确保站点上的每个链接都有清晰的文本内容并准确描述链接的内容。以下是解决此问题的几种方法:

  1. 根据链接内容命名链接:使用准确描述链接内容的词或短语来命名链接。例如,“阅读有关产品 X 的更多信息”而不是“单击此处阅读更多信息”。
  2. 使用“title”和“aria-label”属性:当用户将鼠标悬停在链接上而不点击时,使用这些属性可以向用户提供有关链接内容的更多信息。
    例如: <a href="#" title="Đọc thêm về sản phẩm X">Đọc thêm</a>.
  3. 如果您使用图像或图标创建链接,请确保它们具有“alt”和“aria-label”属性以告知用户链接的内容。

我使用 WordPress,所以只需转到“媒体" -> “编辑” -> 填写“替代文本“是。

在wordpress中为图片添加alt标签
在wordpress中为图片添加alt标签
<img alt='alt image'>
<a aria-label='aria label icon'></a>
<button aria-label="aria label button"></button>

更多信息请访问: 标签和替代文本.

得出结论

“链接没有可识别的名称”错误会影响用户体验并导致网站在性能测量工具上的得分下降。但是,通过根据内容命名链接或使用“title”和“aria-label”属性向用户提供更多信息,可以很容易地解决这个问题。通过本文,希望您对“链接没有可识别的名称”错误以及如何修复它们有一个清晰的认识。

评论

相关文章