1.html语义化（对语义化标签的理解）
好处：
- 对个人来讲，使用语义化能让自己的思路、代码结构更清晰
- 对团队来讲，别人维护和二次开发你的代码会更容易
- 对公司经营来讲，代码结构化很清晰、语义化很强的网站在搜索迎引擎当中被蜘蛛爬虫收到的几率更高，算是seo优化的一部分。
- 对用户来讲，语义化好的标签即使代码没有css也能呈现出良好的结构
行动：
- 少使用或者不适用div和span标签
- 用p标签代替div标签
- 强调文本放在strong或者em标签中，不要用b和i标签
- 使用table时，标题要用caption，表头要用thread，主体部分用tbody包围，尾部用tfoot包围
- 表头用 th，单元格用 td。表单域用filedset包裹，用lengend标签说明表单的用途。input标签通过id属性或for属性与label标签关联。html 语义化，css 类名也要语义化。等等
2.文档声明的作用？
声明作用：告知浏览器当前文档的类型，以html的哪个版本进行编写指令
声明位置：在html根标签之前进行声明，以保证浏览器第一时间去获取网页的文档模式，进而进行解析渲染页面
不声明or声明错误：文档将会使用混杂模式进行解析渲染呈现
什么是混杂模式什么是标准模式：
- 混杂模式：降低标准兼容旧网页，模拟老旧的浏览器保证站点能正常显示
触发方式：
- 省略文档开头的 doctype 声明
- doctype 声明 不正确，也会导致HTML和XHTML文档以混杂模式呈现
- 标准模式：按照w3c最新标准解析渲染
触发方式：
// HTML 4.01 Strict:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
// XHTML 1.0 Strict:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
// HTML5:
<!DOCTYPE html>
3.meta标签
标签永远位于 head 元素内部
<meta charset='xxx'>：告诉浏览器页面的代码是用的xxx编码方式
http-equiv属性：
1.<meta http-equiv=”Set-Cookie” content=”cookievalue=xxx; expires=Friday,12-Jan-2001 18:18:18 GMT; path=/”>:如果网页过期，那么存盘的cookie将被删除。必须使用GMT的时间格式。
2.<meta http-equiv='expires' content='时间' >：用于设定网页的到期时间。一旦网页过期，必须到服务器上重新传输。
3.<meta http-equiv=”Refresh” content=”5;URL”>：告诉浏览器在【数字】秒后跳转到【一个网址】
4.<meta http-equiv=”content-Type” content=”text/html; charset=utf-8″>：设定页面使用的字符集。
<meta charset=”utf-8″>：在HTML5中设定字符集的简写写法。
5.<meta http-equiv=”Pragma” content=”no-cache”>：禁止浏览器从本地计算机的缓存中访问页面内容。访问者将无法脱机浏览。
6.<meta http-equiv=”Window-target” content=”_top”>：用来防止别人在iframe(框架)里调用自己的页面，这也算是一个非常实用的属性。
7.<meta http-equiv='X-UA-Compatible' content='IE=edge,chrome=1'> :强制浏览器按照特定的版本标准进行渲染。但不支持IE7及以下版本。如果是ie浏览器就用最新的ie渲染，如果是双核浏览器就用chrome内核。
name属性：
1.<meta name=”viewport” content=”width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no”>：在移动设备浏览器上，禁用缩放（zooming）功能，用户只能滚动屏幕。
2.<meta name=”description” content=””>：告诉搜索引擎，当前页面的主要内容是xxx。
3.<meta name=”keywords” content=””>：告诉搜索引擎，当前页面的关键字。
4.<meta name=”author” content=””>：告诉搜索引擎，标注网站作者是谁。
5.<meta name=”copyright” content=””>：标注网站的版权信息。
4.html5的新特性
相较于html4，多了十个新特性。但其不支持ie8及ie8以下版本的浏览器
很全面：https://www.cnblogs.com/jane-panyiyun/p/13092297.html
就不再抄袭过来了。
5.src和href的区别
定义
href是Hypertext Reference的简写，表示超文本引用，指向网络资源所在位置。
常见场景:
<a href="http://www.baidu.com"></a>
<link type="text/css" rel="stylesheet" href="common.css">
src是source的简写，目的是要把文件下载到html页面中去。
常见场景:
<img src="img/girl.jpg">
<iframe src="top.html">
<script src="show.js">
作用结果
- href 用于在当前文档和引用资源之间确立联系
- src 用于替换当前内容
浏览器解析方式
- 当浏览器遇到href会并行下载资源并且不会停止对当前文档的处理。(同时也是为什么建议使用 link 方式加载 CSS，而不是使用 @import 方式)
- 当浏览器解析到src ，会暂停其他资源的下载和处理，直到将该资源加载或执行完毕。(这也是script标签为什么放在底部而不是头部的原因)
6.行内元素、块级元素的区别
一般情况下，行内元素只能包含数据和其他行内元素。 而块级元素可以包含行内元素和其他块级元素。 这种结构上的包含继承区别可以使块级元素创建比行内元素更”大型“的结构。 默认情况下，行内元素不会以新行开始，而块级元素会新起一行
7.常用的图片格式和应用场景
png
优点：PNG格式图片是无损压缩的图片，能在保证最不失真的情况下尽可能压缩图像文件的大小；图片质量高；色彩表现好；支持透明效果；提供锋利的线条和边缘，所以做出的logo等小图标效果会更好；更好地展示文字、颜色相近的图片。
缺点：占内存大,会导致网页加载速度慢；对于需要高保真的较复杂的图像，PNG虽然能无损压缩，但图片文件较大，不适合应用在Web页面上。
适用场景：主要用于小图标或颜色简单对比强烈
其他的详见链接：https://blog.csdn.net/i_dont_know_a/article/details/82491960
8.常见的浏览器内核
浏览器内核也可以理解为排版引擎，主要由2部分组成，渲染引擎和 JS 引擎。排版引擎主要是负责获取网页内容（HTML、XML、图像、CSS、JS）等信息进行解析、渲染网页，将网页的代码转换为看得到的页面
浏览器的内核的不同对于网页的语法解释会有不同，所以渲染的效果也不相同，常见的内核有Trident、 Gecko、 Webkit、 Presto、 Blink五种
Trident
代表作品是IE，俗称IE内核；使用IE内核的浏览器包括、傲游、世界之窗、百度浏览器、兼容模式的浏览器等
WebKit内核
代表作品是Safari、旧版的Chrome
Presto内核
代表作品是Opera，Presto是由Opera Software开发的浏览器排版引擎，它是世界公认最快的渲染速度的引擎。在13年之后，Opera宣布加入谷歌阵营，弃用了 Presto
Blink内核
代表作品是Chrome、Opera；由Google和Opera Software开发的浏览器排版引擎
Gecko内核
代表作品是Firefox，俗称Firefox内核
Chromium内核
这个比较特殊，Chromium是谷歌的开源项目是一款浏览器，Chrome 是Chromium的稳定版。国内的大部分双核浏览器都采用Chromium内核
9.script中defer和async的区别
Async是在外部JS加载完成后，浏览器空闲时，Load事件触发前执行；而Defer是在JS加载完成后，整个文档解析完成后执行。 Defer更像是将
10.link和@import导入样式的区别？
区别 link是XHTML标签,它不仅可以引入css文件，还可以引入网站图标或者设置媒体查询。 @import是CSS提供的语法规则，只能用来加载css。 @import一定要写在除@charset外的其他任何CSS 规则之前，如果置于其它位置将会被浏览器忽略
11.需要注意哪些seo？
- 合理的title、description、keywords：搜索对着三项的权重逐个减小，title值强调重点即可，重要关键词出现不要超过2次，而且要靠前，不同页面title要有所不同；description把页面内容高度概括，长度合适，不可过分堆砌关键词，不同页面description有所不同；keywords列举出重要关键词即可
- 语义化的HTML标签，符合W3C规范：语义化代码让搜索引擎容易理解网页
- 重要内容HTML代码放在最前：搜索引擎抓取HTML顺序是从上到下，有的搜索引擎对抓取长度有限制，保证重要内容一定会被抓取
- 重要内容不要用js输出：爬虫不会执行js获取内容
- 少用iframe：搜索引擎不会抓取iframe中的内容
- 非装饰性图片必须加 alt
- 提高网站速度：网站速度是搜索引擎排序的一个重要指标
参考文章：
https://zhuanlan.zhihu.com/p/91960069
https://zhuanlan.zhihu.com/p/133446654
