前面我们已经将html代码写的合乎语法，具备语义，能够在很多环境被较好的解释。
我们觉得说可以上线了，但是上线之前我们还需要来衡量一些其它的因素，如系统的安全性、性能考虑、页面的内容是否正确等。
上线前，我们还需要好好的检查代码里的如下这些方面：
1 需要安全考虑的HTTP请求，使用POST来替换GET方式。考虑一下：搜索引擎来请求会怎么样，用户访问一个超时的连接会怎么样？
2 替换可以通过GET方式获取的地方为GET。GET方式通过URL而不一定要是form来访问，能够回退、cache、预先抓取、收藏。需要注意参数长度有限制
3 在不怎么变化的情况下使用cache，在易变的情况下关闭cache，如果变动实在太频繁的话，需要使用etag来辅助缓存
4 flash使用时需要注意会牺牲一部分用户
5 适当的时候将联系表单更改为mailto，方便用户直接发邮件进行交流
6 设置适当的robots.txt规则来阻挡一些无谓的请求。
User-agent: *
Disallow: /cgi-bin
Disallow: /store/checkout
User-agent: Googlebot
Disallow: /staging
Disallow: /experimental
环境已经搭好了，我们还需要做什么呢？
呵呵，我们还需要检查一下页面内容是否都是正确的：
1 流畅的内容表达，避免误拼。尽量避免一些带有歧义的表达，错别字等
2 删除那些失效的连接，可以使用这两个工具：http://validator.w3.org/checklink http://www.linklint.org/
3 如果删除了页面，尽量提供跳转给用户到新的页面上来，或者统一的给用户提示。
RewriteEngine On
RewriteOptions MaxRedirects=10 inherit
RewriteBase /
RewriteRule ^examples(.*) books/jdr/examples$1 [R]
4 将内容尽快的展示给用户，而不是让用户自己去导航。尽量少弄欢迎页这样的东东
5 对于一些敏感信息，如email这样的，尽量的隐藏起来，避免一些恶意的爬虫来爬取
<a href="mailto:elharo%40metalab%2Eunc%2Eedu">E-mail Me</a>
呵呵，上述都已经检查好了，跑一遍测试用例，在预发布机上进行一次校验，没有问题后，上线吧。
了解了一些html的基本语法后，我们需要在事件中来强化理解，从而加深影响，以后使用起来就会更加的得心应手。在实践中会有一些更多的细节的地方需要我们自己去斟酌和考虑。
了解html基本语法后，我们需要实践来学习html的语法，从而加深理解:
1 为了兼容，使用transitional的DTD来对文档进行校验。
2 删掉已经不再支持的一些标签。如sound、marquee等。
3 为每个img标签都加上一个alt标签。方便那些视觉障碍，或者兼容后续的一些语音浏览器、google、baidu等一些图片搜索更多会依赖alt属性来表示一张图片。
4 使用object标签来替换embed标签。Embed标签不是标准的，虽然同时可以存在任意多个属性，然而Object可以通过param来传递属性
<object
width="160" height="600">
<param value="sameDomain" />
<param value="banner.swf" />
<param value="high" />
<param value="#006699" />
<embed src="banner.swf" quality="high" bgcolor="#006699"
width="160" height="600"
align="middle" allowScriptAccess="sameDomain"
type="application/x-shockwave-flash"
pluginspage="http://www.macromedia.com/go/getflashplayer" />
</object>
为了兼容一些老的浏览器，可以在object里面写上embed标签来做兼容。
5 尽量使用strict的DTD。由于strict的DTD删除了一些遗留的表现元素的标签，需要做一些圆润的处理:
1) center用css来取代text-align:center
2) font用css来取代font-size、font-family、color
3) 替换i标签为em或者span。由于i标签更多是表现而无语义，所以在一些无显示的浏览器上并没有效果。
4) 替换b为strong或者span
5) 使用css属性来替换color属性
6) 将img标签中的诸多属性移动到CSS中来
7) 替换applet为object
8) 用css来表示big, small, strike, s, ...
对html进行重构，重构之前我们至少需要了解学习一下html的语法。打好基础功夫后，我们才能对重构的过程做到可控。
目前通常使用的xhtml的文档格式是什么样的？什么样的文档内容才是符合xhtml规范的机构的？
在不同的浏览器下试试这段html代码，看看它的DOM树是什么样的：
<p>The quick <strong>brown fox</p>
jumped over the
<p>lazy</strong> dog.</p>
不合乎规范的html代码，在不同的浏览器下解析出来的文档结构是不一样的。这对于我们的css和javascript的代码都是极大的挑战。
XHtml的最基本的要求：
1 标签有始要有终。
2 空标签需要遵循空标签的规则.<br />(注意加上空格来兼容一些老的浏览器)或者<br></br>
3 属性都需要有值。如同checked=”checked”
4 注意&以及<以及”、’的转义
5 只能有一个根节点html
6 没有预定义的节点需要在DTD中进行定义
7 Xhtml对标签和属性都要求是小写。
8 属性的值都需要使用单引号或者算引号括起来。(google处于带宽考虑，并不一定这样哦)
9 标签避免彼此交叉。（由于不同的浏览器为此构建的dom树不一样，会导致css和js出现问题的）
10 尽量使用UTF8的编码。通用，大部分浏览器都能识别
11 尽量引入Doctype
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<!DOCTYPE html
PUBLIC "-//W3C//DTD XHTML 1.0 Frameset//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-frameset.dtd">
详细的说明下三种DTD的区别：
三种DTD：frameset, transitional, strict.
1) frameset 允许页面包含frames
2) transitional保留了一些遗留的展现元素，如i、b、u、iframe、applet等
3) strict移出了遗留的展现元素，以及一些可以使用CSS来表达的属性。同时加强了一些元素的内容的描述。
浏览器一般是不会去加载DTD的，他们预先已经知道了这些DTD的，所以这里没有性能上的损失。不过一些XLST的工具回去加载DTD的。
12 尽量加上XHTML的命名空间，一些XLST的工具需要这个。
<html xmlns="http://www.w3.org/1999/xhtml">
意识到重构对于系统效率的重要性，是不是开始想要动手对现有的项目进行一次尝试呢。
呵呵，不要急，重构之前你做好准备了么，譬如说做好现有系统的备份了么，或者说你找到了你现有程序的问题在哪里了么？
下面这些重构中常常会使用到的工具，可能会在重构的过程中帮助我们来节省工作量，做到事半功倍的效果：
1 版本管理的工具，可以做到快速的回滚
2 问题定位工具，能够辅助我们去定位当前系统的问题所在
3 自动化测试的工具，能够辅助我们安全进行重构
我们常常用到的工具有如下这些，你还有其它工具推荐的么:
1 SVN版本管理，随时回滚。如果可以的话，准备一台干净一点预发布机，可以完整模拟运营的环境，便于进行校验。
2 HTML合法性校验工具：http://www.w3.org/QA/Tools/，查找当前系统存在什么问题。
1) http://validator.w3.org/
可以下载到本地的服务器进行安装：http://validator.w3.org/docs/install.html
2) xmllint BBEdit
3 测试工具：（自动化测试）
1) HtmlUnit:http://htmlunit.sourceforge.net/(表现的更像是一个browser)
2) HttpUnit: http://httpunit.sourceforge.net/(相比上一个更底层一些)
3) JwebUnit
4) http://fitnesse.org/
5) Selenium
4 Tidy(将重复的工作交给工具来完成吧) www.w3.org/People/Raggett/tidy/
1) –asxhtml
2) --enclose-text
3) –clean
5 TagSoup
读了一次HTML重构Refactoring HTML，正好最近在搞一些html重构方面的东东,边度边思考，有一些收获，记录一下，便于以后来查询。
大家都可能会想html这么简单的一个排版的东东，有什么需要重构的呢？html的重构会有一些什么具体的东东呢?
开始之前，自己总结的几个概念。
重构的反面不是不重构，而是重写。重构的目的是为了更方便的进行重构。
重构的几个关键词：系统 一部分 调整 更好 可预期 可控
重构：是在一段可预期的时间内可控的对系统的一部分进行调整，从而使得系统的效率变得更高的过程。
为什么要重构？
1 代码可读性很差。Css和html混合在一起
2 渲染很慢
3 浏览器不兼容
4 页面需要一些不太流行的技术，如silverlight，flash等
5 安全性差。可能被人引发xss漏洞
6 SEO太差，被搜索引擎索引在很后的页面
7 用户的抱怨
重构些什么？
1 XHMTL
2 CSS
3 REST
XHTML
1 良好的格式，减轻浏览器容错的工作。
2 减少跨浏览器编程js和css调试的时间。
3 可以使用一些新的技术，如SVG、MusicXML等。HTML更多关注文本和图片。
CSS
1 样式和展现分离，相同的内容可以在不同的平台上展现，如手机平台，台式机平台。
2 抽象出来的样式可以四处可用。减少工作量。DRY，Don't Repeat Yourself. (常用的reset.css)
3 抽象出来四处可用，节省带宽。
REST: Representational State Transfer深入理解http协议
关注：Form、UA用户验证、Cookie、回话、状态
1 通过URL来定位资源：
如通过http://www.example.com/foo/bar来回去资源，总比说到 http://www.example.com/，然后在表单中输入bar，然后点击foo按钮会好一些。
2 在合适的地方（譬如无安全问题、查询、收藏夹）尽量使用GET方式的请求。
3 在需要安全验证如买东西，发表评论的地方使用POST方式。
4 每一次请求都是唯一的，客户端和服务器的状态各自独立，互补依赖，每次需要的信息通过通讯时带上来获取。无状态的服务能够提供cache以及扩展的方便性。