HTML 语义化

前言

1. 什么是语义化

答曰：的结构化（内容语义化），选择合适的标签（代码语义化），便于开发者阅读和写出更优雅的代码的同时，让浏览器的爬虫和机器很好的解析。

2. 明明div和span已经够用了，为什么还需要语义化呢?

答曰：

• 有利于SEO，有助于爬虫抓取更多的有效信息，爬虫是依赖于标签来确定上下文和各个关键字的权重。
• 语义化的HTML在没有CSS的情况下也能呈现较好的内容结构与代码结构
• 方便其他设备的解析
• 便于团队开发和维护

3. 那么如何做到语义化呢？

答曰：语义化即在正确的时候使用HTML正确的标签。具体且看下文。

常用语义化标签

部分标签示例

• abbr：缩写
• hr：用于故事走向的转变或者话题的转变
• mark：表示高亮
• sub：上标
• sup：下标
• var：变量，多用于计算机和属性领域
• kbd：用户输入，表示键盘按键居多
• bdi、bdo：用于多语言很合时指定语言或书写方向（左→右/右→左）
• wbr：表示可以换行的位置，主要是英文等文字不允许单词中间换行，这个标签一般在把多个单词粘成很长的单词时用
• menu： ul的变体，用于功能菜单时使用
• dl、dd、dt：一般出现较为严肃的文章，对一些术语进行定义，dt和dd并不总是成对出现，是多对多的关系
• code：用于代码
• pre：表示该部分已经排版过，不需要再排版
• samp：用于计算机程序的输出示例
• cite：用于引述作品名
• article：用于文章
• aside：用于页面侧边栏
• note：文章中的额外注释
• section：用于一个章节，通常该章节包括标题和内容
  ....

emmmm，太多了，还是放弃吧

结语

不用比用错好