网页加载速度优化技巧

转载自：http://web.itivy.com/article-63-1.html

在最近的几年里，Web网页的大小已经显著增大了。由HTTP Archive研究得出的结果表明，目前平均一个页面的大小是1.25M。对于拥有宽带的用户来说，可能并不是一个问题。但是对于那些网速并不理解的用户来说，可能会是一个非常头疼的问题。

一、网页优化 

1.  优化图片 

这个绝对是显而易见的，可以看到图片占据的页面内容分量最重。在现代网页设计中，图片绝对占据了大部分的内容。你需要针对你的页面重新定义图片大小。这能够有效地帮助你减少页面大小。而且，这里有很多的功能能够帮助你针对图片减肥，例如，Smush.it和TinyPNG 

2.  压缩CSS和JAVAscript代码 

有效地压缩CSS和JavaScript代码能够有效地减少页面大小，你可以删除空格优化代码。当然，压缩代码对于代码阅读不是非常有用，但是一般作为产品环境来说，我们通过这种方式可以有效地减少页面加载时间。 

3.  避免使用@import 

@import CSS语法允许你加载其它的CSS文件。有时间非常有帮助，但是它并不是和主文件一起下载的，所以可能会增加页面加载时间。建议使用link标签，这样会更加高效。 

4.  减少HTTP请求次数 

减少HTTP请求次数可以帮助你有效的增加网站加载速度。你可以使用如下方式： 

• 融合文件：将不同的样式表文章合成一个文件可以减少http请求的次数。同样对于JavaScript来说也适用。
• 使用CSS sprite：使用sprites可以帮助你把多个图片文件放置到一个文件里，这样可以减少图片下载的次数。

5.  利用浏览器缓存 

可能你的网站中包含了一些并不常常变化的文件。例如图片、CSS、JavaScript等等。如果让浏览器来缓存文件的话可以帮助你增加网页加载速度。通常我们使用web服务器的配置来达到效果，如下： 

比较简单的方式是更新服务器的.htaccess文件。代码如下： 

<IfModule mod_expires.c>  

 # Enable Expirations  

 ExpiresActive On  

 # Default Expiration Time  

 ExpiresDefault "access plus 1 month"  

    

 # Expiration for Images  

 ExpiresByType image/gif "access plus 1 month"  

 ExpiresByType image/png "access plus 1 month"  

 ExpiresByType image/jpg "access plus 1 month"  

 ExpiresByType image/jpeg "access plus 1 month"  

    

 # Expiration for CSS  

 ExpiresByType text/css "access plus 1 month”  

    

 # Expiration for JavaScript  

 ExpiresByType application/javascript "access plus 1 month"  

    

 </IfModule>