html语义化怎么体现？

---

上古时代，万物皆table，后来万物皆div，大家伙长得都一样，即使是自己写的代码 首先概括语义化的定义：合理、正确的使用标签来展示内容

优点：

• 易阅读，样式丢失时也能呈现清晰的结构
• 利于SEO,搜索引擎根据标签来确定上下文和各个关键字的权重
• 方便其他设备解析，如盲人阅读器
• 利于开发和维护

标签及语义

• header
  • 定义文档或者文档的部分区域(section)的页眉
  • 通常包含H1~H6,hgroup,
  • 作为整个页面或者内容块的标题，也可以包裹一节的目录部分，一个搜索框，一个nav，或者任何相关logo
• footer
  • 定义最近一个章节内容或者根节点元素(section)的页脚
  • 通常含有该页面的一些基本信息，例如：文档创作者的姓名、文档的版权信息、使用条款的链接、联系信息等等
• hgroup
  • 代表页面或section的标题
  • 当元素有多个层级时，该元素可以将h1到h6元素放在其内，譬如文章的主标题和副标题的组合
  • 如果只需要一个h1-h6标签就不用hgroup
• nav
  • 描述一个含有多个超链接的区域，该区域包含跳转到其他页面或页面内部其他部分的链接列表
• main
  • 代表页面的导航链接区域,用于定义页面的主要导航部分
• article
  • 表示文档、页面、应用或网站中的独立结构，是可独立分配的、可复用的结构
  • 如在发布中，它可能是论坛帖子、杂志或新闻文章、博客、用户提交的评论、交互式组件，或者其他独立的内容项目
  • 最容易跟section和div容易混淆，article代表一个在文档，页面或者网站中自成一体的内容，其目的是为了让开发者独立开发或重用
• aside
  • 在article内表示主要内容的附属信息
  • 被认为是独立于该内容的一部分且可以被单独的拆分出来而不会影响整体。通常表现为侧边栏或嵌入内容
• section
  • 表示文档中的一个区域（或节），比如，内容中的一个专题组