浅谈：什么是 HTML 语义化？

这个不知道从哪里讲，因为，我平时写的代码，都是语义化的代码：

• 标题就写 h1 ~ h6 标签
• 文章就写 article 标签
• 如果是段落我就用 p 标签
• 如果是 svg 我就用 svg 标签
• 如果使用画板我就用 canvas 标签 等等 ...

这不就是 HTML 语义化吗？

非要我讲的话，我觉得这是存在一个「历史周期」的： HTML 开发（前端开发），分这么几个阶段：

1. 第一个阶段是「荒野阶段」：那个时候 HTML 是由后台开发人员来写的，纯属瞎写（也有写的好的后端，不过我确实见过有的后端写 HTML 写得稀烂，包括 CSS），他们使用 table 标签布局
2. 后面进入「美工阶段」：有一部分人来开始专门写 HTML + CSS，同时这部分人会一些 PS，他们使用 DIV + CSS 布局，其实现在很多前端也这么写，这样写其实没问题，但是不够语义化
3. 在后面就进入了前端阶段：有一群人专门开始以前端号称，他们如何展示自己的专业程度呢，就是他们该用 h1 的时候，就用 h1, 该用 p 就用 p，该用 article 就用 article，这就叫「专业」

总结：我就认为，第一种绝对不行，第二种其实是换汤不换药，也不是正确的写法，只有我们现在阶段，选择用正确的标签来写正确的东西，才是正确的写法

总结：

• 是什么：语义化标签是一种写 HTML 标签的方法论/方式。
• 怎么做：实现方法是遇到标题就用 h1 到 h6，遇到段落用 p，遇到文章用 article，主要内容用 main，边栏用 aside，导航用 nav……（就是找到中文对应的英文）
• 解决了什么问题：明确了 HTML 的书写规范
• 优点是：一、适合搜索引擎检索；二、适合人类阅读，利于团队维护。
• 缺点：没有（需要有一定的记忆能力）