SEM我帮您-深圳SEO

Page Speed 是Google提供一个提高网页打开速度非常好用的工具.在某些方面比Yahoo的Yslow更好用。
和YSlow一样，“Page Speed”也是一个基于firebug附加组件的FireFox插件。Page Speed通过Google指定的20条标准来衡量网页的综合速度。而Page Speed面板就是用来展现你的网页在Google20条标准上的得分。“Page Speed”通过分析你的网页加载、呈现速度，用20条标准来衡量，最终告知你的网页速度如何、哪种标准得分多少、问题所在、如何改进等信息。如果你想用 “Page Speed”，那么你就要安装firbug，而firebug是FireFox的一个附加组件，所以你也必须按照FireFox浏览器。
“Page Speed Activity”面板用于展现你的网页加载各种元素的所用时间，这样，你就可以更明确的知道到底是谁在浪费、占用大量的时间，从而更有针对性的进行改 进。不同的阶段占用的时间，用不同的色块进行表示。

“Page Speed”的20条衡量标准

1.Put CSS in the document head

将你的CSS样式表文件放在整个页面的头部。没有什么难理解的。css先下载下来，就能更快的渲染网页效果。从而让人们感觉网页速度很快。

2.Use efficient CSS selectors

使用效率更高的CSS选择符。举个很简单的例子：尽量不要使用*号选择符：

*{padding:0;margin:0}

像这样的得分会很低，正确的办法应该是只对你想设置的标签元素进行设置，例如：

html, body, div, span, applet, object, iframe,

h1, h2, h3, h4, h5, h6, p, blockquote, pre,

a, abbr, acronym, address, big, cite, code,

del, dfn, em, font, img, ins, kbd, q, s, samp,

small, strike, strong, sub, sup, tt, var,

b, u, i, center,

dl, dt, dd, ol, ul, li,

fieldset, form, label, legend,

table, caption, tbody, tfoot, thead, tr, th, td {

margin: 0;

padding: 0;

}

3.Leverage proxy caching

代理缓存。这个名词听起来好像很屌的样子，以至于我也是查了资料才知道：所谓proxy cacheing，就是一种公共缓存，用于静态资源，允许浏览器从最近的代理服务器上，而不是从远程的原始服务器，下载这些静态资源。这些代理服务器，通 常而言就是有ISP，接入服务商所提供的。

这样的代理服务器缓存可以让通过同一ISP接入服务的用户共享这些静态资源，而节省原始服务器的带宽，以及下载速度也会大大提高，特别是对于局域网 的用户有特别的好处。

实现的方法如下，在.htaccss文件中添加如下的语句。

<FilesMatch “.(ico|pdf|flv|jpg|jpeg|png|gif|js|css|swf)$”>
Header set Cache-Control “max-age=5184000, public”
</FilesMatch>

然后，就可以看到Http文件头中的cache-control:public, max-age=5184000。

4. Minify JavaScript

最小化JavaScript脚本。对于JavaScript文件本身具有非常大的优化空间。所谓JavaScript压缩，就是通过一些工具将函数、变量名进行优化(其实就是尽可能缩短变量名长度)，消除多余字符(比如空格、换行符、注释等)，最终得到的代码可以在分析和执行上得到性能提升。压缩后得到的代码对于机器而言是可读的，对于人来说就不行了，因为文件内容已经面目全非。所以压缩一般用于生产期的代码，不能使用于开发期。同样的道理，图片内容中也有一定的冗余信息，比如文件头部的一些内容描述(这些内容在jpg)图片上尤其如此。通过一定的工具(比如GIMP)可以去除这些信息，从而节省一定的空间。幸运的是，Page Speed已经内置了这些功能，我们不需要找第三方的工具。点击minified version，在新窗口中可以看到Page Speed为你优化好的版本，直接更新到服务器就可以了。

5. Optimize images

优化图片，其实最经常使用的就是css script了，也有翻译为“css精灵”的，虽然翻译的很美好，但是其实很简单，就是将多个图形，放在张图片文件中。这样，可以有效的减少http请求 的数量。

6. Minimize cookie size

最小化你的cookie。cookie的确是个好东西，他可以让你在用户的客户端保存一些东西，但是，千万不要什么都往用户口袋里面塞。原因很简 单，cookie大小有限，有最大限制，而且cookie过大会减慢网页呈现的速度。另外为了安全性考虑，也不要把所有的什么破铜烂铁都塞到cookie 里面。

7. Enable gzip compression

使用gzip压缩。详细这个大家应该已经比较熟悉了。所谓gzip压缩是一种开发的压缩算法，目前的主流浏览器(Firefox, Safari, Chrome, IE4及以上)与主流服务器(Apache, Lighttpd, Nginx)均对其有很好的支持。gzip压缩是通过HTTP 1.1协议中的Content-Encoding : gzip来进行标记说明，其可以明显减少文本文件的大小，从而节省带宽和加载时间。我做过的一个实验，发现启用gzip后，jquery 1.2.6 minify版本的大小从54.4k减少到16k，减少了70%。gzip适用的情况包括：

* HTML\CSS\JavaScript文件，gzip算法对于文本文件的效率比较高，而jpg/gif/png/pdf等二进制文件本身已经进行了一次压缩，再使用gzip的成效已经不明显了。而且gzip压缩需要消耗服务器的资源，而解压缩需要消耗浏览器的资源，对于比较大的二进制文件具有非常高的性能消耗；
* 尽量使用一种大小写方式，要么全部大写，要么全部小写。学过数据结构和算法的同学一定知道压缩其本身就是对冗余信息熵进行压缩，如何数据原素的类型种类太多，其信息冗余度会降低，从而压缩率降低；
* 过小的文件(通常小于150个字节)不宜进行gzip压缩，因为gzip会在文件头加入相关信息，对于小文件反而会增加文件的长度；关于各服务器如何启用gzip，可以参加相关文档说明。如何检查gzip是否启用？使用Firebug，在Net模块中进行检查HTTP Header是否有Content-Encoding gzip标记

8. Combine external JavaScript

合并外部的JavaScript文件。道理很简单，依然是为了少读取.js文件，从而有效的减少http请求数量。
合并外部的JavaScript文件
合并外部的JavaScript文件可以有效的减少http请求数量

更多的关于“Combine external JavaScript”的文档，可以看www.sem580.com。

9.Minimize DNS lookups

最小化DNS查询。详情请看这个：Minimize DNS lookups规则详情。
Optimize the order of styles and scripts

优化样式表和脚本的顺序。如果你要是看过老赵的《挣脱浏览器的束缚》系列的话。就知 道IE浏览器对同一个域名下的文件，同时只能下载2个文件。所以，到底先让哪些样式表先下载下来，让哪些脚本先下载下来，这个顺序就非常重要了。所以，如 果有可能，请重视一下样式表和脚本的顺序吧。推荐的做法是：将css放在js文件上面，让css文件先被加载，这样就可以先让网页渲染出来，从而加快浏览 者的感知速度。
下载限制
IE浏览器对同一个域名下的文件，同时只能下载2个文件

10. Serve resources from a consistent URL

相同的资源，使用相同的url地址。道理很好理解，如果是相同的一张图片，就不要东方一下，西方一下，然后引用的时候使用不同的url地址。为什么 要这样做，道理也很简单，因为——缓存！

11. Avoid CSS expressions

避免CSS表达式。这个我在《如何提高网页的效率（上篇）——提高网页效率的14条准则》一文中也有讲到。现在需要补充的是：IE8已经不再支持 css表达式功能。

12. Parallelize downloads across hostnames

通过不同的主机同时下载网页资源。这个的道理已经在“Optimize the order of styles and scripts”这一准则中讲述过。道理依然是老赵的《挣脱浏览器的束缚》提到的原因：IE浏览器对同一个域名下的文件，同时只能下载2个文件。

13. Combine external CSS

合并外部的css文件。这条和“Combine external JavaScript”准则的道理一样。还是为了减少http请求数量。

14. Specify image dimensions

明确的指明图片的高度和宽度。很久很久以前，long long ago。一个同学问我：“明确的指明图片的宽度和高度，是否能加快页面的渲染速度？”当时我的答案是：“这个应该没有关系吧！”。看来，当时的我是误人子 弟了。明确的指出图片的高度和宽度，能够有效的加快浏览器在渲染图片周围布局和绘制呈现时的速度。

15. Minimize redirects

尽量避免重定向。道理很简单，你从A地点到你的同事B先生家，到了那里，他的邻居告诉你，B先生已经搬家了，搬到了C地点，于是，你又跑到C地点， 然后C地点有个人告诉你，B先生现在又搬家了，已经搬到了D地点。于是你又跑到了D地点，才找到了这个B同事。而这个装B的B同事，告诉你，你如果直接就 来D地点，就不用那么麻烦了，而且速度也会更快一些。网页的跳转和重定向的道理是一样的。

16. Defer loading of JavaScript

延期加载JavaScript。这个听起来真是个高科技的东西呀。其实这玩意还真是非常的有效呀。不仅可以延期加载脚本，像一些大的图片、 flash也都可以延期加载。其实实现原来也不是很难，就是先不加载一些比较大的东西，当页面加载完毕后，再加载那些东西。

Incoming search terms:

• 如果加快你的网站打开速度之YSlow

Related posts:

1. wordpress免插件添加google adsense广告
2. 如果加快你的网站打开速度之YSlow