Web语义化演进-优快云博客

起因

但是随着 Web 规模的不断扩大，这个时候人们开始用机器来处理 Web 上发布的各种内容，搜索引擎就诞生了，

再后来，人们又设计了各种智能程序来对索引好的内容作各种处理和挖掘，

让机器能够更好地读懂 Web 上发布的各种内容就变得越来越重要。

所以Web语义化，就是指使用语义恰当的标签，使页面有良好的结构，页面元素有含义，能够让人和搜索引擎都容易理解。

阶段

Web语义化有三个阶段。

1、浏览器和W3C组织推出的如h1~h6、thead、ul、ol的HTML标签，用于在Web页面中组织对应的内容，如网页标题、表头、无序、有序列表，以达到更方便的协作及传播互联网内容。搜索引擎很好的利用了这些语义化标签抓取内容，又鉴于搜索引擎的巨大流量推荐，Web前端不得不考虑SEO，从而两者实现有益的循环，共同推进着语义化标签的使用。

2、但Web的发展超乎想象，起初定义的HTML语义化标签，不足以实现对Web页面各个部分的功能或位置描述，所以Web前端人员利用HTML标签的id和class属性，进一步对HTML标签进行描述，如对页脚HTML标签添加如id="footer"或者class="footer"的属性（值），以“无声”的方式在不同的前端程序员或者前后端程序员间实现交流。

3、W3C组织意识到了之前HTML版本的不足，推出的HTML5进一步推进了Web语义化发展，采用了诸如footer、section等语义化标签，弥补了采用id="footer"或者class="footer"形式的不足，以更好的推动Web的发展。

现状

HTML5新标签，当然以前的标签很多语义化的含义。http://www.w3school.com.cn/tags/index.asp

标签	描述
<article>	定义文章。
<aside>	定义页面内容之外的内容。
<audio>	定义声音内容。
<bdi>	定义文本的文本方向，使其脱离其周围文本的方向设置。
<canvas>	定义图形。
<command>	定义命令按钮。
<datalist>	定义下拉列表。
<details>	定义元素的细节。
<dialog>	定义对话框或窗口。
<embed>	定义外部交互内容或插件。
<figcaption>	定义 figure 元素的标题。
<figure>	定义媒介内容的分组，以及它们的标题。
<footer>	定义 section 或 page 的页脚。
<header>	定义 section 或 page 的页眉。
<keygen>	定义生成密钥。
<mark>	定义有记号的文本。
<meter>	定义预定义范围内的度量。
<nav>	定义导航链接。
<output>	定义输出的一些类型。
<progress>	定义任何类型的任务的进度。
<rp>	定义若浏览器不支持 ruby 元素显示的内容。
<rt>	定义 ruby 注释的解释。
<ruby>	定义 ruby 注释。
<section>	定义 section。
<source>	定义媒介源。
<summary>	为 <details> 元素定义可见的标题。
<time>	定义日期/时间。
<track>	定义用在媒体播放器中的文本轨道。
<video>	定义视频。
<wbr>	定义可能的换行符。