HTML语义化
语义化的含义就是用正确的标签做正确的事情，html语义化就是让页面的内容结构化，便于对浏览器、搜索引擎解析；在没有样式CSS情况下也以一种文档格式显示，并且是容易阅读。搜索引擎的爬虫依赖于标记来确定上下文和各个关键字的权重，利于SEO。
使阅读源代码的人对网站更容易将网站分块，便于阅读维护理解。
XHTML和HTML有什么区别
HTML是一种基本的WEB网页设计语言，XHTML是一个基于XML的置标语言
最主要的不同：
功能上的差别，主要是XHTML可兼容各大浏览器、手机以及PDA，并且浏览器也能快速正确地编译网页。
在XHTML中，所有的标签都必须小写
XHTML 元素必须被正确地嵌套，标签顺序必须正确
XHTML 元素必须被关闭，标签必须成双成对
所有属性都必须使用双引号
XHTML 文档必须拥有根元素
内核（渲染引擎）
1、Trident内核：代表作品是IE，因IE捆绑在Windows中，此内核只能用于Windows平台，且不是开源的，存在很多的兼容性问题。2、Gecko内核：代表作品是Firefox，即火狐浏览器。因火狐是最多的用户，故常被称为firefox内核它是开源的，最大优势是跨平台，在Microsoft Windows、Linux、MacOs X等主要操作系统中使用。
3、Webkit内核：代表作品是Safari、曾经的Chrome，是开源的项目。
4、Presto内核：代表作品是Opera，Presto是由Opera Software开发的浏览器排版引擎，它是世界公认最快的渲染速度的引擎。
5、Blink内核：由Google和Opera Software开发的浏览器排版引擎，2013年4月发布。现在Chrome内核是Blink。
文档声明的作用
DOCTYPE 是document type（文档类型）的缩写。用来说明文档是什么版本。建立符合标准的网页 DOCTYPE声明是必不可少的。一般放在文档的最顶部。<!DOCTYPE html>一定要在HTML文档的最前面，在<html>标签之前。声明之后表明你的内容使用HTML5。会让不支持html5的浏览器采用标准模式解析。
HTML5 为什么只需要写 !DOCTYPE HTML？
HTML5 不基于 SGML（标准通用标记语言），因此不需要对DTD（文档类型定义）进行引用，但是需要doctype来规范浏览器的行为（让浏览器按照它们应该的方式来运行）；而HTML4.01基于SGML,所以需要对DTD进行引用，才能告知浏览器文档所使用的文档类型。
!DOCTYPE声明位于位于HTML文档中的第一行，处于html 标签之前。告知浏览器的解析器用什么文档标准解析这个文档。DOCTYPE不存在或格式不正确会导致文档以兼容模式呈现。
盒子模型
元素的内容（content），元素的内边距（padding），元素的边框（border），元素的外边距（margin）
元素分类：
行内元素：a、b、span、img、input、strong、select、label、em、button、textarea块级元素：div、ul、li、dl、dt、dd、p、h1-h6、blockquote
空元素：即系没有内容的HTML元素，例如：br、meta、hr、link、input、img
src与href
href 是指向网络资源所在位置，建立和当前元素（锚点）或当前文档（链接）之间的链接，用于超链接。src是指向外部资源的位置，指向的内容将会嵌入到文档中当前标签所在位置；在请求src资源时会将其指向的资源下载并应用到文档内，例如js脚本，img图片和frame等元素。当浏览器解析到该元素时，会暂停其他资源的下载和处理，直到将该资源加载、编译、执行完毕，图片和框架等元素也如此，类似于将所指向资源嵌入当前标签内。这也是为什么将js脚本放在底部而不是头部。
HTML5
新特性1.语意特性,添加<header><header/><nav><nav>等标签
2.多媒体， 用于媒介回放的 video 和 audio 元素
3.图像效果，用于绘画的 canvas 元素，svg元素等
4.离线 & 存储,对本地离线存储的更好的支持,local Store,Cookies等
5.设备兼容特性 ，HTML5提供了前所未有的数据与应用接入开放接口，使外部应用可以直接与浏览器内部的数据直接相连。
6.连接特性，更有效的连接工作效率，使得基于页面的实时聊天，更快速的网页游戏体验，更优化的在线交流得到了实现。HTML5拥有更有效的服务器推送技术，Server-Sent Event和WebSockets就是其中的两个特性，这两个特性能够帮助我们实现服务器将数据“推送”到客户端的功能
7.性能与集成特性，HTML5会通过XMLHttpRequest2等技术，帮助您的Web应用和网站在多样化的环境中更快速的工作
新增标签
1.多媒体：<audio></audio>, <video><video>,<source></source>, <embed></embed>, <track></track>
2.新表单元素：<datalist> ,<output> , <keygen>
3.新文档节段和纲要:<header>页面头部、<section>章节、<aside>边栏、<article>文档内容、<footer>页面底部、<section>章节、<aside>边栏、<article>文档内容、<footer>页面底部等
meta标签
作用：可提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词，用于鉴别作者， 设定页面格式，标注内容提要和关键字，以及刷新页面
<meta>标签有两个属性：name和http-equiv。
name="viewport"，主要是为了适应移动设备。
name="description"，主要是用来告诉搜索引擎，网站的主要内容是什么。
name="keywords"，用来告诉搜索引擎，网站的主题是什么，比如说偏重于前端后端或者是某种编程语言等等。
name="robots"，告诉爬虫哪些页面需要索引，哪些页面不需要索引。提供HTML文档的元数据, 常用于告知浏览器如何显示内容和搜索引擎优化
<meta charset="UTF-8"> //声明文档的编码方式
<meta http-quiv="X-UA-Compatible" content="IE=edge,chrome=1"/> //告知浏览器以什么版本渲染文档
<meta name="renderer" content="webkit|ie-comp|ie-stand"> //告知浏览器选择什么内核渲染
<meta http-quiv="Pragma" content="no-cache"> //禁止浏览器从本地计算机的缓存中访问页面内容。大概就是你访问一个页面后本地会有缓存，此时断网浏览该网站将会无法显示内容。
共有以下几种用法：
no-cache: 先发送请求，与服务器确认该资源是否被更改，如果未被更改，则使用缓存。
no-store: 不允许缓存，每次都要去服务器上，下载完整的响应。（安全措施）
public : 缓存所有响应，但并非必须。因为max-age也可以做到相同效果
private : 只为单个用户缓存，因此不允许任何中继进行缓存。（比如说CDN就不允许缓存private的响应）
maxage : 表示当前请求开始，该响应在多久内能被缓存和重用，而不去服务器重新请求。例如：max-age=60表示响应可以再缓存和重用 60 秒。
<meta http-equiv="Cache-Control" content="no-siteapp"/>
//禁止百度转码。
<meta http-equiv=”Set-Cookie” content=”cookievalue=xxx; expires=Friday,12-Jan-2018 18:18:18 GMT; path=/”> //cookies的有效期。过了这个时间，网页存储在本地的cookies将会被删除。时间格式必须是GMT的时间格式。