html - 当您使用有关 SEO 的背景图像时，使用替代文本的最佳方法是什么

Question

我想确保以下解决方案针对 SEO 进行了优化，或者至少能够在整个 HTML 代码中检测到。
我工作的网站只有图片，所以这主要是我必须担心的最重要的问题。
1.第一种方法也是我最喜欢的方法，因为当我将鼠标悬停在图片上时，您已经可以知道通过单击图片您将被重定向到另一个页面，因为浏览器中的默认链接动画是:

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

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

创建了一个替代

标签内

我在互联网上找到的第二种方法，同时寻找我现在问的相同问题:

<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=""