关于html页面优化问题

2016-02-19 13:46:08
今天php程序猿问我优化HTML有哪些方式, 确实被问住了。 虽然平时我也注意优化的问题,但是从来都没有自己整理过。html优化,我确实没有太注意。 但是平时我写的时候,有注意一些细节,但是不很很系统,下面我把自己的注意事项列举出来,
 
1.样式,结构,表现--分离css放在页头, js放在页尾
引用外联的css和javascript,样式表引用在页头,javascript的引用放在结尾。不仅让页面看上去简洁美观,而且以后维护的时候更方便
尽量避免在html结构中写styley样式。
避免css表达式(calc,toggle)
 
 
2.减少http请求次数是必须的
在css中,把所有的小图片合并在一张spitie(雪碧图)上,在引用css的时候,直接通过background-position进行使用。
 
3.图片-图片很关键,直接影响了页面加载的时间
如果页面上的图片很多,可以通过延迟加载的方式进行优化
批量压缩图片质量
HTML中的src尽量不要为空
避免重设图片大小
 
4.html页面结构直接影响到页面的可扩展性
以前在看京东的时候觉得京东页面代码累赘,后来发现其实她这样做是为了以后为页面扩展。
 
5.seo优化, 在写页面的时候,吧title, alt这些都要带上,有利于提升seo排名
平时写图片的时候,记得把alt带上 alt="图片文字说明"
在head中记得把meta信息的keywords 以及 description, 当然不能忘记最重要的title
6.H标题的使用, 一个页面使用一个h1标签
 
7.ajax按需加载,减少页面html累赘.使用首屏加载,滚屏加载。
 
8.js要尽量少操作节点
如果实在不能避免,尽量提高操作节点的优先级(id的优先级比较高。 class 次之, tag最低)
尽量使用css3动画(transform, keyframes)

9.压缩html,css, javascript

10.增加loading进度条以及loading加载的方式
 

关于

联系方式 :

mail: hey_cool@163.com ,
QQ:583459700

备案许可证编号:蜀ICP备16005545号-1 © COPYRIGHT 2015-2022 zhmzjl.com | by: KAPO