CSS sprites而不是图像?

Sea*_*ean 4 css image sprite

看一些大型网站的代码(我有时会这样做),我注意到一些大型网站(YouTube和雅虎是我看过的两个)似乎几乎都使用CSS精灵,几乎没有使用任何标签所有.

这通常被视为良好做法吗?由于alt属性,我原本以为使用标签会更好用,虽然如果使用sprited图像链接到某些东西你可以使用空白图像来创建链接然后给它一个alt属性(youtube logo在左上角使用这种技术)并具有使用精灵的速度和使用标签的可访问性.

虽然对于不用于链接的图像使用精灵怎么样?你可以简单地使用youtube使用的相同技术,除非没有标签,并充分利用它们吗?

有没有人在开发网站时广泛使用精灵?我知道你通过使用它们获得性能奖励(减少HTTP请求和所有)但管理一个大量图像在一个大图像中的网站会变得很糟糕吗?

Emi*_*röm 7

您必须分离内容图像和装饰图像.

装饰图像,例如图标,渐变或阴影,可以放在精灵中.这是性能方面的最佳实践,因为它可以节省浏览器在准备渲染之前必须执行的HTTP请求的数量.我不得不承认,维持这很烦人.但只要您只将相似的图像组合在一起,所有图标都放在一个文件中,那就不错了.精灵的另一种选择是使用数据uri:s,并将图像嵌入到CSS文件中,但这对IE7来说效果不佳,IE7是最慢的浏览器.所以我想说如果你需要IE7支持,CSS精灵仍然是最好的方法.

内容图片应该在HTML中,并使用正确的替代文字设置,以便辅助技术(和Google)可以按原样阅读内容.