从我开始知道 SEO 这几年起，基本上所有的 SEO 活动都是基于前端的，从header 到 body，从小标签到 CSS，从链接到关键词密度；初期牛人们诊断一个网站 SEO 的标准也是从前端页面着手，不过的确也是，从排名算法前端的代码的确占了大部分的比例，但后端的服务器速度优化，也开始成为一个越来越重要的因素，特别是流言四起的 Google 将会把网站速度作为算法的一部分。
当然，服务器那种事不该是一个 SEOer 或者 SEMer应该去精通的东西，其实只要了解并掌握其规律就可以了(推荐另外一片文章：大型网站架构演变和知识体系)；但依然要熟悉网站系统或者 CMS 的加速手段，正如国平在《怎样形成一套非常科学系统的SEO方法》中分析的
什么措施能影响网页加载速度呢？ 网络环境、服务器硬件、CMS本身都能影响网页加载速度。优化其中的任何一项，都能提升网页加载速度。那马上又可以得出：网络环境影响SEO流量、服务器硬件影响SEO流量、CMS本身的速度影响SEO流量。
影响速度的因素有很多，这里做一个汇总（不包括硬件）
本文内容参考Yahoo：Best Practices for Speeding Up Your Web Site 和 高性能网页开发的14条军规
这个第一条是我们大多数SEO所知道的，我再做一个简单的描述：大多数的HTTP请求都是前端的，用户的大多数时间都被用来下载图片、CSS样式表、各种Scripts、Flash等等。当然或许将css，js文件拆分多个是因为css结构，共用等方面的考虑。阿里巴巴中文站当时的做法是开发时依然分开开发，然后在后台 对js，css进行合并，这样对于浏览器来说依然是一个请求，但是开发时仍然能还原成多个，方便管理和重复引用。yahoo甚至建议将首页的css和 js 直接写在页面文件里面，而不是外部引用。因为首页的访问量太大了，这么做也可以减少两个请求数。而事实上国内的很多门户都是这么做的。
而css sprites是指只用将页面上的背景图合并成一张，然后通过css的background-position属性定义不过的值来取他的背景。淘宝和阿里巴巴中文站目前都是这样做的。有兴趣的可以看下淘宝和阿里巴巴的背景图。
http://www.csssprites.com/ 这是个工具网站，它可以自动将你上传的图片合并并给出对应的background-position坐标。并将结果以png和gif的格式输出。
之前曾经问过张智勇公子关于 CDN 是否对 SEO 有影响，在征询了技术老总的意见之后，这个影响其实几乎可以忽略的，反而是用户端的速度体验提升了，对网站的正向作用更大。
CDN 加速现在很流行，几乎稍微大一点的网站都有用这个服务，就是将网站的镜像服务备份到多个服务器节点，从而加速该服务器周围的用户访问。
更详细地内容大家可以参考百度百科上对于CDN的解释
这个规则有两个东西：
通过设置Expires header 来缓存这些文件。Expire其实就是通过header报文来指定特定类型的文件在览器中的缓存时间。大多数的图片，flash在发布后都是不需要经常修 改的，做了缓存以后这样浏览器以后就不需要再从服务器下载这些文件而是而直接从缓存中读取，这样再次访问页面的速度会大大加快。
一个典型的HTTP 1.1协议返回的头信息：
HTTP/1.1 200 OK
Date: Fri, 30 Oct 1998 13:19:41 GMT
Server: Apache/1.3.3 (Unix)
Cache-Control: max-age=3600, must-revalidate
Expires: Fri, 30 Oct 1998 14:19:41 GMT
Last-Modified: Mon, 29 Jun 1998 02:28:12 GMT
ETag: “3e86-410-3596fbbc”
Content-Length: 1040
Content-Type: text/html
其中通过服务器端脚本设置Cache-Control和Expires可以完成。
如，在php中设置30天后过期：
<!–pHeader(“Cache-Control: must-revalidate”);$offset = 60 * 60 * 24 * 30;$ExpStr = “Expires: ” . gmdate(“D, d M Y H:i:s”, time() + $offset) . “ GMT”;Header($ExpStr);–>
<!–pHeader(“Cache-Control: must-revalidate”);$offset = 60 * 60 * 24 * 30;$ExpStr = “Expires: ” . gmdate(“D, d M Y H:i:s”, time() + $offset) . ” GMT”;Header($ExpStr);–>
在asp中设置绝对时间过期：
<% Response.ExpiresAbsolute=#May 31,2010 13:30:15 GMT# %>
也可以通过配置服务器本身完成，这些偶就不是很清楚了，呵呵。想了解跟多的朋友可以参考http://www.web-caching.com/
这个是目前应用最多的加速方式之一，代码也很简单，gzip的压缩比例非常大，一般压缩率为85%，就是 说服务器端100K的页面可以压缩到25K左右再发送到客户端。雅虎开发者特别强调， 所有的文本内容都应该被gzip压缩: html (php), js, css, xml, txt。
css表达是的执行次数是远远多于我们想象的，往往会严重地影响性能。而且，它只能在IE中执行。所以因尽量地避免它。这一条以前倒没想过，个人用 这个就是在对ie使用max-width和min-width属性的时候。大家知道IE是不支持max-width和min-width属性的。有时候的 页面（特别是自适应大小的页面）为了能在分辨率小到一定程度后还能显示要用到这个功能，怎么办。当时我的做法就是利用expressions:
这个地球人都知道
在 Internet上域名与IP地址之间是一一对应的，域名（SEMWatch.org）很好记，但计算机不认识，计算机之间的“相认”还要转成ip地址。在网络 上每台计算机都对应有一个独立的ip地址。在域名和ip地址之间的转换工作称为域名解析，也称DNS查询。一次DNS的解析过程会消耗20-120毫秒的 时间,在dns查询结束之前，浏览器不会下载该域名下的任何东西。所以减少dns查询的时间可以加快页面的加载速度。yahoo的建议一个页面所包含的域 名数尽量控制在2-4个。这就需要对页面整体有一个很好的规划。
压缩js和css的左右很显然，减少页面字节数。容量小页面加载速度自然也就快。而且压缩除了减少体积以外还可以起到一定的保护左右。
当然，压缩带来的一个弊端就是代码的可读性没了。相信很多做前端的朋友都遇到过这个问题：看Google的效果很酷，可是去看他的源代码却是一大堆 挤在一起的字符，连函数名都是替换过的，汗死！自己的代码也这样岂不是对维护非常不方便。
301，302重定向是普通 SEO 里最常见的，特别是301，对权重的转移和保留非常有帮助，除非迫不得以，尽量少用重定向。
这点我想不说也知道，不仅是从性能上考虑，代码规范上看也是这样。但是不得不承认，很多时候我们会因为图一时之快而加上一些或许是重复的代码
这点我也不懂，呵呵。在inforQ上找到一篇解释得比较详细的说明《使用ETags减少Web应用带宽和负载》，有兴趣的同学可以去看看。
记住，即使AJAX是动态产生的而且只对一个用户起作用，他们依然可以被缓存
Even though your Ajax responses are created dynamically, and might only be applicable to a single user, they can still be cached. Doing so will make your Web 2.0 apps faster.
十五、Flush the Buffer Early
十六、Use GET for AJAX Requests
十七、Post-load Components
十八、Preload Components
十九、Reduce the Number of DOM Elements
二十、Split Components Across Domains
二十一、Minimize the Number of iframes
框架最好都不要用。
二十二、No 404s
这个和SEO的相关条款不一致，可以忽视哈。
二十三、Reduce Cookie Size
尽可能的吧，cookies跟踪好了，有可能比速度更重要
二十四、Use Cookie-free Domains for Components
二十五、Minimize DOM Access
二十六、Develop Smart Event Handlers
二十七、Choose <link> over @import
二十八、Avoid Filters
二十九、Optimize Images
三十、Optimize CSS Sprites
三十一、Don’t Scale Images in HTML
三十二、Make favicon.ico Small and Cacheable
三十三、Keep Components under 25K
三十四、Pack Components into a Multipart Document
三十五、Avoid Empty Image src
避免空的图片地址链接
<img src=”">
var img = new Image();
img.src = “”;
这两种形式都会导致同样的效果：浏览器会向服务器进行额外请求
三十六、没了
哎哟，太多了
本文首发 SEM Watch，转载请注明出处。
相关文章
