內容再丰富多彩的网址，假如慢到无法打开也是毫无价值的； SEO做的再比较好的网站，假如检索搜索引擎蜘蛛抓不上也是白费； UE设计的再个性化的网址，假如客户连看都看不见也是空话。
因此网页的效率肯定是最需要留意的层面。怎样才能提升一个网页的效率呢？Steve Souders明确提出的提升网页效率的14条规则：
Make Fewer HTTP Requests
Use a Content Delivery Network
Add an Expires Header
Gzip Components
Put CSS at the Top
Move Scripts to the Bottom
Avoid CSS Expressions
Make JavaScript and CSS External
Reduce DNS Lookups
Minify JavaScript
Avoid Redirects
Remove Duplicate Scripts
Configure ETags
Make Ajax Cacheable
下边，就来深入分析一下14条规则实际的具体内容和功效
第一条：Make Fewer HTTP Requests 尽量的减少HTTP的Request请求数
80%的客户反应时间全是消耗在前面。而这种時间关键又是由于免费下载图片、css样式表、JavaScript脚本制作、flash等文档导致的。减少这种資源文档的Request请求数将是提升网页表明效率的关键。
这儿仿佛有一个分歧，便是假如减少了许多的图片，款式，脚本制作或是flash，那麼网页难道不是光溜溜的，这多不好看呢？实际上这是一个误会。大家仅仅说尽可能的减少，并没说彻底无法应用。减少这种文档的Request请求数，自然还有一些小技巧和提议的：
1：用一个大图片替代好几个小图片。
网页页面上的每份图片都将引起一次http请求，尽管小图片的网络速度会比大图片快，可是当请求数比较多的状况下时，显著是大图片载入的效率远远高于诸多零碎的小图片。因此假如很有可能或是应用大图片来取代太多的繁琐的小图片吧。这也是为什么旋转门的效率要高过图片更换完成的移动门的缘故。
可是，一定要注意：也不能用很大的一张图片，由于这样会直接影响到客户体验。例如个几兆的环境图片的应用肯定并不是一个好点子。
2：合拼你的css文件。
这一非常容易了解，网页页面中每采用一个读取外界css的<link>标识时，都是会像服务器发送请求，进而减少网页的效率。因此，从提升网页效率的方向上来讲，大家依然应当将全部的css写在同一个css文件中。
3：合拼你的javascript文档。
缘故和解决跟上面一样。
第二条：Use a Content Delivery Network 应用CDN
这一看起来似乎很令人深思的模样，可是只需融合我国的互联网特点，这一便不难理解了。“南电信网，北网通电信”的宣传口号坚信大家都有一定的了解，设想一个北方地区的使用者在网通电信路线中浏览电信服务器下的一个图片网站得话，我也打赌他一定会有砸设备的不理智。
第三条：Add an Expires Header 加上周期时间头
这一也并不是开发者来操纵，反而是网络服务器管理人员的岗位职责。因此，假如做为开发者的你没掌握和搞清楚也没有关系。或是把这个规则告知企业的网络服务器管理人员。
第四条：Gzip Components 开启Gzip压缩
这一大伙儿应当较为了解。Gzip的观念便是把文档先在服务端开展缩小，随后再传送。这针对容积很大的文字型的材料有动画特效。由于这也并不是开发者，反而是网络服务器管理人员的工作中范围，这儿便不详尽介绍了。假如对于此事也有兴趣，可以行业门户网站网络服务器管理者或是baidu。
第五条：Put CSS at the Top 把CSS款式放到网页的上边。
不论是HTML或是XHTML还是CSS全是表述型的语言表达，并非编译程序型的。因此CSS到上边得话，那麼电脑浏览器分析构造的情况下，就早已可以对网页页面开展3D渲染。那样就不可能发生，网页页面构造光溜溜的先出去，随后CSS3D渲染，网页页面又忽然绮丽起來，那样太具备“戏剧化”的网页页面访问感受了。
第六条：Move Scripts to the Bottom 将代码放到底端
缘故同第五条一样。仅仅脚本制作一般是用于于客户互动的。因此假如网页页面都还没出去，客户连网页页面都不清楚什么样子，那谈互动真是便是扯谈。因此，脚本制作和CSS恰好反过来，脚本制作应当放到网页的底端。
第七条：Avoid CSS Expressions 防止应用CSS中的Expressions
CSS Expressions是什么一个物品。实际上简言之，便是在css中开展或运算的一种书写
input{background-color:expression((this.readOnly && this.readOnly==true)?”#0000ff”:”#ff0000″)}相近上边的这一css事例便是CSS Expressions。可以想像，人家css的自身功效仅仅3D渲染网页，但你就是要他进行一系列的或运算，那样的难点怎么会解决得稳妥呢？
第八条：Make JavaScript and CSS External 将javascript和css单独成外界文档
这条看起来貌似和第一条中规定的减少http请求有一定的分歧，即然要减少http请求，那必然就需要减少外界文档的读取。其实不是，往往这样做，是由于此外一个主要的考量要素——缓存文件。由于外面的引入文档会被浏览器缓存，因此假如javascript和css容积很大的情况下，大家将他们单独成外界文档。那样当客户只需访问一次之后，这种容积很大的js和css文件就能被缓存文件起來，进而极堡垒提升客户再度浏览时的效率。
第九条：Reduce DNS Lookups 减少DNS查看
DNS解析域名系统软件。我们都知道大家往往能记牢那么多的网站地址，是由于大家记牢的全是英语单词，并非http://202.153.125.45那样的物品， 而帮大家把这些英语单词和202.153.125.45那样的ip详细地址联络在一起的便是DNS。那这一条对大家究竟有哪些真真正正的意义上的现实意义呢？实际上有两根：
1：要不是务必，请不要把网址放进两部网络服务器上。
2：网页中的图片、css文件、js文件、flash文件这些，不必过多的散落在不一样的网络环境中。这就是为何那类只发一个网站中的墙纸图片的贴子，要比墙纸图片来自不一样站点的贴子表明要快得多的缘故。
第十条：Minify JavaScript and CSS 减少JavaScript和CSS文档的容积
这一点不用表述，文档越小自然载入越快。在网上也经常可以看到功能强大的javascript和css压缩专用工具。这儿就很少讲了。
第十一条：Avoid Redirects 防止自动跳转
从网页开发者的方面来讲解此条。那麼我们可以理解到什么呢？
1：“此网站域名过期，5秒左右之后，网页页面将自动跳转到https://www.iprr.cn/ 网页页面”，这样的话看上去确实很了解。可是，很惊讶了，为什么不立即连接到那一个网页页面呢？
2：一些连接详细地址请更清晰的写出去。例如:将http://www.iprr.cn/ 写出http://www.iprr.cn （留意最终面一个“/”标记）。确实，这两个网站地址都能浏览到我的网站，但实际上，他们是有差异的。http://www.iprr.cn 的結果是个301回应，它会被再次偏向http://www.iprr.cn/ 。可是显而易见，正中间多消耗了一些時间。
第十二条 Remove Duplicate Scripts 清除反复的脚本制作
这一点和先前的第十点一样非常容易了解，可是特别注意的地点是，一些外界引入进去的javascript架构通常带上很多的沉余，应用前最好能对它进行一定的清除，css也一样。
第十三条：Configure ETags 配备你的实体线标识
最先来讲下什么叫Etag吧。Etag（Entity tags ）实体线标识。这一tag与你在网络上常常见到的标签云那类tag有点儿差别。这一Etag并不是给客户用的，反而是给浏览器缓存用的。Etag是网络服务器告知浏览器缓存，缓存文件中的信息是不是早已产生变化的一种体制。根据Etag，电脑浏览器就可以了解如今的缓存文件中的信息是否全新的，要不要再次从服务器上重新免费下载。这和“Last-Modified”的定义有点儿相近。很遗憾做为网页开发者对于此事束手无策。他仍然是网络服务器工作人员的工作中范围。假如对于此事有兴趣爱好，可以资询网络服务器管理人员或是baidu。
第十四条：Make Ajax Cacheable 上边的规则也适用Ajax
如今的Ajax仿佛有点儿被神话传说了，仿佛网页只需Ajax了，那麼就不会有效率问题了。实际上这也是一种误会。拙劣的应用Ajax不容易使你的网页效率更高一些，反倒会减少你的网页效率。Ajax确实是个好产品，可是请不要太过的神话传说它。应用Ajax的过程中还要考虑到上边的这些规则。本人的提议是在能无需Ajax的区域就最好不要用他。
自然，在搜索引擎优化的历程中，许多情况下并非真真正正能依照以上14条规则彻底实行。实际上，大部分的情形是必须seo优化者在空出开展选择，彻底没必需照本宣科这种基础理论。总而言之，能有效的提升网址特性的作法，全是好方法。
热搜词
扫一扫加微信