HTML语——div span 和语义化标签的pk，你常用的是什么？
我比较常用div和span标签布局，一切皆可行。
当然语义类标签也有它们自己无可替代的优点
- 语义类标签对开发者更为友好，使用语义类标签增强了可读性，即便是在没有 CSS 的时候，开发者也能够清晰地看出网页的结构，也更为便于团队的开发和维护。
- 除了对人类友好之外，语义类标签也十分适宜机器阅读。它的文字表现力丰富，更适合搜索引擎检索（SEO），也可以让搜索引擎爬虫更好地获取到更多有效信息，有效提升网页的搜索量，并且语义类还可以支持读屏软件，根据文章可以自动生成目录等等。
对于语义标签：
“用对”比“不用”好，“不用”比“用错”好。当然了，我觉得有理想的前端工程师还是应该去追求“用对”它们
作为自然语言延伸的语义类标签 例如：em标签
作为标题摘要的语义类标签
<hgroup>
<h1>JavaScript对象</h1>
<h2>我们需要模拟类吗？</h2>
</hgroup>
<p>balah balah</p>
......HTML5之后<section><h1>HTML语义</h1><p>balah balah balah balah</p><section><h1>弱语义</h1><p>balah balah</p></section><section><h1>结构性元素</h1><p>balah balah</p> </section>
......
</section>作为整体结构的语义类标签 便于浏览器的阅读视图功能
<body><header><nav>……</nav></header><aside><nav>……</nav></aside><section>……</section><section>……</section><section>……</section><footer><address>……</address></footer>
</body>
<body><header>……</header><article><header>……</header><section>……</section><section>……</section><section>……</section><footer>……</footer></article><article>……</article><article>……</article><footer><address></address></footer>
</body>header，如其名，通常出现在前部，表示导航或者介绍性的内容。
footer，通常出现在尾部，包含一些作者信息、相关链接、版权信息等。
header 和 footer 一般都是放在 article 或者 body 的直接子元素，但是标准中并没有明确规定，footer 也可以和 aside，nav，section 相关联（header 不存在关联问题）。
aside 表示跟文章主体不那么相关的部分，它可能包含导航、广告等工具性质的内容。
aside 很容易被理解为侧边栏，实际上二者是包含关系，侧边栏是 aside，aside 不一定是侧边栏。aside 和 header 中都可能出现导航（nav 标签），二者的区别是，header 中的导航多数是到文章自己的目录，而 aside 中的导航多数是到关联页面或者是整站地图。
总结：div和span标签有他们的好处，但在现在手机使用比较便利的情况下，看文章、新闻、小说等等，更需要支持阅读视图功能，所以语义化标签有它的好处存在。
此文章为3月Day24学习笔记，内容来源于极客时间《重学前端》，推荐该课程。
