用SEO处理雪碧背景图像的最佳方法

Question

我使用雪碧图像的图标是链接，但没有文字关联。我想知道你觉得什么是最好的方法，因为它涉及到搜索引擎优化。

下面是一些如何完成标记的示例：

没有雪碧，只有图片。这是可行的，但是对于50+图标，每个图标都有一个单独的图像是不理想的

<a href="#">
  <img src="icon1.gif" alt="SEO Text" />
</a>

雪碧，具有标题属性的链接

<a href="#" class="sprite icon1" title="SEO Text">&nbsp;</a>

雪碧，具有标题属性和/或缩进锚文本的链接(文本缩进：-9999)

<a href="#" class="sprite icon1" title="SEO Text">SEO Text</a> 

或者是完全不同的东西？

谢谢!

编辑：

我发现的另一个选择是：

透明图像的alt文本和使用精灵

<img src="transparent.gif" class="sprite icon1" alt="SEO Text" />

Answer 1

对SEO最好的事情，在这种情况下，海事组织是你的第三个例子，使用图像-文字替代。但是，您将在iPhone Retina 4显示器上出现问题，因为双像素化，您可以通过以下媒体查询@media仅屏幕和(-webkit-min-设备-像素比: 2)来解决这个问题。

但是，如果在启用高对比度模式时关闭或在Windows中关闭图像，则会导致可访问性问题。因此，最好的选择是使用第一个示例，并通过{clip:}更改图像外观。你可以在这里读到更多关于它的http://www.paciellogroup.com/blog/2010/01/high-contrast-proof-css-sprites/。

Answer 2

This question and answer at Pro Webmasters完美地涵盖了这一点