登录论坛 | 注册会员 设为首页 | 收藏本站
当前位置 : 首页>软件学院>程序开发>网页设计>正文
 
网页优化的最基础部分:HTML的优化

http://www.dbit.cn 2010/3/12 8:07:36  来源:东北IT网  编辑:叶子
 

在Perfection kills上看到他去年写的一篇文章,关于HTML优化的,讲的很详细,姑且记录之,尽管里面有些东西并不能在目前的环境里应用。在当前WEB应用逐渐前端化的潮流下,对客户端的优化越来越受到关注,如何减少代码,如何让应用快速的展示给用户,如何减少用户等待时间等等,如雅虎的34条优化黄金法则里面提出了详尽的优化方案。
网页优化的最基础的部分应该就是HTML的优化,具体来说首先就是标记的清理,清理标记不仅仅能缩减文档的大小,而且能够让文档更易于维护提高搜索引擎的可见度(Clean markup means better accessibility, easier maintenance, and good search engine visibility),但是即便是那些号称高度优化过的网页,如果仔细查看代码,依旧可以发现很多可以删减或者已经过时的标记用法:
1.script里的注释符






<SCRIPT language=javascript>
<!-- Begin
alert("daimaren.cn");
// End -->
</script>

除非是像95 Netscape 1.0这类几乎绝迹的浏览器需要这样的处理,在大部分主流浏览器里,往脚本块里添加HTML注释是完全不需要的。
2.<![CDATA[ … ]>






<script type="text/javascript">
//<![CDATA[
...
//]]>
</script>

这是另外一个经常在js代码块里添加的错误预防措施,他是在处理真正的XHTML文档(“application/xhtml+xml” content-type)时为了防止代码将形如<号解析为标签开始,所有在CDATA内包含的内容,都会被当成文本处理。但是实际情况是,目前几乎所有的网页的content-type都是text/html,也就是说它们不是严格意义上的xml文档,而是只是text文本,所以这个错误预防处理措施是完全没有必要的,即使你确定要支持xml的文档,也要视情况合理的运用CDATA。
3.onclick=”…”, onmouseover=”“等等。
将事件属性写在HTML标签内是一种很不明智的做法,降低了代码的可维护性,同时污染了标签,如果将事件属性通过JS动态添加,不仅可以灵活控制,还可以利用JS客户端缓存的优势,让这些事件属性不必每次跟随文档请求。
4.onclick=”javascript:…”
这是一个有趣的javascript混乱,伪协议和内在的事件处理程序可以组成高达10W多种多余的组合,事实是事件属性内部的内容在解析后成为body的一个fucution,这个function然后会作为事件处理程序,所以javascript:在此成为一个无用的多余标签。
5.href=”javascript:void(0)”
继续javascript:伪协议,有一个臭名昭著的就是javascript:void(0),他是用来避免默认的锚点动作的,它在JS无法正常解析或者出错时(disabled/not available/errors)会使得锚点完全不可用,理想的解决方案是在href里填写正确的URL,然后用JS去动态改写,这样即使在JS未执行的情况下也不会出现锚点不可用的状况。HREF =“#”是一个精简和更快的替代方案。
6. style=”…”
没有什么本质性的错误,只是后期维护麻烦,另外移到外联的CSS文件中可以缓存起来提高页面执行效率。
7. <script language=”Javascript” … >
最容易误解的属性之一,觉得这个是脚本的“语言”,这个属性是如此古老,在1999年就已经不推荐被使用了。
8. <script charset=”…” … >






  <script type="text/javascript" charset="UTF-8">
...
</script>

script标签的另一个容易被误解的属性,charset在HTML4.01里的描述:请注意,charset属性是指字符的 src属性所指定的脚本编码,它不涉及的脚本元素的内容。(Note that the charset attribute refers to the character encoding of the script designated by the src attribute; it does not concern the content of the SCRIPT element.),也就是说他只在外联脚本的时候指定脚本文件的编码格式。不推荐使用。

本新闻共2页,当前在第1页  1  2  

收藏】【打印】【进入论坛
  相关文章:

·遵循web标准 网页前端的3类优化

 
 
 
最新文章

抢先苹果,消息称英特尔芯片采用台积电
三星揭晓业内首款单条 512GB DDR5 内存
vivo 高端新机爆料:120Hz 曲面屏 + 天
vivo Y21 在印度正式上市:Helio P35 芯
微星推出 GeForce RTX 3080 Sea Hawk X
消息称三星 Galaxy Tab S8 系列平板将放
机械革命推出 F6 轻薄本:16 英寸全面屏
英特尔 12 代 Alder Lake CPU 600 系列
雷军:向小米手机 1 首批用户每人赠送价
小米李明谈用户被踢出 MIUI 测试版:大

推荐文章
1
2
3
4
5
6
7
8
9
10
叛逆嫩模性感写真
宫如敏不雅照疯传 看张馨予韩一菲兽兽谁
不惧孔子抢位 阿凡达游戏影音配置推荐
2015第十七届“东北安博会”火爆招商
第十六届东北国际公共安全防范产品博览
2016年第五届中国国际商业信息化博览会
2016年第五届中国国际POS机及相关设备展
互联网电视熟了吗 2013最火电视深解析
桑达获邀出席2015中国(广州)国际POS机
宝获利报名参加“2015年度中国POS机行业
八卦图解 More>>
叛逆嫩模性感写真 宫如敏不雅照疯传 看张馨予韩一菲
周伟童魔鬼身材日本性感写真图  联想V360笔记本模特写真