4.页面优化

为什么要优化？ 优化的好处 1.提升网页响应速度 2.有利于搜索引擎搜索 3.对后期维护比较方便

怎么优化？ 1.减少请求 2.减少文件的大小 3.页面性能 4.可读性、维护性

1.图片合并 2.css文件合并 （多个css文件合并为一个、少量的行内样式、避免import的方式引入文件） 3.减少图片的大小（选择合适的图片格式） 4.css值缩写 5.0px 中px省略 0% 0 0.5可以写成.5 6.选择器合并 7.link标签引入样式放到head标签中 8.js脚本建议放在底部，等页面加载完之后再处理js 9.把不需要的标签去掉 10.选择器的长度 #nav ul li a{} 影响查找的性能 11.避免耗性能的属性 比如说css3中的渐变 12.img设置宽高的时候应该和实际的宽高一致 13.可读性的规范 14.尽量用语义化的标签来编写，有利于seo 15.类型和id名，以内容语义来命名 16.避免hack 17.模块化（一系列相关的结构做成一个模块来处理） 18.必要的时候添加注释，可读性比较好

比如说代码优化，大家试着说一下怎么优化？

.g-bd{
  border-top: 1px solid #000;
  border-right: 1px solid #f00;
  border-bottom: 1px solid #f00;
  border-left: 1px solid #000;
}
.m-side{
  width: 200px;
  background-image: url(bg.png);
  background-repeat: repeat-y;
  background-color: #ccc;
}