HTML语义化的重要性
首先解释一下什么是语义化？
“语义化是指用合理HTML标记以及其特有的属性去格式化文档内容。
语义化的(X)HTML文档有助于提升你的网站对访客的易用性，比如使用PDA、文字浏览器以及残障人士将从中受益。对于搜索引擎或者爬虫软件来说，则有助于它们建立索引，并可能给予一个较高的权值。
事实上SEO最有效的一种办法，就是对网页的HTML结构进行重构，实质上就是语义化。”
分离结构与表现的另一个重要方面是使用语义化的标记来构造文档内容。一个 XHTML 元素的存在就意味被标记内容的那部分有相应的结构化的意义，没有理由使用其他的标记。换句话说，不要让 CSS 使一个 HTML 元素看起来就像另一个 HTML 元素，比如用<span>来代替<h1>标记标题。
通过使用语义化的 HTML ，你将会使文档中的不同部分对于任何浏览器都变得有意义，无论浏览器是现今 PC 上的最新的图象化浏览器，还是不支持 CSS 的老浏览器，或者还是 Unix shell 中的文本浏览器。
让你语义化HTML结构的无数条理由，其中最重要得有以下两条：
1.首先，有视觉障碍的人使用一种屏幕阅读器的辅助技术，来为他们读出web页面内容。
这些技术以多种方式使用语意，例如，它们使用标题来导航不同的内容片段，因此，用户可以在页面上找到想要的东西。如果没有语意的话，这些用户就不可能高效的获取想要的信息。
2.搜索引擎的爬虫也依赖于标记来确定上下文和各个关键字的权重。
搜索引擎的爬虫也是网站的“访客”,现在它们是极其宝贵的用户。没有他们的话,搜索引擎将无法索引你的网站,然后一般用户将很难过来访问。
标题
为了给标题做标记, 要用 <h1> 、<h2> 、<h3> 、 <h4> 、 <h5> 或者 <h6> ，这完全取决于标题的等级。<h1>是最7高的等级。
例如:
<h1>文档标题</h1>
<h2>次级标题</h2>
文档标题
次级标题
段落
用<p>来标记段落。不要使用 <br /> 来生成段落间的空行。用 CSS 来控制段落间的空隙（Margins），这个空隙可以确保段落标记的正确无误。
例如:
<p>浪奔浪流，万里滔滔江水永不休，淘尽了世间事，混作滔滔一片潮流，是喜是愁，
浪里分不清欢笑悲忧，成功失败，浪里看不出有未有。爱你恨你问君知否，似大江一发不收，
转千湾转千滩，也未平复此中争斗，又有喜又有愁，就算分不清欢笑悲忧，仍愿翻百千浪，
在我心中起伏够。</p>
列表
一些事物的罗列应使用列表来显示。在XHTML中有三种列表的方法：无序、有序和自定义。
无序列表, 就是我们所熟知的圆圈列表, 以 <ul>开始，以</ul>结束。每一个列表项都包含在<li>之中。
有序列表，以<ol>开始，以</ol>结束。
自定义列表有一些不同，可以用来标记一些列表项和描述，以<dl>开始，以</dl>结束。每一个被描述的项目，要包含在<dt>中，而描述的内容要包含在<dd>中。
例如:
<ul>
<li>项目一</li>
<li>项目二</li>
<li>项目三</li>
</ul>
<ol>
<li>项目一</li>
<li>项目二</li>
<li>项目三</li>
</ol><dl>
<dt>上海滩</dt>
<dd>这部拍摄于1980年的《上海滩》堪称是香港电视史上最成功、最经典的剧集。
当年在香港播出以后，产生了巨大的轰动效应。</dd>
<dt>周润发</dt>
<dd>和所有伟大的影星一样，周润发印证了一个时代，一个香港电影的黄金时代。
风衣墨镜、冷血双枪、阳光微笑，都封存胶片之中，当我们回首寻望的时候，发哥已被刻为一个时代的坐标。</dd>
</dl>
引用
用<q>来标记简短的单行引用。Web浏览器会自动识别在<q>之间的内容。不幸的是，IE不能识别，并且有些时候<q>会引起一些可访问性的问题。正因为如此，一些人建议尽量不要使用<q>,手动的插入引用标记。在一个包含适当的类的<span>中加入单行的引用内容，那么就可以用CSS来给引用设计样式了，但是这个没有语义上的意义。 您可以读读Mark Pilgrim写的The Q tag 关于处理<q>相关问题的看法。
对于那些一段或者好几段的长篇引用，就应当使用<blockquote>了。CSS可以用来定义引用的样式。注意，一段文章是不可以直接放在<blockquote>中的，引用的内容还必须包含在一个元素中，通常是<p>。
属性cite既可以与<q>一起用，也可以与<blockquote>一起用，用来提供引用内容的来源地址。需要注意的是，如果你使用<span>来代替<q>标记引用内容,那么你就不能使用cite属性了。
例如:
<p>我的座佑名<q cite="http://www.x5.com.cn/">别人的高标准，是我的基本要求。</q>.</p><p>我的座佑名<span>“别人的高标准，是我的基本要求。”</span>.</p>
强调
<em> 是用作强调的，<strong>是用作重点强调的。 大部分浏览器用斜体显示强调的内容，用粗体来显示重点强调的内容，然而，这是没有必要的，如果是为了确定强调内容的显示方式，最好的方法就是使用CSS来定义他们的表现。当你想要的只是视觉上的效果时，就不要使用强调了。。
例如:
<p><em>强调</em> 的文本通常用斜体显示， 然而， <strong>特别强调</strong> 的文本通常以粗体显示。</p>
强调 的文本通常用斜体显示, 然而，特别强调的文本通常以粗体显示。
表格
XHTML 中的表格不应用来布局。然而如果是为了标记列表的数据，就应该使用表格了。为了使数据表格有更强的访问性，了解和使用各种构造表格的组件就很重要了。比如表格标题 （<th>）、摘要（summary 属性）和首部说明 （ <caption>标签）。
例如:
<table summary="1999年到2003年，列表显示中国的平均人口增长率。">
<caption>中国的年均人口的增长, 1999–2003</caption>
<thead>
<tr>
<td> </td>
<th scope="col">1999</th>
<th scope="col">2000</th>
<th scope="col">2001</th>
<th scope="col">2002</th>
<th scope="col">2003</th>
</tr>
</thead>
<tbody>
<tr>
<th>人口</th>
<td scope="row">8 861 426</td>
<td scope="row">8 882 792</td>
<td scope="row">8 909 128</td>
<td scope="row">8 940 788</td>
<td scope="row">8 975 670</td>
</tr>
<tr>
<th>增长</th>
<td scope="row">7 104</td>
<td scope="row">21 366</td>
<td scope="row">26 368</td>
<td scope="row">31 884</td>
<td scope="row">34 882</td>
</tr>
</tbody>
</table>
