1、 讲讲 HTML 中的语义化标签

1、是什么：语义化标签是一种写 HTML 标签的方法论/方式。

2、怎么做：实现方法是遇到标题就用 h1 到 h6，遇到段落用 p，遇到文章用 article，主要内容用 main，边栏用 aside，导航用 nav……（就是找到中文对应的英文）

3、解决了什么问题：明确了 HTML 的书写规范

4、优点是：一、适合搜索引擎检索；二、适合人类阅读，利于团队维护。缺点是：没有。怎么解决

5、缺点：无需解决。

6、总结：「是什么、怎么做、解决了什么问题、优点是、缺点是、怎么解决缺点」

要点1：举例阐述我平时写代码用的就是HTML语义化的标签，比如标题用h1-h6，段落用p，文章用artical，画板用canvas，章节用section，时间用time等等。我认为HTML语义化就是使用语义恰当的标签写HTML，它可以让整个页面具有良好的结构，可以让开发人员快读理解网页的内容。

要点2：深入分析为什么要HTML语义化HTML语义化是存在历史周期的，一开始的荒野阶段没有专业的前端开发，都是由后台写HTML的，大部分用table标签，一个table套另一个table，让代码不好维护。后来美工阶段开始用div,span和css写页面，在其上加class区分。这样虽然没什么问题，但是不够语义化。（这个div代表什么，这个div和那个div之间是什么联系，都不清楚）。现在我们进入前端阶段，我们更专业的做法就是使用语义化的标签，用正确的标签写正确的内容做正确的事。

2、 HTML 5 有哪些新标签？

文章相关：header main footer nav section article figure mark

多媒体相关：video audio svg canvas

表单相关：type=email type=tel

3、Canvas 和 SVG 的区别是什么？

1、Canvas 主要是用笔刷来绘制 2D 图形的。

2、SVG 主要是用标签来绘制不规则矢量图的。

3、相同点：都是主要用来画 2D 图形的。

4、不同点：Canvas 画的是位图，SVG 画的是矢量图。

5、不同点：SVG 节点过多时渲染慢，Canvas 性能更好一点，但写起来更复杂。

6、不同点：SVG 支持分层和事件，Canvas 不支持，但是可以用库实现。

4、H5 是什么？

HTML5是第五代HTML的标准。H5并不是HTML5！H5是指移动端页面。就像一个很大的容器，里面可以放文本、图片、音视频等基本的流媒体格式的文件。常见的应用比如微信H5，我们在微信朋友圈看到一些酷炫的小视频，节日贺卡，微信小游戏等。包含了HTML5新增的一些功能标签，canvas,audio，拖拽特性，本地存储，同时包括盒模型，绝对定位等所有前端的知识。