怎样理解 HTML 语义化
HTML 语义化是在 HTML5 里加入的一个概念。
为什么要加入语义化?我们先看看没有语义化的 HTML 文档是怎么写的。
* <div id="header">
* <div id="nav">
* <div id="footer">
<div>
这个标签没有给文档带来任何语义,我不知道它包裹的内容是什么东西,只能通过后面的 id 才能知道。慢慢的,基本上所有开发者都这么写,那为什么不干脆把 <div id="header">
直接改成一个 <header>
标签呢?这样岂不是简洁方便?
那语义化有什么用呢?
- 在没有 CSS 的情况下,页面也能呈现出很好的内容结构、代码结构,祼奔时好看
- 用户体验:例如title、alt用于解释名词或解释图片信息、label标签的活用
- 有利于SEO:和搜索引擎建立良好沟通,有助于爬虫抓取更多的有效信息:爬虫依赖于标签来确定上下文和各个关键字的权重
- 方便其他设备解析(如屏幕阅读器、盲人阅读器、移动设备),以有意义的方式来渲染网页
- 便于团队开发和维护。语义化更具可读性,遵循W3C标准的团队都遵循这个标准,可以减少差异化