35网站首页全方位优化过程分享
一直以来我们都在寻找提高网站访问性能的方法,日益庞大的内容和页面效果使我们的网站越来越臃肿,速度越来越慢。有没有什么办法能有效的解决这个问题呢?答案是肯定的。下面是对我们公司站点优化瘦身的要点拿出来跟大家分享。
说到站点优化,各式各样的分析工具和优化方法琳琅满目,我们推荐目前较为主流的2种优化分析工具作为衡量标准:(FireFox + FireBug + YSLOW)和IE + HttpWatch。
浏览器:FireFox 3.5.1 (下载地址:http://www.mozillaonline.com/ 或 http://g-fox.cn/)
调试工具:Firebug 1.4.1 (下载地址:http://getfirebug.com/)
FF分析工具:YSlow 2.0.0b4 (下载地址:https://addons.mozilla.org/zh-CN/firefox/addon/5369)
IE分析工具:HttpWatch (下载地址:http://download.pchome.net/internet/browser/plugin/22585.html)
在这里我们主要使用Yahoo的Yslow工具优化:
Yslow 是雅虎出的一款页面分析工具,他使用在firefox浏览器下,必须结合fireBug一起使用。安装好软件后按F12键就可以打开Yslow面板。好了废话少说,现在转入正题:
优化前,网站通过yeslow的评价为D级,总得分61分,页面元素65个共271K。(Yahoo:D级是不及格的说;我们:-_-!)
通过分析,Yslow非常人性化得为我们指出了问题的所在,请看下图:
图片中Yslow为我们提出了22个项目6个分类的问题,我们的优化主要是针对这22个项目来进行(目标很明确):
Content
从上图可以看出在这一大项里面主要包括:减少HTTP请求数、减少DNS查询、避免重定向、使AJAX可缓存、减少DOM元件数量、杜绝空链接的出现(404错误)。除了第一点其他都为A,因此主要优化页面的对外请求数。
目前情况:根据分析结果来看,目前站点首页有16个Javascript外部连接数,整体连接请求过多;
解决方案:尽可能的合并JS,减少连接数,同时将首页单独调用的小段脚本直接写入页面中,以文本方式执行,并对所有的JS代码进行压缩优化;
这里说下调用JS的事情,页面是部分写入JS脚本还是全部外部调用,其实讨论结果是各有利弊,全部外部调用固然能使页面和脚本分离彻底,便于后期维护,但会增加外部连接数,而只将本页用到的简短JS直接写入页面里,可以降低外部的请求连接数,因此权衡之下决定将部分有用到的JS压缩后直接写入页面中。
部分JS直接写入的必要性,可以通过Yahoo分析的看到(总体还是要尽量外调,但少许必要的可以直接写入)
分值N/A,已取消对于外置JS和CSS的评分。
Cookie
Cookie项包括:减小Cookie体积、对组件使用无Cookie的域名两项,都是A,就此跳过。
- ·08/29孤风:SEO是个什么玩意儿——目标关键词
- ·11/08优化网站内容编辑工具下载
- ·09/291997年至2009年 中国电子商务十二年大事记
- ·09/29js中的文档模式-document.compatMode
- ·09/29轻松搞定IE的CSS制作网页技巧3则
- ·09/29Adobe Flash:腹背受敌与何去何从
- ·09/27网络时代下商品评价的重要性
- ·09/27轻松搞定IE的CSS制作网页技巧3则
- ·09/27卢松松:如何修改源码的网页模板?
- ·09/27名师讲堂之Kent Beck——响应式设计