时间戳

首页 > 解决方案 > 如何在搜索引擎结果中隐藏图标字体？

html - 如何在搜索引擎结果中隐藏图标字体？

问题描述

我在 html 中用于显示图标字体中的图标的文本出现在谷歌搜索结果中。我怎样才能阻止这种情况发生？

我已经添加了area-hiddenand role='img'，但是这些似乎没有任何影响。 

<span class="material-icons" aria-hidden="true" role="img">search</span>

我在网上环顾四周，主要发现了关于如何改进可访问性的信息，但没有太多关于如何从 googlebot 隐藏它的信息。

解决方案

根据下面@jake 的回答，我选择了以下内容。

HTML

<span class="material-icons" aria-hidden="true" role="img" data-icon="search"></span>

CSS

.material-icons::after{
    content: attr(data-icon);
}

标签： htmlcssfontsiconsseo

解决方案

这个问题以伪元素的形式提供了一个答案。

在这个 github 线程上，他们建议使用字体代码点：
https ://github.com/google/material-design-icons/issues/498

检查代码点和图标之间的映射。

推荐阅读