如何提高网站图片加载速度: 5大关键点助您加速

如何提高网站图片加载速度

1、控制jpg图片的质量　　

质量高的jpg格式图片比较清晰，色彩更鲜艳，不少人就用这种图片来美化header，其实这对速度的影响是很大的，因为打开一个页面首先加载的就是header，header加载时间太长的话，很容易使第一次来的访客反感，还有一种情况是页面上的小图标，有些站长过于追求美观，于是页面上的小图标也用高质量的图片来做，这是很没必要的。

2、尽量使用gif格式　　

jpg格式在在展示色彩丰富的大图片是效果很好，但做网页图标的话，gif才是最好的格式。因为在展示像素级的细节是，gif的效果比jpg好了不知多少倍，你可以尝试一下，截取一幅含有12px或14px文字的图，分别保存为256色的gif和质量为80的jpg，对比一下文字的显示效果，gif肯定比jpg清晰很多，而体积却小了不少。所以，在制作小图标或带有小字体的图片时，优先使用gif格式，这里还有说到一个颜色数的问题，gif格式能显示的颜色数量最多为256色，其实对不包含大量色彩渐变的图片来说，已经是非常足够了，因此，在制作颜色比较少的gif时，尝试一下降低颜色数，只要效果能过得去就行了。

3、如何插入装饰性图片　　

这里要讲的不是简单的用img标签插入图像，用这种方法插入页面小图标等装饰性图片弊端是非常大的。首先，用img标签插入的图片不能通过简单的方法实现变换效果，在这里，美化效果要打个折扣，其次，用img插入的图片，如果图片不在浏览器缓存里，而且不重复出现的话，会大大增加http请求数。因为img标签理论上是出现一次载入一次的。其三，用img标签不利于调整图片位置，如果一个图片，需要在header靠右和footer靠左这两个位置出现两次，你就需要为它写两次css。其四，用img标签插入图片不利于整合，整合图片可以大大减少http请求数，到底整合图片有什么技巧呢?看下节。

4、页面背景图片的处理方法　　

很多人喜欢用图片做页面元素的hover变换效果，但是却没有把相关的图片整合，导致一些变换效果有事会因为图片载入失败而失色。我们可以把针对某个效果的图片都整合成一个文件，在css里用background-position属性调整图片位置。这种做法的好处是背景只需要一次http请求，图片可以重复调用，也有利于图片变换。看到这里，你知道装饰性图片应该怎么插入了吗?对，用css。

5、插图尽量使用外链　　

由于服务器性能的限制，一般非独立主机都会限制单ip的http请求数，如果一个页面里http请求太多的话，页面往往要等很久才能完全载入。特别是图片，如果太长时间不能加载的话，浏览器就会断开与服务器的链接，这是就需要在点击一下显示图片才能显示出来，比较好的支持外链的相册有picasa、flickr和国内的yupoo等。这样做不但能减轻服务器压力，节约流量，更重要的是，我不相信大部分站长用的服务器比那些专业的在线相册快。

【关键词标签】如何提高网站图片加载速度    多语言多语言外贸网站建设    做外贸网站多少钱

• 十大LED照明企业网站建设排行榜——欢迎..
• 怎样可以找到LED日光灯外贸客户？
• 专业外贸网站建设——这些内容不可忽视！
• 外贸酒店用品网站建设：简洁清晰、一目了然..
• 外贸饰品礼品网站建设：图文介绍！更给力！
• 英语、日语、俄语、西班牙语、葡萄牙语、意..
• 外贸网站建设：外贸公司，出口业务必备！
• 英文VS中文网站制作：字体大小谁大谁小！
• 企业网站如何设计：令其垂涎三尺!您知道么..
• 无纺布袋网站建设：产品展示一目了然！
• 在线购物外贸多语种商城网站制作
• 互联网+时代，如何创建手机端网站
• 外贸五金水龙头网站建设：首页图文并茂突出..
• 一般网站建设中如何选择字体的大小
• 移动时代新颖的商务模式:微信外卖系统