HTML标签语义化小结

浏览数：19 / 时间：2015年06月09日

HTML语义化是个面试过程中喜闻乐见的问题，问得多了，也是时候要作个系统的总结，这样才能形成知识网络。

技术分享

所谓标签语义化，其实就是按照标准，给内容用上一个最恰当最合适的标签，这样一来，就算样式表没加载，也能正常浏览文章。对了，说起这个，我想起我手机在浏览部分网站的时候会有个阅读模式的东西，就是把样式去掉，让你更专注于文本，所以如果你的语义化做得不好，在这种阅读模式下是会“死人”的，哈哈哈。

技术分享

　　每个HTML标签都有自己的意义，也有自己的适用范围，但往往会被我们忽略或者滥用，比如，div标签，这个标签常用来布局，但是它其实是一个无意义的标签，并不利于后期维护。

　　好处：

去掉样式或者样式丢失时页面结构依然清晰分明
移动设备能够更加完美的展示你的网页
阅读器会根据标签的语义自动解析，呈现更容易阅读的内容形式（无障碍阅读）
搜索引擎会根据标签的语义确定上下文和权重问题（有利于SEO）
便于后期的开发以及维护，团队合作效率提高

　　既然好处多多，那么是需要好好记记的，下面这个表格来源于网络：

标签	描述
<!–…–>	定义注释。
<!DOCTYPE>	定义文档类型。
<a>	定义超链接。
<abbr>	定义缩写。
<acronym>	HTML 5 中不支持。定义首字母缩写。
<address>	定义地址元素。
<applet>	HTML 5 中不支持。定义 applet。
<area>	定义图像映射中的区域。
<article>	定义 article。
<aside>	定义页面内容之外的内容。
<audio>	定义声音内容。
<b>	定义粗体文本。
<base>	定义页面中所有链接的基准 URL。
<basefont>	HTML 5 中不支持。请使用 CSS 代替。
<bdi>	定义文本的文本方向，使其脱离其周围文本的方向设置。
<bdo>	定义文本显示的方向。
<big>	HTML 5 中不支持。定义大号文本。
<blockquote>	定义长的引用。
<body>	定义 body 元素。
<br>	插入换行符。
<button>	定义按钮。
<canvas>	定义图形。
<caption>	定义表格标题。
<center>	HTML 5 中不支持。定义居中的文本。
<cite>	定义引用。
<code>	定义计算机代码文本。
<col>	定义表格列的属性。
<colgroup>	定义表格列的分组。
<command>	定义命令按钮。
<datalist>	定义下拉列表。
<dd>	定义定义的描述。
<del>	定义删除文本。
<details>	定义元素的细节。
<dfn>	定义定义项目。
<dir>	HTML 5 中不支持。定义目录列表。
<div>	定义文档中的一个部分。
<dl>	定义定义列表。
<dt>	定义定义的项目。
<em>	定义强调文本。
<embed>	定义外部交互内容或插件。
<fieldset>	定义 fieldset。
<figcaption>	定义 figure 元素的标题。
<figure>	定义媒介内容的分组，以及它们的标题。
<font>	HTML 5 中不支持。
<footer>	定义 section 或 page 的页脚。
<form>	定义表单。
<frame>	HTML 5 中不支持。定义子窗口（框架）。
<frameset>	HTML 5 中不支持。定义框架的集。
<h1> to <h6>	定义标题 1 到标题 6。
<head>	定义关于文档的信息。
<header>	定义 section 或 page 的页眉。
<hgroup>	定义有关文档中的 section 的信息。
<hr>	定义水平线。
<html>	定义 html 文档。
<i>	定义斜体文本。
<iframe>	定义行内的子窗口（框架）。
<img>	定义图像。
<input>	定义输入域。
<ins>	定义插入文本。
<keygen>	定义生成密钥。
<isindex>	HTML 5 中不支持。定义单行的输入域。
<kbd>	定义键盘文本。
<label>	定义表单控件的标注。
<legend>	定义 fieldset 中的标题。
<li>	定义列表的项目。
<link>	定义资源引用。
<map>	定义图像映射。
<mark>	定义有记号的文本。
<menu>	定义菜单列表。
<meta>	定义元信息。
<meter>	定义预定义范围内的度量。
<nav>	定义导航链接。
<noframes>	HTML 5 中不支持。定义 noframe 部分。
<noscript>	定义 noscript 部分。
<object>	定义嵌入对象。
<ol>	定义有序列表。
<optgroup>	定义选项组。
<option>	定义下拉列表中的选项。
<output>	定义输出的一些类型。
<p>	定义段落。
<param>	为对象定义参数。
<pre>	定义预格式化文本。
<progress>	定义任何类型的任务的进度。
<q>	定义短的引用。
<rp>	定义若浏览器不支持 ruby 元素显示的内容。
<rt>	定义 ruby 注释的解释。
<ruby>	定义 ruby 注释。
<s>	HTML 5 中不支持。定义加删除线的文本。
<samp>	定义样本计算机代码。
<script>	定义脚本。
<section>	定义 section。
<select>	定义可选列表。
<small>	将旁注 (side comments) 呈现为小型文本。
<source>	定义媒介源。
<span>	定义文档中的 section。
<strike>	HTML 5 中不支持。定义加删除线的文本。
<strong>	定义强调文本。
<style>	定义样式定义。
<sub>	定义下标文本。
<summary>	定义 details 元素的标题。
<sup>	定义上标文本。
<table>	定义表格。
<tbody>	定义表格的主体。
<td>	定义表格单元。
<textarea>	定义 textarea。
<tfoot>	定义表格的脚注。
<th>	定义表头。
<thead>	定义表头。
<time>	定义日期/时间。
<title>	定义文档的标题。
<tr>	定义表格行。
<track>	定义用在媒体播放器中的文本轨道。
<tt>	HTML 5 中不支持。定义打字机文本。
<u>	HTML 5 中不支持。定义下划线文本。
<ul>	定义无序列表。
<var>	定义变量。
<video>	定义视频。
<xmp>	HTML 5 中不支持。定义预格式文本。