诺禾-诺禾科技-HTML5-语义化

距HTML5规范标准制定完成并公开发布曾经有好些年了，面试时也少不了要问对HTML5语义化得了解。但是在实践运用时，真正运用HTML5标签来开发的似乎不是很多（ps：查看了几个巨头公司网站推论），可能一局部缘由是仍有局部用户运用在运用低版本阅读器。

但是就我个人而言，因选取一些标签时会比拟纠结，所以仍运用了div。（PS：正是由于这样，才有了这篇文章的，没错，以后要留意语义化了）

什么是语义化？就是用合理、正确的标签来展现内容，比方h1~h6定义标题。

语义化优点：

易于用户阅读，款式丧失的时分能让页面呈现明晰的构造。
有利于SEO，搜索引擎依据标签来肯定上下文和各个关键字的权重。
便当其他设备解析，如盲人阅读器依据语义渲染网页
有利于开发和维护，语义化更具可读性，代码更好维护，与CSS3关系更调和。
今天先引见主体构造标签，如图所示：

html5

1、

定义文档或者文档的局部区域的页眉，应作为引见内容或者导航链接栏的容器。
在一个文档中，您能够定义多个

元素，但需求留意的是
元素不能作为
、
或
元素的子元素。
2、

描绘一个含有多个超链接的区域，该区域包含跳转到其他页面或页面内部其他局部的链接列表。
在一个文档中，可定义多个

元素。
3、

定义文档的主要内容，该内容在文档中应当是无独有偶的，不包含任何在文档中反复的内容，比方侧边栏，导航栏链接，版权信息，网站logo，搜索框（除非搜索框作为文档的主要功用）。
需求留意的是在一个文档中不能呈现多个

标签。
4、

元素表示文档、页面、应用或网站中的独立构造，是可独立分配的、可复用的构造，如在发布中，它可能是论坛帖子、杂志或新闻文章、博客、用户提交的评论、交互式组件，或者其他独立的内容项目。
当

元素嵌套运用时，则该元素代表与外层元素有关的文章。例如，代表博客评论的
元素可嵌套在代表博客文章的
元素中。
5、

元素表示一个和其他页面内容简直无关的局部，被以为是独立于该内容的一局部且能够被单独的拆分出来而不会影响整体。通常表现为侧边栏或嵌入内容。
6、

定义最近一个章节内容或者根节点元素的页脚。一个页脚通常包含该章节作者、版权数据或者与文档相关的链接等信息。
运用footer插入联络信息时，应在 footer 元素内运用

元素。
留意不能包含

或者
7、

表示文档中的一个区域（或节），比方，内容中的一个专题组。
假如元素内容能够分为几个局部的话，应该运用

而不是
。
不要把
元素作为一个普通的容器来运用，特别是当
仅仅是为了美化款式或便当脚本运用的时分，应运用
。
这几个标签，比拟容易混杂的是

、
，所以这里特别阐明：
“Authors are encouraged to use the article element instead of the section element when it would make sense to syndicate the contents of the elemen.”

浅显来说就是

比
更具有独立性、完好性。可经过该段内容脱离了所在的语境，能否完好、独立来判别。