当您使用有关 SEO 的背景图像时，使用 alt-text 的最佳方法是什么

Question

我想确保以下解决方案针对 SEO 进行了优化，或者至少能够在整个 HTML 代码中检测到。

我正在工作的网站都是关于图片的，所以主要这是我必须担心的最重要的问题。

1.第一种方法也是我最喜欢的方法，因为当我将鼠标悬停在图片上时，您已经可以看出，通过单击图片，您将被重定向到另一个页面，因为浏览器内的默认链接 animation：

<div class="table">
    <a href="NEW LINK" alt="TAGS" class="thumbnail" style="background-image: url(LINK);">Tags</a>
</div>

正如您在上面看到的，我在两个位置添加了标签。

创建了一个替代品

在标签内

2. 我在互联网上找到的第二种方法是在寻找我现在问的相同问题时：

 <div class="table"> <span onclick="NEW LINK" class="thumbnail" role="img" style="background-image: url(LINK);" aria-label="TAGS"></span> </div>

Answer 1

<a>标签不支持alt属性。 如果您使用背景，最好的选择是使用aria-*属性，正如您发现的那样， role="img"和aria-label=""

Answer 2

您可以在 div 中添加实际图像并使用自定义代码将其设置为背景图像，通常：这是“规则”。 用标准内嵌图像替换非装饰性 CSS 背景。