header 徽标或背景图像使用 IMG 元素更好，为什么？
Is it better to use an IMG element for a header logo or a background image, why?
我经常看到诸如 Whosebug 之类的网站将其徽标作为背景图像嵌入，并为 screen-readers.
的文本添加 span 标签
<a href="https://whosebug.com" class="-logo js-gps-track">
<span class="-img _glyph">Stack Overflow</span>
</a>
为什么要这样做而不是使用带有替代文本的 img 元素？
有一些语义原因吗？一些可访问性原因？ SEO原因?
它不适用于设置后备文本的样式 in-case 图片无法加载。您可以设置替代文字的样式...
它不是为了性能 - 因为对于 img，您可以使用 srcset 和 sizes 来提供替代的较小图像，而 CSS 唯一接近 srcset 和 sizes 的规范尚未得到很好的支持。
唯一一次我认为它有意义的是当 spritesheet 被用于网站时（比如堆栈溢出。）
如果是为了防止人们使用 "stealing" 徽标，那似乎很愚蠢，因为简单的 google 搜索就会告诉人们如何获取背景图像的 url。如果那是推理，它仍然看起来很愚蠢，因为您可以只在图像本身上使用 pointer-events:none;，并将包装 link 设置为 display:inline-block;，它仍然是可点击的 link，没有人能够右键单击并另存为。
我只是想了解这样做是否有好处。
我google四处寻找，但没有真正找到任何有用的信息来回答为什么要这样做。
有人将此标记为重复项：
When to use IMG vs. CSS background-image?
他们不是同一个问题。这是您在网络上看到的具体做法和模式，其背后的原因可能有所不同。
看着它，我会说这是一种支持 SEO 的方法。正如您所指出的，有多种方法可以实现这一点，所以我愿意说这是他们的首选方法。
Why do this instead of an img element with alt text? Is there some semantic reason? Some accessibility reason? SEO reason?
当您想使用 CSS 媒体查询并根据屏幕分辨率显示不同的徽标大小时，它会很有用。
关于可访问性，这可能是允许用户在图像被禁用时查看替代文本的原因。
我经常看到诸如 Whosebug 之类的网站将其徽标作为背景图像嵌入，并为 screen-readers.
的文本添加 span 标签<a href="https://whosebug.com" class="-logo js-gps-track">
<span class="-img _glyph">Stack Overflow</span>
</a>
为什么要这样做而不是使用带有替代文本的 img 元素？ 有一些语义原因吗？一些可访问性原因？ SEO原因?
它不适用于设置后备文本的样式 in-case 图片无法加载。您可以设置替代文字的样式...
它不是为了性能 - 因为对于 img，您可以使用 srcset 和 sizes 来提供替代的较小图像，而 CSS 唯一接近 srcset 和 sizes 的规范尚未得到很好的支持。
唯一一次我认为它有意义的是当 spritesheet 被用于网站时（比如堆栈溢出。）
如果是为了防止人们使用 "stealing" 徽标，那似乎很愚蠢，因为简单的 google 搜索就会告诉人们如何获取背景图像的 url。如果那是推理，它仍然看起来很愚蠢，因为您可以只在图像本身上使用 pointer-events:none;，并将包装 link 设置为 display:inline-block;，它仍然是可点击的 link，没有人能够右键单击并另存为。
我只是想了解这样做是否有好处。
我google四处寻找，但没有真正找到任何有用的信息来回答为什么要这样做。
有人将此标记为重复项： When to use IMG vs. CSS background-image? 他们不是同一个问题。这是您在网络上看到的具体做法和模式，其背后的原因可能有所不同。
看着它，我会说这是一种支持 SEO 的方法。正如您所指出的，有多种方法可以实现这一点，所以我愿意说这是他们的首选方法。
Why do this instead of an img element with alt text? Is there some semantic reason? Some accessibility reason? SEO reason?
当您想使用 CSS 媒体查询并根据屏幕分辨率显示不同的徽标大小时，它会很有用。
关于可访问性，这可能是允许用户在图像被禁用时查看替代文本的原因。