如何进行页面优化?_html/css_WEB-ITnose
程序员文章站
2022-05-14 14:09:56
...
为什么要进行页面优化?
-
更快:页面加载更快,客户感知更快;
-
更易于阅读:易于搜索引擎抓页面重点,易于盲人阅读;
-
更易于维护:易于自己和同事后期读懂、定位、修改和扩展代码.
如何进行页面优化
html
-
语义化
-
加载顺序:css放head里面(用户看到顺畅页面),js放尾部(会阻塞dom渲染,且dom树没搭建好时,js里面的dom操作会有问题)
-
减少页面请求:合并img,合并css,避免使用@import方式引入css文件
-
减少文件大小:
-
主要减少img文件大小,选用合适的格式并且用工具进行压缩(ImageOptim,ImageAlpha,JPEGmini)
-
删除不必要的标签
-
css
-
选择器:越简单越短越好,同样的样式进行选择器合并
-
css值缩写:margin等,值为0的省略单位,
-
减少文件大小:YUI Compressor,cssmin
-
少用耗性能的属性:expresion,border-radius,filter,box-shadow,gradients等
-
图片设置宽高,不要缩放,减少浏览器的回流和重绘。
-
所有表现用css实现
-
模块化
-
命名规范、语义化
-
尽量减少hack
javascript
-
页面懒加载
-
少用dom操作
加注释
上一篇: ORACLE 11G静默安装
下一篇: 详解jquery中的属性过滤选择器