一些关于HTML优化的心得

日期：2010年3月16日作者：相关tags: HTML 优化心得

在Perfection kills上看到他去年写的一篇文章，关于HTML优化的，讲的很细致，姑且记载之，虽然外面有些东西并无法在当前的环境里使用。在当前WEB使用逐渐前端化的潮流下，对客户端的优化越来越遭到重视，如何降低代码，如何让使用高速的展现给用户，如何降低用户等待工夫等等，如雅虎的34条优化黄金法则外面提出了详尽的优化方案。

网页优化的最基本的部分应该就是HTML的优化，细致来说最先就是标记的整理，整理标记不只仅能缩减文档的大小，并且可以让文档更易于维护进步搜索引擎的可见度(Clean markup means better accessibility, easier maintenance, and good search engine visibility),但是即便是那些号称高度优化过的网页，假如细心查看代码，照旧可以发觉许多可以删减或者曾经过时的标记用法：

1.script里的注释符

除非是像95 Netscape 1.0这类几乎绝迹的阅读器须要这样的处理，在大部分主流阅读器里，往脚本块里添加HTML注释是完全不须要的。

2.<![CDATA[ … ]>

这是另外一个时常在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=”…” … >