h5新增语义化结构标签使用场合及注意事项

一、h5新增的语义化的结构标签

   主要包括：

    <hgroup></hgroup>

    <header></header>

    <nav></nav>

    <section></section>

    <footer></footer>

    <article></article>

     <aside></aside>

二、语义化好处：

       可以让很多更语义化结构化的代码标签代替大量的无意义的div标签，这种语义化的特性提升了网页的质量和语义，对搜索引擎更加的友好。

      它们没有任何的默认样式，

 三、新增语义化结构标签的使用场合及注意事项

       1、 hgroup元素代表网页或section的标题，当元素有多个层级时，该元素可以将h1到h6元素放在其内，譬如文章的主标题和副标题的组合

         hgroup使用注意：

         如果只需要一个h1~h6标签就不用hgroup

         如果 有连续多个h1~h6标签就用hgroup

         如果有连续多个标题和其他文章数据，h1~h6标签就用hgroup包住，和其他文章元数据一起放入header标签。

       2、Header 元素代表网页或section的页眉，通常包含h1-h6元素或hgroup        

        Header使用注意：

        可以是“网页”或任意“section”的头部部分，没有个数限制，如果hgroup或h1~h6自己就能工作的很好，就不要用header

      3、Nav元素代表页面的导航链接区域，用于定义页面的主要导航部分 

           nav使用注意：用在整个页面主要导航部分上，不合适就不要用nav元素

        4、Section元素代表文档中的节或段，段可以是指一篇文章里按照主题的分段；节可以是指一个页面里的分组

        Section使用注意：

        Section不是一般意义上的窗口元素，如果想作为样式展示和脚本的舍不得，可以用div。

         Article、nav、aside可以理解为特殊的section，

       如果可以用article、nav、aside就不要用section，没实际意义的就用div

      5、Article元素最容易跟section和div容易混淆，其实article代表一个在文档，页面或者网站中自成一体的内容。

         article使用注意：

          独立文章：用article

         单独模块：用section

          没有语义的：用div

      6、side元素被包含在article元素中作为主要内容的附属信息部分，其中的内容可以是与当前文章有关的相关资料、标签、名词解释等

          在article元素之外使用作为页面或站点全局的附属信息部分。最典型的是侧边栏，其中的内容可以是日志串连，其他组的导航，

       aside使用总结

        aside在article内表示主要内容的附属信息，

        在article之外则可做侧边栏

       如果是广告，其他日志链接或者其他分类导航也可以用

  7、footer元素定义 section 或 document 的页脚。

        在典型情况下，该元素会包含创作者的姓名、文档的创作日期以及/或者联系信息