Question

我在这里遇到一些问题。我是一个Web开发专业，我目前正在为我需要做的项目构建这个站点。我想用背景图片让它看起来很漂亮。我在Photoshop中创建了图像并将其作为.jpg保存到网络中，最终大小为58.8k。

我所有的网站都为用户快速加载，但我想知道是否还不到60k？我在yslow firefox扩展程序上检查了它，它在96毫秒内为我加载（稍差的测试主题 - http://www.speedtest.net/result/1146275377.png）

60k太多了，将图像仅10-20k是最佳做法吗？当我看到图片加载时，我讨厌它...它只是......在这一点上甚至不值得图形。是否有更快的方法来加载该大小的图像？ CSS还是标签？或者我甚至不应该担心它？

Answer 1

大多数浏览器默认情况下最后加载背景图像，因此您不会遇到问题。

有多大会取决于您的托管设置，您网站获得的流量以及访问者的典型转移率。

对于一个没有太多同时访问者的普通网站来说，60k对我来说似乎是合理的。然而，带宽需要花钱，这就是你很少在大型网站上看到这种尺寸的背景图像的原因。另一方面，youtube会定期播放比您建议的背景图像大数千倍的视频。如果不了解您的网站，托管解决方案及其使用统计信息，就无法向您提供准确的建议。

如果你问这个问题，可能会有60k完全正常。

如果您想保证您的背景图片首先加载或最后加载，您可以这样做：

<script type="text/javascript"> 
bgimage = new Image(); 
bgimage.src = "http://www.olhovsky.com/img/cdf97/256fwt1_eg.png"; 
</script>

将该代码放在body标记上方以预加载背景图像。将它放在html文档的较低位置以便稍后加载（例如，在</body>标记之后加载背景）。

然后在body标签中：

<body onload="document.body.background=bgimage.src;">

Answer 2

我不认为60k太大了，尽管你可能想看看你可能的用户并考虑他们的连接速度会是什么样的。如果您想尝试尽可能地缩小文件大小，请尝试smushing it，您可能会看到它稍微下降。