标签：
采用DIV+CSS设计，页面代码精简。这是为了XHTML了解都知道。
代码精简所带来的直接优点有两点：一是提高蜘蛛爬行效率，能在最短的时间内爬完整个页面。这样对收录质量有一定优点;二是因为能高效的爬行，就会受到蜘蛛喜欢，这样对收录数量有一定优点。
使用一般的Table表格架构，为了达到一定的视觉效果，不得不套用多个表格。假设嵌套的表格中是核心内容，spider爬行时跳过了这一段没有抓取到页面的核心。这个页面就成了相似页面。站点中过多的相似页面会影响排名及域名信任度。
而DIV+CSS布局基本上不会存在这种问题。从技术角度来说，XHTML在控制样式时也不须要过多的嵌套。
因为使用了DIV+CSS制作方法。在改动页面的时候更加easy省时。依据区域内容标记。到CSS里找到对应的ID，使得改动页面的时候更加方便，也不会破坏页面其它部分的布局样式。
使用中稍不留神非常easy导致你的系统反映缓慢。为了提高js、css文件的下载速度，从而提高页面的响应速度，减小文件的大小才是终极之道。
我之前写到的文章：js、css动态压缩页面代码 能够依据此方法进行代码动态压缩。
5、避免使用死链接
6、为文件头指定Expires 或Cache-Control
这条守则包含双方面的内容：
对于静态内容：设置文件头过期时间Expires 的值为“Never expire” （永只是期）
对于动态内容：使用恰当的Cache-Control 文件头来帮助浏览器进行有条件的请求
7、生成静态页面
8、二级网站域名，图片域名
我之前写到的文章：jquery.lazyload.js实现图片懒载入 能够依据此方法进行图片局部延时载入。
因为DNS 查找带来的影响你首先要确保你使用的域名数量在2 个到4 个之间。
比如。你能够把用到的HTML 内容和动态内容放在www.example.org上，而把页面各种组件（图片、脚本、CSS) 分别存放在statics1.example.org 和statics.example.org 上。
12、使iframe 的数量最小
<iframe> 长处：解决载入缓慢的第三方内容如图标和广告等的载入问题 。Security sandbox ；并行载入脚本 。
<iframe> 的缺点：即时内容为空，载入也须要时间；会阻止页面载入 ；没有语意 。
13、把样式表置于顶部
在研究Yahoo! 的性能表现时，我们发现把样式表放到文档的<head /> 内部似乎会加快页面的下载速度。这是由于把样式表放到<head /> 内会使页面有步骤的载入显示。
14、使用外部JavaScript 和CSS
非常多性能规则都是关于怎样处理外部文件的。
可是，在你採取这些措施前你可能会问到一个更主要的问题：JavaScript 和CSS 是应该放在外部文件里呢还是把它们放在页面本身之内呢？
在实际应用中使用外部文件能够提高页面速度，由于JavaScript 和CSS 文件都能在浏览器中产生缓存。
内置在HTML 文档中的JavaScript 和CSS 则会在每次请求中随HTML 文档又一次下载。
这尽管降低了HTTP 请求的次数。却添加了HTML 文档的大小。从还有一方面来说，假设外部文件里的 JavaScript 和CSS 被浏览器缓存，在没有添加HTTP 请求次数的同一时候能够降低HTML 文档的大小。
关键问题是，外部JavaScript 和CSS 文件缓存的频率和请求HTML 文档的次数有关。尽管有一定的难度，可是仍然有一些指标能够一測量它。假设一 个会话中用户会浏览你站点中的多个页面。而且这些页面中会反复使用同样的脚本和样式表，缓存外部文件就会带来更大的益处。
很多站点没有功能建立这些指标。
对于这些站点来说，最好的坚决方法就是把JavaScript 和CSS 作为外部文件引用。比較适合使用内置代码的例外就是 站点的主页，如Yahoo! 主页和My Yahoo! 。主页在一次会话中拥有较少（可能仅仅有一次）的浏览量，你能够发现内置JavaScript 和CSS 对于终端用户来说会加快响应时 间。
对于拥有较大浏览量的首页来说，有一种技术能够平衡内置代码带来的HTTP 请求降低与通过使用外部文件进行缓存带来的优点。当中一个就是在首页中内置 JavaScript 和CSS ，可是在页面下载完毕后动态下载外部文件。在子页面中使用到这些文件时。它们已经缓存到浏览器了。
15、避免使用滤镜
IE 独有属性AlphaImageLoader 用于修正7.0 下面版本号中显示PNG 图片的半透明效果。
这个滤镜的问题在于浏览器载入图片时它会终止内容的呈现而且冻结浏览器。在每个元素（不不过图片）它都会运算一次，添加了内存开支，因此它的问题是多方面的。
全然避免使用AlphaImageLoader 的最好方法就是使用PNG8 格式来取代，这样的格式能在IE 中非常好地工作。
假设你确实须要使用AlphaImageLoader ，请使用下划线_filter 又使之对IE7 以上版本号的用户无效。
16、把脚本置于页面底部
脚本带来的问题就是它阻止了页面的平行下载。HTTP/1.1 规范建议。浏览器每一个主机名的并行下载内容不超过两个。假设你的图片放在多个主机名上，你能够在每一个并行下载中同一时候下载2 个以上的文件。可是当下载脚本 时。浏览器就不会同一时候下载其他文件了，即便是主机名不同样。
在某些情况下把脚本移到页面底部可能不太easy。
比方说，假设脚本中使用了document.write 来插入页面内容。它就不能被往下移动了。这里可能还会有作用域的问题。
非常多情况下。都会遇到这方面的问题。
一个经经常使用到的替代方法就是使用延迟脚本。DEFER 属性表明脚本中没有包括document.write ，它告诉浏览器继续显示。不幸的 是，Firefox 并不支持DEFER 属性。
在Internet Explorer 中。脚本可能会被延迟但效果也不会像我们所期望的那样。
假设脚本能够被延迟，那么它就能够移到页面的底部。这会让你的页面载入的快一点。
17、减小Cookie 体积
18、对于页面内容使用无coockie 域名
当浏览器在请求中同一时候请求一张静态的图片和发送coockie 时。server对于这些coockie 不会做不论什么地使用。因此他们仅仅是由于某些负面因素而创建的网络传输。
全部你应该确定对于静态内容的请求是无coockie 的请求。创建一个子域名并用他来存放全部静态内容。
假设你的域名是www.example.org，你能够在static.example.org 上存在静态内容。可是，假设你不是在www.example.org上 而是在顶级域名example.org 设置了coockie 。那么全部对于static.example.org 的请求都包括coockie 。在这样的情况下，你能够再又一次购买一个新的域名来存在静态内容，而且要保持这个域名是无coockie 的。Yahoo! 使用的是ymig.com 。YouTube 使用的是ytimg.com ，Amazon 使用的是images-anazon.com
等等。
使用无coockie 域名存在静态内容的另外一个优点就是一些代理（server）可能会拒绝对coockie 的内容请求进行缓存。一个相关的建议就是，假设你想确定应该使用example.org 还是www.example.org作 为你的一主页，你要考虑到coockie 带来的影响。
忽略掉www 会使你除了把coockie 设置到*.example.org （* 是泛域名解析，代表了 全部子域名译者dudo 注）外没有其他选择。因此出于性能方面的考虑最好是使用带有www 的子域名而且在它上面设置coockie 。
19、favicon.ico 要小并且可缓存
favicon.ico 是位于server根文件夹下的一个图片文件。它是必然存在的。由于即使你不关心它是否实用，浏览器也会对它发出请求，因此最好不要返回一个404 Not Found 的响应
。
因为是在同一台server上，它每被请求一次coockie 就会被发送一次。这个图片文件还会影响下载顺序。比如在IE 中当你在 onload 中请求额外的文件时，favicon 会在这些额
外内容被载入前下载。
20、保持单个内容小于25K
这条限制主要是由于iPhone 不能缓存大于25K 的文件。注意这里指的是解压缩后的大小。由于单纯gizp 压缩可能达不要求，因此精简文件就显得十分重要。
本文为个人经实际工作经验和收集总结整理，写得不到之处请给出宝贵意见，谢谢。
本人新浪微博：http://weibo.com/i/1741159542
版权声明：本文博主原创文章，博客，未经同意不得转载， 注意很多其他科技博客贻芳：http://blog.csdn.net/fuyifang
标签：
原文地址：http://www.cnblogs.com/bhlsheji/p/4840650.html
