元素可提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词。 标签位于文档的头部，不包含任何内容。 标签的属性定义了与文档相关联的名称/值对。
定义
<meta> 元素可提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词。
<meta> 标签位于文档的头部，不包含任何内容。<meta> 标签的属性定义了与文档相关联的名称/值对。
meta是html语言head区的一个辅助性标签。几乎所有的网页里，我们可以看到类似下面这段的html代码：
<head>
<meta http-equiv="content-Type" content="text/html; charset=gb2312" />
</head>
也许你认为这些代码可有可无。其实如果你能够用好meta标签，会给你带来意想不到的效果，例如加入关键字会自动被大型搜索网站自动搜集；可以设定页面格式及刷新等等。
组成
meta标签共有两个属性，它们分别是http-equiv属性和name属性，不同的属性又有不同的参数值，这些不同的参数值就实现了不同的网页功能。
name属性
name属性主要用于描述网页，与之对应的属性值为content，content中的内容主要是便于搜索引擎机器人查找信息和分类信息用的。
meta标签的name属性语法格式是：<meta name="参数" content="具体的参数值">；。
其中name属性主要有以下几种参数：
A、Keywords（关键字）
说明：keywords用来告诉搜索引擎你网页的关键字是什么。
举例：<meta name ="keywords" content="science,education,culture,politics,ecnomics,relationships,entertainment,human">
B、description（网站内容描述）
说明：description用来告诉搜索引擎你的网站主要内容。
网站内容描述（description）的设计要点：
①网页描述为自然语言而不是罗列关键词（与keywords设计正好相反）；
②尽可能准确地描述网页的核心内容，通常为网页内容的摘要信息，也就是希望搜索引擎在检索结果中展示的摘要信息；
③网页描述中含有有效关键词；
④网页描述内容与网页标题内容有高度相关性；
⑤网页描述内容与网页主体内容有高度相关性；
⑥网页描述的文字不必太多，一般不超过搜索引擎检索结果摘要信息的多字数（通常在100中文字之内，不同搜索引擎略有差异）。
举例：<meta name="description" content="This page is about the meaning of science,education,culture.">
C、robots（机器人向导）
说明：robots用来告诉搜索机器人哪些页面需要索引，哪些页面不需要索引。
content的参数有all,none,index,noindex,follow,nofollow。默认是all。
举例：<meta name="robots" content="none">
D、author（作者）
说明：标注网页的作者
http-equiv属性
http-equiv顾名思义，相当于http的文件头作用，它可以向浏览器传回一些有用的信息，以帮助正确和地显示网页内容，与之对应的属性值为content，content中的内容其实就是各个参数的变量值。
meta标签的http-equiv属性语法格式是：<meta http-equiv="参数" content="参数变量值"> ；其中http-equiv属性主要有以下几种参数：
A、Expires（期限）
说明：可以用于设定网页的到期时间。一旦网页过期，必须到服务器上重新传输。
用法：<meta http-equiv="expires" content="Fri,12 Jan 2001 18:18:18 GMT">
注意：必须使用GMT的时间格式。
B、Pragma(cache模式）
说明：禁止浏览器从本地计算机的缓存中访问页面内容。
用法：<meta http-equiv="Pragma" content="no-cache">
注意：这样设定，访问者将无法脱机浏览。
C、Refresh（刷新）
说明：自动刷新并指向新页面。
用法：<meta http-equiv="Refresh" content="2;URL">；（注意后面的引号，分别在秒数的前面和网址的后面）
注意：其中的2是指停留2秒钟后自动刷新到URL网址。
D、Set-Cookie(cookie设定）
说明：如果网页过期，那么存盘的cookie将被删除。
用法：<meta http-equiv="Set-Cookie" content="cookievalue=xxx; expires=Friday,12-Jan-2001 18:18:18 GMT; path=/">
注意：必须使用GMT的时间格式。
E、Window-target（显示窗口的设定）
说明：强制页面在当前窗口以独立页面显示。
用法：<meta http-equiv="Window-target" content="_top">
注意：用来防止别人在框架里调用自己的页面。
F、content-Type（显示字符集的设定）
说明：设定页面使用的字符集。
用法：<meta http-equiv="content-Type" content="text/html; charset=gb2312">
G、content-Language（显示语言的设定）
用法：<meta http-equiv="Content-Language" content="zh-cn" />
功能
上面我们介绍了meta标签的一些基本组成，接着我们再来一起看看meta标签的常见功能：
帮助主页被各大搜索引擎登录
meta标签的一个很重要的功能就是设置关键字，来帮助你的主页被各大搜索引擎登录，提高网站的访问量。在这个功能中，重要的就是对Keywords和description的设置。因为按照搜索引擎的工作原理，搜索引擎首先派出机器人自动检索页面中的keywords和description，并将其加入到自己的数据库，然后再根据关键词的密度将网站排序。因此，我们必须设置好关键字，来提高页面的搜索点击率。下面我们来举一个例子供大家参考：<meta name="keywords" content="政治，经济，科技，文化，卫生，情感，心灵，娱乐，生活，社会，企业，交通">
<meta name="description" content="政治，经济，科技，文化，卫生，情感，心灵，娱乐，生活，社会，企业，交通">
设置好这些关键字后，搜索引擎将会自动把这些关键字添加到数据库中，并根据这些关键字的密度来进行合适的排序。
定义页面的使用语言
这是meta标签常见的功能，在制作网页时，我们在纯HTML代码下都会看到它，它起的作用是定义你网页的语言，当浏览者访问你的网页时，浏览器会自动识别并设置网页中的语言，如果你网页设置的是GB码，而浏览者没有安装GB码，这时网页只会呈现浏览者所设置的浏览器默认语言。同样的，如果该网页是英语，那么charset=en。下面就是一个具有代表性的例子：
<meta http-equiv=″content－Type″ content=″text/html; charset=gb2312″>
该代码就表示将网页的语言设置成国标码。
自动刷新并指向新的页面
如果你想使您的网页在无人控制的情况下，能自动在指定的时间内去访问指定的网页，就可以使用meta标签的自动刷新网页的功能。下面我们来看一段代码：
〈meta http-equiv=″refresh″ content=″2; URL=
这段代码可以使当前某一个网页在2秒后自动转到页面中去，这就是meta的刷新作用，在content中，2代表设置的时间（单位为秒），而URL就是在指定的时间后自动连接的网页地址。
下面主要介绍(TKD)title keywords description
言归正传，什么是网站标题（Title）
网站的标题在代码中是Title tag。我们在浏览一个网站的时候，经常会在浏览器顶端的蓝色显示条看到的信息就是“网站标题”。而在HTML代码中，网站标题位于“头部文件中”，在标签之间。举一个简单的例子：SEO教程。其中，“SEO教程”就是这个网站的标题。
（一）title标签的重要性
1.title标签是参与匹配排名为重要的要素；
2.title标签的写法有两个极端：
a.只写网站名或者品牌名以及广告语——有利于树立品牌形象，但不利于关键词的优化，常见于知名网站、门户网站以及一些新站，不做SEO的网站：
b.只写关键词，目标关键词——有利于关键词匹配，但是不利于树立品牌，一定程度损害了用户体验
c.绝大多数网站title介于两个极端之间。
（二）首页title写法原则
1.一般而言，首页title应该采用网站名称与关键词的组合方式；
2.根据网站自身的情况确定网站名称与关键词的组合方式，网站品名+关键词，关键词+网站品名；
3.title所包含的关键词热度越高越好，总指数不应太低；
4.根据团队实力，网站权重决定关键词的竞争度；
5.长不超过30个汉字，且越短越好；
6.重要关键词放在开头的靠前位置；
7.一般建议用英文“，”号，下划线“_"做分隔符，也可以用“|”。（有排名的关键词，一定在标题里）
（三）写法
1.营销网站：产品关键词及其长尾词（2—3个）+网站品名（或者品名关键词组合）：
a.适合中小企业网站的优化；
b.前期可以全部使用长尾词；
c.随着网站权重的提高，可以做热度，竞争度的词；
d.营销站无特殊原因，一般应维持这种状态；
2. 信息类，门户类，资源共享类等流量型网站；
前期：长尾词（2-3个）+网站品名；
中期:核心关键词（高竞争度）、长尾词（2-3个）+网站品名；
后期：网站品名+核心关键词、长尾词（2-3个）；
（四）其他注意事项
1.一般title是一组词组成的，而不是句子。出关键词，网站品名之外的字词都不应该出现。知名站除外。
2.网站品名为企业名或者产品名时应用简称；
3.title中的长尾词包含较短的关键词时，该较短的关键词一般不再重复：
a.尽可能缩短title长度，
b.有利于增加不同的关键词
（五）首页keyword标签
重要性在于搜索引擎，早期的搜索引擎因为自身的不完善，对mate标签给予的权重比较高，尤其是网站关键词keyword是搜索引擎快速判定网站内容的关键点，所以，早期的网站mate标签大家都比较重视，于是就出现了很多的黑帽SEO的作弊手法，比如：关键词堆砌，页面布局大量的关键词。随着搜索引擎的进一步发展，搜索引擎逐渐开始不单纯的依靠mate标签来判定网站的主题内容，削弱关键词所占的分量。于是就出现了目前的网站关键词keyword不写的局面。
1.按照标题包含的关键词在前，其他目标关键词在后的顺序填写。应将title中的关键词，包括长尾词中的短关键词，全部罗列出；
2.一般而言3-5个为宜，稍微多一些没什么影响；
3.一般建议用英文“,”号做分隔符；
（六）首页description标签（描述）
关键词：
“MIP (Mobile Instant Pages - 移动网页加速器), 是一套应用于移动网页的开放性技术标准。通过提供MIP-HTML规范、MIP-JS运行环境以及MIP-Cache页面缓存系统，实现移动网页加速。”本教程由MIP爱好者合力撰写，由百度工程师确认，会帮助你完整的搭建一个MIP站点。
MIP是什么?
MIP的定义
MIP是Mobile Instant Pages的简称，也就是移动网页加速器，是一套应用于移动网页的开放性技术标准,使用 MIP无需等待加载,页面内容将以更友好的方式瞬时到达用户。其核心价值是提升了移动端渲染能力。
(官网：https://www.mipengine.org/)
MIP诞生的背景
工信部2016年新发布的数据，移动互联网用户1月净增1942.1万户，同比增长11.8%，总数达9.8亿户。随着移动设备的性能不断提升、网络速度大幅提高，用户群体对移动网页等待的耐心在逐渐降低，更多的时候要求移动网页可以瞬间打开。
以往研究数据表明网站打开速度对用户浏览、电商成单量、搜索引擎的搜索量等都有很大影响!
如： Facebook每慢500ms用户浏览下降3%，Amazon每增加100ms成单量下降1%，Google每增500ms搜索量下降25%等等;
这种环境下，我们要考虑的问题，除了网站是否需要移动客户端外，还有如何程度的提高移动网站的用户体验。那么你的移动网页用户体验合格吗?打开的速度够快吗?内容够简洁突出吗?经常出现各种安全问题吗?
万众瞩目下，百度推出了针对提高移动网页打开速度和用户体验的新标准规范，以及解决方案。
MIP提升性能的奥秘
通俗来讲，移动网站按照百度提供的网页标准规则进行修改，修改合格后，百度将你的网站放在百度服务器上面。你的移动网站在修改之后，不仅网页更加简洁规范，而且接入百度服务器之后网页的打开速度将非常之快，并且可以提升安全性能。
MIP之所以可以达到这种效果主要归功于其组成的三部分：
MIP HTML(页面标准主要包含Css、HTML代码、图片)——为了让移动网页更加简洁规范
MIP JS (引用官方标准化JS文件)——提供了网页基础的JS需要
MIP Cache(接入官方缓存服务器)——百度缓存服务器，加速环节重要的部分!
MIP和CDN有什么区别
从MIP性能表现上看，主要是体现在页面加载快，用户体验好等特点，所以很多人产生了疑问，MIP是不是等同于CDN，已经使用CDN还要不要改造成MIP? 接入MIP还要改，那么麻烦，那我直接用CDN多好?
事实上他们还是有比较明显的区别，主要在五个方面：
1、MIP要求站点必须按照 MIP标准进行修改或者重新制作，CDN只会站点提供节点加速服务，无需修改。
2、MIP服务器基本上是在用百度移动端的快照缓存服务器。而CDN提供的节点是无法和百度服务器相媲美的。
3、MIP地址使用是百度缓存服务器域名，可以提升一定安全性，而CDN还是自己的域名;
4、MIP只针对移动页面进行加速，不影响PC端，而CDN则是可以支持不同用户端;
5、MIP一项长久免费的开源计划，而大部分CDN是需要付费使用的。
MIP HTML是为了更加规范移动网页而推出的网页标准，而不是单纯为了接入MIPCache服务器提出的标准。
MIPCache部分确实相当于CDN的功能，但是这个MIPCache百度服务器数量是国内任何一家CDN节点数量上无法去相比的，而且还是免费提供给MIP站点的站长。
百度蜘蛛对于移动站点的抓取，接入MIP Cache的MIP站点更加有优势，因为网页已经早已缓存到百度服务器。而这一点，更是CDN无法相比的。
MIP改造难不难?
通俗讲，MIP的改造，就是一些基础的HTML标签替换成MIP HTML标签，接入百度缓存服务器的过程。
我看到有人在改MIP站点的时候，抱怨，好难，这个功能没有，那个组件没有。其实，MIP的旨意不是让你继续沿用过去网页的标准，而是为了提高网页的打开速度，通过MIP的新标准，去简化规范网页。
所以说，根据MIP HTML标准修改原网站，或者根据MIP HTML新建网站模版，是非常简单的。由于目前是MIP前期，建议大家采取新建MIP站点，并保留原移动站点的模式。
加入MIP的必要性
MIP能做什么
MIP能帮助站长和网站开发者快速搭建移动端页面。
MIP怎么加速?MIP从前端渲染和页面网络传输两方面进行优化，杜绝页面渲染中的阻塞问题，提升页面展现速度。
移动站应该用MIP吗?这里有五个原因，告诉你MIP的好处：
加速移动端页面，一切的基础
为减少DNS解析，MIP-Cache将静态文件以相对路径储存在百度CDN中;为减少网络传输耗时，MIP-JS 控制静态资源的按需加载，MIP-Cache系统优先从CDN读取文件;为减少浏览器渲染重绘耗时，MIP-HTML 对<img>,<video>等造成浏览器重绘的标签进行了封装控制。
根据2016年8月数据，页面MIP化之后，页面展现时间减少了30%-80%。如果您的页面只有简单交互，却引用了庞杂的前端代码库，那么尝试MIP之后速度能够得到显著提升。
速度对于页面意味着什么呢?如果一个页面需要3秒来打开，用户就需要盯着白屏等待三秒，这很容易引起用户的不耐和放弃。也就是说，一个页面能在眨眼之间打开，意味着更少的用户放弃。所以说，对于页面来讲，速度是一切的基础。
提升到达率和用户体验，更少的流失率
正如上文提到，使用MIP规范之后页面的打开速度会大幅提高，减少用户的等待时间，减少用户放弃。
试想一下，当全站的每个页面都能在1秒内打开，用户每次点击都会立马得到相应，那么就会提高用户体验和满意度。如果页面内容有趣，用户就会在各个页面间冲浪(Surf)。在日均UV(Unique Visitor, 独立访客)不变的情况下，页面的PV(Page View)会有所增加。此时，用户消费了更多网页提供服务时，页面广告也会得到更多的曝光。
百度搜索提权，的用户量
众所周知，百度的自然结果是根据用户点击和页面质量排名的。在2015年年底，我们推出了《百度搜索Mobile Friendly标准》(下文简称《MF标准》)，在站长平台的说明中，《MF标准》也会作为页面排序的参考因素。
在《MF标准》中，有页面加载速度体验一项。使用MIP规范，能够加快网页加载速度，使页面标准。
开发简单，迁移成本低
迁移已有页面到MIP并不是一件困难的事情。MIP-HTML组件和JS运行环境与前端代码语法相同，官网文档中有详细的步骤，我们也会陆续推出文字和视频教程。我们还为开发者提供了实时校验工具，帮助MIP用户开发出完全符合规范的页面。
已有组件兼容性好，也可个性化定制新组件
MIP-HTML 拥有不断完善的的组件库可以使用。图片预览，视频播放，分享组件均已上线。直接使用已有组件，能够代码质量和各个终端浏览器的兼容性。利用小快的方式达到交互效果。
除此之外，MIP是一个开源的项目，提供了《扩展组件开发规范》，支持MIP用户自己开发个性化组件，交由MIP开发小组审核后即可上线使用。
如何加入MIP
什么网站适合加入MIP
结合目前MIP官网技术文档和已有案例反馈，MIP已经可以完美支持资讯、图片、企业、小说、论坛等信息流类型的网站。复杂的页面暂不建议MIP改造，目前对资讯、图文类支持已较好，若功能较为复杂的建议自定义组件或等待MIP项目小组开发。
抛开网站类型不谈，存在以下问题的网站更要加入MIP:
1、网站加载速度慢，打开速度时间长
影响网站加载速度的因素除了外在因素(服务器带宽、庞大的数据库)外，绝大多数是网站本身的问题，例如：冗余代码、用了大量js调用，网站图片太大、flash文件等。MIP的规则就是针对MIP-HTML规范、MIP-JS运行环境以及MIP-Cache页面缓存系统进行优化，实现移动网页加速。
2、用户体验差，跳出率较高的网站
网站弹出广告过多、内容质量差、加载速度慢都是影响用户体验差的因素，为了避免这些现象，MIP要求将所有的资源(广告、图片、音频和视频)标明尺寸。当资源真正加载时，所有资源大小可以被立即推断出并迅速用于计算页面布局，加载中的资源将无缝呈现，不必因为页面频繁更新布局而影响到用户的阅读体验。而且MIP提供与MIP runtime兼容的封装好的组件来实现，严格控制外部资源的加载，来确保其高效性，开发者的任何自定义脚本，都需要用MIP的tag反馈给MIP，例如mip-ad、mip-iframe等，这些方式不会阻塞页面的layout和渲染。
MIP改造难不难?
通俗讲，MIP的改造，就是一些基础的HTML标签替换成MIP HTML标签，接入百度缓存服务器的过程。
有人在改MIP站点的时候，抱怨，好难，这个功能没有，那个组件没有。其实，MIP的旨意不是让你继续沿用过去网页的标准，而是为了提高网页的打开速度，通过MIP的新标准，去简化规范网页。
所以说，根据MIP HTML标准修改原网站，或者根据MIP HTML新建网站模版，是非常简单的。由于目前是MIP前期，建议大家采取新建MIP站点，并保留原移动站点的模式。
加入MIP的接入流程
经过前面的内容介绍，相信你已经迫不及待想加入MIP生态了吧。如果你的网站在上述MIP支持的改造范围中，那么只需要4个步骤即可完成MIP网站改造：
(1) 改造评估：
评估自身网站情况是否适合改造MIP，如果支持则要选择一套改造方案;目前主要有两种方式，一是在原页面上进行改造，另外一种是新建一套MIP模板。
原有页面修改方案：主要适用于拥有独立移动站的网站，优点是改造内容少，技术成本低，方便维护等优点 ;
新建MIP页面方案：适用于目前所有网站的情况，具有独立好操作，改造干扰少，未知风险小等特点，美中不足的是因为是新的url，需要蜘蛛从新抓取，接入速度略慢;
(2) 页面改造：
确定改造方案后，，按照MIP官网内容要求进行代码改造。改造需具备一定的html知识，改造MIP教程请按照教程来，特别注意大小写，建议全局小写。如果初次接触MIP，可以先学习下《新手指南》，更详细请参考《如何用MIP的快速搭建移动页面》。
(3) 工具校验：
页面改造完成后，可以通过官方工具进行校验，工具会给出是否合格的提示;点击进入检验地址：https://www.mipengine.org/validator/preview
(4)数据提交：
校验合格后，通过站长平台的MIP工具，以主动推送的方式进行数据提交;
MIP提交地址：http://zhanzhang.baidu.com/mip/index
(5)线上生效：
当MIP数据库收到站点提供的数据，会对数据进行抓取、收录、校验等一系列的步骤，后在线上生效，并且在快照上回有一个
 |  |
MIP快速搭建移动页面通用篇
如何快速完成MIP改造?网站可以选择直接将原先的移动站点直接改成MIP站，也可以单独再做一套MIP站点与移动站并存。
从一个html页面的上下顺序一步步改造，只要按照本文章内的一步步来，即可完成MIP改造。
1. Doctype改造
1.1 打开你的模板或代码文件看行，将<! DOCTYPE ***>改为<!DOCTYPE html>
2. <Html>标签改造
2.1 完成步后，继续修改下一行代码，将： <html xmlns="http://www.w3.org/1999/xhtml">或：<html> 改成：<html mip>注意全部小写
3. Head部分改造
3.1 <head>标签必须是完全小写。
3.2 页面的编码必须是utf-8，修改声明为：<meta charset="utf-8">
3.3 页面中加入<meta name="viewport" content="width=device-width, minimum-scale=1, initial-scale=1">
3.4 页面中加入MIP专用样式文件< link rel="stylesheet" type="text/css" href="https://mipcache.bdstatic.com/static/mipmain-v1.0.1.css" >
3.5 这里需要告诉搜索引擎改页面对应的标准html页面地址，如果存在则标识<link rel="canonical" href="H5/PC原页面"> 其中href值修改成为与当前mip页面相对应的标准页面url地址。如果只有mip页面没有相对应的标准页面则标识为：<link rel="standardhtml" href="MIP自身"> 其中的href值为当前页面地址。
4. Body内改造
4.1 首先<body>标签必须是小写的;
4.2 加入MIP专用JS文件：<script src="https://mipcache.bdstatic.com/static/mipmain-v1.0.2.js"></script>
4.3 替换<img>, <style>, <frame>, <form>,< input>, <textarea>, <select>, <option>标签为对应MIP组件标签，具体见官网文档。
4.4 引用MIP-JS 运行环境 <script src= "https://mipcache.bdstatic.com/static/mipmain-v1.1.0.js"></script>放在页面尾部。
5. 使用MIP Cache注意事项
5.1 一般Cache图片、样式、脚本，做完上述4步后，修改资源地址为相对地址或合法地址(以校验工具为准);
5.2 Cache的内容需要更新需要通过MIP数据提交中的更新数据接口，把更新的url链接推送过去，等待百度更新。
6. 组件的使用
6.1 除了上述这些需求外，一部分站点可能需要用到组件，官网文档包含了目前支持的所有组件，详见《组件概述》。
6.2目前官网开发了很多通用性组件，并提供了使用示例，以百度统计组件为例：在百度统计中申请js统计代码，将其中的token值截取出来,如下图所示字符串：
将字符串以<mip-stats-baidu token="02890d4a309827eb62bc3335b2b28f7f"></mip-stats-baidu>的形式植入到页面中，并在页面中嵌入 <script src="https://mipcache.bdstatic.com/static/v1.1/mip-stats-baidu.js"></script>
以上步骤就可以将百度统计组件植入到MIP页面中了!
6.3特定组件的使用：对于官网没有的组件，网站可以自主开发组件接入，具体方法可以参考《扩展组件开发规范》;
