标准的HTML代码
标准的HTML代码指的是HTML代码符合W3C的最新标准。
1、验证代码是否符合标准
标准的页面的优点：
标准的页面会保证浏览器正确地渲染；
网页能更容易被搜索引擎搜寻，提高网站的搜索排名；
提高网站的易用性；
网页更好维护和扩展。
验证页面代码最直接的方式是用W3C提供的一项免费的验证服务W3C Validator。它提供三种验证方式：URL、文件上传、直接输入代码。
推荐使用HTML Validator，它是一个Firefox浏览器的插件。
2、标准的HTML页面结构
一个基本的HTML文档结构就是：
<!DOCTYPE html>
<html>
<head></head>
<body></body>
</html>
<!DOCTYPE html>为文档类型声明（HTML5中），使得HTML文档能兼容标准格式。
head部分包含文档的一些基本信息，如网站的编码格式、网站的标题、网站引用的样式和脚本等。
网站的标题：是作为站点的名称和简短描述显示在浏览器的标题栏上的。
<title>网站标题</title>
如果引用JavaScript和CSS外部文件，则需要把外部文件的链接添加到head部分
<link rel="stylesheet" type="text/css" href="my_style.css"/>
<script type="text/javascript" src="my_script.js"></script>
head部分还会包含一些必要的meta标签，是对HTML文档内容的描述，用来表明文档的编码、关键字、介绍、作者等信息。
<meta charset="utf-8">
<meta name="keywords" content="HTML,web">
<meta name="description" content="一个展示HTML页面的例子">
body部分则包含所有在浏览器上展示的内容，如文本、图片、表格、音视频等。
一个稍微完善的页面：
<!DOCTYPE html>
<html>
<head>
<title>网站标题</title>
<meta charset="utf-8">
<meta name="keywords" content="HTML,web">
<meta name="description" content="一个展示HTML页面的例子">
<link rel="stylesheet" type="text/css" href="my_style.css">
<script type="text/javascript" src="my_script.js"></script>
</head>
<body>
<h1>Sample page</h1>
<p>This is a <a href="demo.html">simple</a> page.</p>
<!-- This is a comment -->
</body>
</html>
3、正确闭合HTML标签
HTML中有一些元素是空元素，即不能包含任何内容，也称为自闭合标签。
HTML中的所有自闭合标签：area、base、br、col、command、embed、hr、img、input、keygen、link、param、source、track、wbr。
HTML多个版本的规范都规定了非自闭合标签必须有开始标签和结束标签，而自闭合标签没有闭合标签。
<!-- 非自闭合标签必须有开始标签和结束标签 -->
<a href="demo.html">simple</a>
<!-- 自闭合标签必须没有结束标签 -->
<img src="demo.png" alt="demo" />
有关自闭合标签中是否应该添加符号“/”，在XHTML的规范中最严格，必须添加“/”来表明标签的结束。在HTML4.01的规范中不推荐在自闭合标签中添加“/”来表明标签的结束。
在HTML5中是最宽松的，自闭合标签中添加“/”是可选的。
4、停止使用不标准的标签和属性，简化HTML代码
不推荐使用单纯设置样式的标签，如basefont、big、center、font等，应该通过CSS设置样式。
不推荐在HTML标签中添加样式属性，应该通过CSS样式来实现。
不推荐使用<blink>或<marquee>（闪动或滚动）。应该通过JavaScript代码来实现，可以使用jQuery Marquee插件。
不推荐使用不具语义的标签，如<b>和<i>显示黑体字和斜体，使用更具有语义的<strong>和<em>。
移除不常用的HTML标签，包括acronym、applet、dir等。
5、样式与结构分离
把CSS样式应用于HTML总共有4种方式：
（1）在HTML页面中链接一个CSS文件，做到了样式与结构的分离。（最佳实践的方式，推荐使用）
<link rel="stylesheet" type="text/css" href="my_style.css">
（2）在HTML页面中内嵌CSS样式。（在某些场合有选择地灵活使用）
<style type="text/css">
body {
margin: 0;
padding: 0;
}
</style>
（3）在HTML标签中添加内联CSS样式。（应避免在页面中直接使用）
<span style="color: green; background: transparent">green</span>
（4）在CSS样式文件中加载CSS样式文件。（在任何场合都应该避免使用）
@import "my_style.css";
@import url("my_style.css");
6、添加JavaScript禁用的提示信息
<noscript>标签是在当JavaScript被禁用或者不被支持时提供的一个代替方式，即<noscript>标签中的内容会在此时被浏览器解析。
<script>
//一些操作
</script>
<noscript>
<p>浏览器不支持JavaScript</p>
</noscript>
<noscript>不够灵活，有时JavaScript不可用并不是因为脚本被禁用导致的。因此最好不要使用<noscript>标签。
最佳的实践是：提示用户JavaScript已被禁用，并同时提供一个功能简单、不依赖于JavaScript的代替网站供用户继续浏览，做到平稳降级。
7、添加必要的<meta>标签
<meta>标签中基本上包含网站的一些描述信息，如简介、作者等。
<meta>元素有4个属性：name、http-equiv、content和charset。
<meta>可以分为三类：
（1）name属性和content属性的组合，构成名/值对，用于描述网站的信息。标准的<meta>名称包括：application-name、author、description、generator等。
<!-- 页面关键字 -->
<meta name="keywords" content="HTML,web">
（2）http-equiv属性和content属性的组合。设置特定的HTTP指令。
在HTML5的规范中，指令型meta总共有5种，其中content-type、default-style、refresh已经确定，content-language和set-cookie还未正式确定。
<!-- 页面加载5分钟后刷新 -->
<meta http-equiv="refresh" content="300">
（3）charset属性，设置页面字符编码。提供了一种保存和传输文档的编码格式。
<!-- 声明文档为UTF-8格式 -->
<meta charset="utf-8">
为了让浏览器能准确识别编码格式，务必在<title>标签之间设置charset，保证标题能正确显示。
W3C规范中允许自定义meta类型，但为了防止自定义的meta名称重复，所有的自定义meta应该事先注册。
