话不多说，开门见山。想了解html语义化的伙伴，首先需要对html有基础的认识，那么什么是html呢？html是超文本标记语言，它的设计初衷是为了让网页开发更加简单和易于维护，所以html的任务就是定义网页的基本结构和内容。有点类似于建模的骨架，人体的骨架等。
一、什么是html语义化？
官方解释：html语义化是指用合理的html标记以及其特有的属性去格式化文档内容。
通俗的讲：就是用合理、正确的标签来展示内容。（标签指一种标记方式，如<title>，表示标题信息；也可以理解为人体骨架的某一块骨头，专属名称叫什么）。
二、为什么需要语义化？
1）易读，易书写，易理解（多数情况，标签英文翻译的含义就是其功能含义）；
2）利于SEO搜索：语义化可以和搜索引擎建立良好的联系，有利于爬虫抓取有效信息；因为爬虫依赖于语义化标签来确定上下文和各个关键字的权重。
3）易于跨设备解析，进而完成渲染网页（如屏幕阅读器、盲人阅读器、移动设备）；
4）利于规范化：方便团队开发和维护，也遵循W3C规范。
三、语义化的基本标签？
使用这些常见标签，即可构建没有css的页面。
1）语义结构标签
2）基本标签
<title>：页面主体内容。
<hn>：h1~h6，分级标题，<h1> 与 <title> 协调有利于搜索引擎优化。
<ul>：无序列表。
<li>：有序列表。
<main>：页面主要内容，一个页面只能使用一次。如果是web应用，则包围其主要功能。
<small>：呈现小号字体效果，指定细则，输入免责声明、注解、署名、版权。
<strong>：和 em 标签一样，用于强调文本，但它强调的程度更强一些。
<em>：将其中的文本表示为强调的内容，表现为斜体。
<mark>：使用黄色突出显示部分文本。
<figcaption>：定义 figure 元素的标题，应该被置于 figure 元素的第一个或最后一个子元素的位置。
<cite>：表示所包含的文本对某个参考文献的引用，比如书籍或者杂志的标题。
<blockquoto>：定义块引用，块引用拥有它们自己的空间。
<q>：短的引述（跨浏览器问题，尽量避免使用）。
<time>：datetime属性遵循特定格式，如果忽略此属性，文本内容必须是合法的日期或者时间格式。
<abbr>：简称或缩写。
<dfn>：定义术语元素，与定义必须紧挨着，可以在描述列表dl元素中使用。
<address>：作者、相关人士或组织的联系信息（电子邮件地址、指向联系信息页的链接）。
<del>：移除的内容。
<ins>：添加的内容。
<code>：标记代码。
<meter>：定义已知范围或分数值内的标量测量。（Internet Explorer 不支持 meter 标签）
<progress>：定义运行中的进度（进程）。
四、编写代码过程中应注意些什么？
编写代码应尽量使用语义化标签（虽然实际不是）；
1）内联标签之间的空格，内联元素会去掉头部和尾部的空白字符；
2）body标签默认的margin边框，如margin: 0；
3）尽可能少的使用没有语义的div和span元素。
4）在对语义要求不明显时，技能使用div也能使用p,那就使用p，以为p默认有上下边距，可以兼容特殊终端。
5）不要使用纯样式标签，如：b、font、u等，改用css设置。
6）需要强调的文本，可以包含在strong或者em标签中（浏览器预设样式，能用CSS指定就不用他们），strong默认样式是加粗（不要用b，因为没语义），em是斜体（不用i同b）。
7）使用表格时，标题要用caption，表头用thead，主体部分用tbody包围，尾部用tfoot包围。表头和一般单元格要区分开，表头标题用th，内容单元格用td。
五、html5新增了哪些语义化标签？
1）结构化标签：
<header>：头部标签 ；<nav>：导航标签 ；<article>：内容标签 ；<section>：定义文档某个区域； <aside>：侧边栏标签 ；<footer>：尾部标签；
2）多媒体标签：
*音频标签：audio； <video src="文件地址" controls="controls"></video>
*视频标签：video；<video src="文件地址" controls="controls"></video>
