CSS精灵而不是图像？

Question

查看一些大型网站的代码（正如我有时所做的那样），我注意到几个大型网站（YouTube和雅虎是我看过的两个网站）似乎使用CSS精灵来做几乎所有的事情，几乎没有任何使用标签。

这是否被普遍认为是良好做法？我以为使用标签会更好地使用归因于alt属性，虽然如果sprited图像用于链接到某些东西，您可以使用空白图像创建链接，然后给这个alt属性（youtube标志在左上角使用这种技术）并且具有使用精灵的速度和使用标签的可访问性。

虽然如何使用精灵的图像不用于链接？你可以简单地使用相同的技术，youtube使用除了没有标签，并获得最好的两个？

并没有人在开发网站时广泛使用精灵吗？我知道你可以通过使用它们获得性能奖励（较少的HTTP请求和所有的），但是管理一个网站，很多你的图像在一个巨大的图像中变得可怕吗？

Answer 1

你必须分离内容图像和装饰图像。

装饰图像，如图标，渐变或阴影，可以放在精灵里面。这是性能方面的最佳实践，因为它可以节省浏览器在准备好呈现之前必须执行的HTTP请求数量。我不得不承认，这很烦人。但只要你将相似的图像组合在一起，一个文件中的所有图标就不会那么糟糕。 Sprite的替代方法是使用数据uri：s，并将图像嵌入到CSS文件中，但对于最慢的浏览器IE7来说效果不佳。所以我想说如果你需要IE7的支持，CSS sprites仍然是最好的选择。

内容图像，应该在HTML中，并设置适当的alt文本，以便辅助技术（和Google）能够按照它应该阅读的内容。