MDN上关于语义化的好处。Mdn
语义化标签
<body>,<nav>, <article>, <aside>
, < h1>, < h2>, < h3>
,< h4>, < h5>, < h6>, < hgroup>
, < footer>
, <section>
, <address>
figure标签mdn figure
Usually this is an image, an illustration, a diagram, a code snippet, or a schema that is referenced in the main text.
主要是在文本流中插入的图片，描述，图表，代码段，概要等等和文本有关的类似内容。
<figure>
<figcaption>黄浦江上的的卢浦大桥</figcaption>
<img></img>
</figure>
header标签 mdn header
The HTML <header>element represents a group of introductory or navigational aids. It may contain some heading elements but also other elements like a logo, wrapped section's header, a search form, and so on.
自己翻译得不太标准。head标签用来表示一组引导性或者导航性的帮助，它主要包括标题性的元素以及其他类似于logo,包裹单元的头部，搜索表单等等。
section标签 mdn section
The HTML <section> element represents a generic section of a document, i.e., a thematic grouping of content, typically with a heading. Each <section> should be identified, typically by including a heading as a child of the <section> element
html section标签，表示了文档的普通的部分，比如一组有主题的内容，特别是是包含了头部，每个section应该都是独一无二的，特别是包含了一个头部作为子节点。section和article是互相替代的，如果主要为了加样式或者当容器，应该要用div. outline of a document是文档的大纲么。
<section>
<h1>Forest elephants</h1>
<section>
<h1>Introduction</h1>
<p>In this section, we discuss the lesser known forest elephants.</p>
</section>
<section>
<h1>Habitat</h1>
<p>Forest elephants do not live in trees but among them.</p>
</section>
<aside>
<p>advertising block</p>
</aside>
</section>
<footer>
<p>(c) 2010 The Example company</p>
</footer>
能够从这样的结构中，提取文档大纲内容。
1. Forest elephants
1.1 Introduction
1.2 Habitat
article标签 mdn section
The HTML <article> element represents a self-contained composition in a document, page, application, or site, which is intended to be independently distributable or reusable (e.g., in syndication). This could be a forum post, a magazine or newspaper article, a blog entry, an object, or any other independent item of content. Each <article> should be identified, typically by including a heading as a child of the <article> element.
article表示文档，页面或者应用中自我独立的组成部分，独立分配以及可重用，可以是论坛的帖子，杂志或者报纸的文章，博文，或者对象，每个article都应该是独特的，包含一个heading作为子节点。
<article class="film_review">
<header>
<h2>Jurassic Park</h2>
</header>
<section class="main_review">
<p>Dinos were great!</p>
</section>
<section class="user_reviews">
<article class="user_review">
<p>Way too scary for me.</p>
<footer>
<p>
Posted on <time datetime="2015-05-16 19:00">May 16</time> by Lisa.
</p>
</footer>
</article>
<article class="user_review">
<p>I agree, dinos are my favorite.</p>
<footer>
<p>
Posted on <time datetime="2015-05-17 19:00">May 17</time> by Tom.
</p>
</footer>
</article>
</section>
<footer>
<p>
Posted on <time datetime="2015-05-15 19:00">May 15</time> by Staff.
</p>
</footer>
</article>
footer标签
The** HTML <footer> element** represents a footer for its nearest sectioning content orsectioning root element. A footer typically contains information about the author of the section, copyright data or links to related documents.
footer标签标识它最临近的sectioning content或者sectioning root的元素，footer标签主要包括跟这个section的作者有关的信息，版权，或者相关文档的链接。
一般我看到footer的使用分成几种，一种是跟header,section,组成一个部分
<section>
<header></header>
<section></section>
<footer></footer>
</section>
网友评论