项目组制定的一份页面优化指南

DreamRunning

2016-05-27

1.文档声明

文档声明必须置于网页的HTML部分的最开始，标签之前。它影响着整个网页的解释（兼容性及效率问题）。目前项目中使用的声明是

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

PS:其实本人还是倾向于向前走，拥抱HTML5的

2.HTML架构

页面元素结束之前不要放太多的script标签，一个带src的script标签会引起一次请求，如果标签中的代码另外发起了ajax请求更加需要置后。为了便于开发，一部分通用的JS可能置于body之前，即整体代码架构如下：

//在body之前放置一些通用JS

//在body之后放置一些业务JS，尤其是当中有ajax请求的js

3.养成良好习惯，HTML元素要正确闭合，javascript中不要放置多余的逗号在eclipse中用正则表达式

,\s[\r\n][\r\n]\s} 去搜索，能查找出js中多余的逗号

4.能用HTML完成的内容尽量不要用CSS/JavaScript去完成，能用CSS去完成的内容尽量不要用JavaScript去完成如鼠标提示最省资源的方式是用title属性去完成，其次用:hover伪类，用JavaScript事件最耗资源

5.项目内容稳定后，应该将变化小的HTTP请求（如查询字典）改成get请求以缓存

6.项目内容稳定后，应该将js及css压缩、合并以减少请求时间

7.项目内容稳定后，应该将图片合并，利用css sprite定位，以减少请求次数

转载自:http://www.9958.pw/post/web_youhua