MIP快速搭建移动页面-海瑶SEO研究中心

在读这篇文章之前，请确定你曾经理解MIP界说及减速道理。假如不确定的话，可以到MIP官网理解。文章内容来自MIP博客。

革新后期预备和留意事项:

你可以选择直接将原先的挪动站点直接改成MIP站，也可以独自再做一套MIP站点与挪动站并存。

复杂的页面暂不建议MIP革新，当前对资讯、图文类支撑已较好，若功用较为复杂的建议自界说组件或等候MIP项目小组开辟。

革新需具有必然的html常识，革新MIP教程请依照教程来，特殊留意巨细写，建议全局小写。

我们从一个html页面的上下递次一步步革新，只需依照本文章内的一步步来，即可完成MIP革新。

1. Doctype革新

1.1 翻开你的模板或代码文件看第一行，将改为

2. 标签革新

2.1 完成第一步后，持续修正下一行代码，将： 或： 改成：留意悉数小写

3. Head局部革新

3.1 标签必需是完全小写。

3.2 页面的编码必需是utf-8，修正声明为：

3.3 页面中参加

3.4 页面中参加MIP公用款式文件< link rel="stylesheet" type="text/css" href="https://mipcache.bdstatic.com/static/v1/mip.css" >

3.5 这里需求通知检索引擎改页面临应的规范html页面地址，假如存在则标识 个中href值修正成为与现在mip页面绝对应的规范页面(挪动页)url地址。假如只要mip页面没有绝对应的规范页面则标识为： 个中的href值为现在页面地址。具体阐明

4. Body内革新

4.1 起首标签必需是小写的;

4.2 交换,

什么是百度MIP 它的引入对网页有什么好处？

导语：运用Baidu站长平台的小同伴应该留意到了，比来该平台新添加了一个MIP引入用具，许多站长不太清晰什么是MIP，引入Baidumip对页面有什么益处，上面亿恩科技小编为我们引见一下BaiduMIP怎样用。

起首我们先来看一下什么是MIP

MIP 全称 Mobile Instant Page，既挪动网页减速器,是一套使用于挪动网页的开放性手艺规范。MIP经过供应MIP-HTML标准、MIP-JS运转情况以及MIP-Cache页面缓存零碎，完成挪动网页减速。

MIP的次要构成

(1)MIP HTML

MIP HTML 基于HTML中的根底标签制订了全新的标准，经过对一局部根底标签的运用限制或功用扩展，使HTML可以展示愈加丰厚的内容;

(2)MIP JS

MIP JS 可以包管 MIP HTML 页面的疾速衬着;

(3)MIP Cache

MIP Cache 用于完成MIP页面的高速缓存，从而进一步进步页面功能。

引入BaiduMIP有哪些益处

从MIP的界说中我们就不好看出，MIP引入可以更好的完成挪动页面的减速。

假如我们还不太邃晓BaiduMIP是什么，我们可以给我们举一个例子，就是如今我们比拟存眷的奥运会，可以在手机Baidu里搜一下这个词，出来的成果就是援用BaiduMIP的一个结果。

MIP页规范详解之 canonical标签

MIP的标准要求必需添增强制性标签canonical，否则MIP校验用具会报错：

强迫性标签 缺掉或错误

这个标签怎样写烦忙又是干什么用的呢烦忙MIP博客给你分享攻略：

复杂来说，canonical标签用于联系关系原页面和MIP页，包管MIP页承继原页面权重，在挪动检索时优先展示MIP页。Canonical标签是MIP页衔接外界的主要桥梁，不写或写错会招致MIP页不可以和原页面发生联络，招致权重丧失，MIP页不展示。

1. “原页面”是哪个页面

原页面是绝对于MIP页来讲的，假如在m.a.com/1.html的根底上，mip革新后失掉mip.a.com/1.html，那么m.a.com/1.html就是mip.a.com/1.html的原页面。

2. 标签准确写法

Canonical标签添加在MIP页的标签中，href指向原页面地址。

如：mip.a.com/1.html页面(MIP页)的准确写法为：

href指向准绳：href指向Baidu挪动检索导流最多的页面。

分歧状况下的href指向：

假如异样的内容既存在对应的pc页，也存在挪动页，那么href指向Baidu挪动检索流量年夜的页面。

假如是静态页面，原页面 曾经存在canonical标签，则href指向与原页面指向分歧。

假如 原页面 有多个版式，href指向流量最年夜的页面。

假如没有对应的原页面url(如新建自力MIP站（seo8.org），则href指向MIP页自身。

假如直接在现在url停止MIP革新并直接失效，则href指向MIP页自身。

3. 用途：联系关系原页面 承继页面权重 优先显示MIP页

在爬虫抓取MIP页后，会依据个中的canonical标签失掉现在MIP页和原页面的关系，在挪动端需求展示原页面时，优先展示体验更好、速度更快的MIP页。

一个相似的例子是在站长平台上提交挪动端适配。在提交适配划定规矩“m.a.com/1.html对应www.a.com/1.html”后，在挪动端m.a.com/1.html会承继www.a.com/1.html的权重，优先展示m.a.com/1.html。

3. 增补阐明：

MIP页面和原始页面的主体内容应该年夜致相反。假如内容相差较年夜，被假如检索引擎断定主体内容纷歧致的话，会以为canonical标签有效。

原网页与MIP页的url的对应关系尽量复杂、直接(文档阐明)。简明直接的对应关系有利于检索引擎剖析mip页与原网页的关系，放慢MIP页被收录和展示的速度。

汗青上，MIP曾运用“standardhtml”来链接MIP页和原页面，这个标签曾经被“canonical”替代，新提交的mip页不再需求写“standardhtml”了。

QCon全球软件手艺年夜会，是全球顶级的互联网手艺交流年夜会，也是全世界各旅程序猿、攻城狮的群集年夜会。往年的Qcon上海年夜会于10月20-22日在上海宝华万豪酒店举行。每一期Qcon年夜会都是高手云集，讲师中藏龙卧虎，主题演讲干货甚多。但关于我来说，最存眷的一定照样年夜会中Web前端有关的议程。

本届年夜会共有 “前端手艺理论” 和 “年夜规模前端零碎” 两个前端专题。明天上午，Baidu检索资深工程师沈洲在 “年夜规模前端零碎”专题中做了名为《挪动页面减速框架的探究与理论》的主题演讲，个中，提到就了一种开源新手艺 —— MIP。

MIP究竟是什么烦忙可以Web前端开辟带来哪些转变烦忙上面我将为我们引见一下：

从BaiduMIP的官方材料，我们可以查阅到：

MIP (Mobile Instant Pages - 挪动网页减速器), 是一套使用于挪动网页的开放性手艺规范。经过供应MIP-HTML标准、MIP-JS运转情况以及MIP-Cache页面缓存零碎，完成挪动网页减速。

MIP次要由三局部组织成：

· MIP HTML

· MIP JS

· MIP Cache

MIP HTML 基于HTML中的根底标签制订了全新的标准，经过对一局部根底标签的运用限制或功用扩展，使HTML可以展示愈加丰厚的内容;MIP JS 可以包管 MIP HTML 页面的疾速衬着;MIP Cache 用于完成MIP页面的高速缓存，从而进一步进步页面功能。

由此我们可以看到，MIP是一种开源手艺规范，用来提拔H5页面的速度体验。做为Web前端工程师，速度应该是我们最存眷的根底体验之一，沈洲的演讲中也供应了有关的数据：

•Facebook 每添加500ms -3% 的阅读量

•Amazon 每添加100ms -1% 的成单量

•Google 每添加500ms -25% 的检索量

•Baidu在1.5s内每添加500ms -3% 的用户点击

这些数据都阐明，提拔速度关于流量、用户、订单量都有十分年夜的提拔。那么Baidu发布的MIP，是若何提拔挪动H5页面的速度呢烦忙我们发现，MIP中的MIP-Cache和CDN相似，但MIP还减速不只仅于此。

页面衬着耗时次要分为以下三类：DNS解析耗时，网络传输耗时，阅读器衬着重绘耗时。 MIP减速的根本道理就是增加各个步调的耗时：

为增加DNS解析，MIP-Cache将静态文件以绝对途径贮存在BaiduCDN中;

为增加网络传输耗时，MIP-JS 节制静态资本的按需加载，MIP-Cache零碎优先从CDN读取文件;

为增加阅读器衬着重绘耗时，MIP-HTML 对,

MIP-HTML 标准中有两类标签，一类是HTML惯例标签，另一类是MIP标签(MIP-HTML 组件)。

在MIP标准中，相似等会惹起阅读重视绘的标签应被交换成, 应用懒加载和按需加载进步页面的衬着速度。

MIP-HTML除了对阅读器原生标签的封装，还有一类自界说交互组件。比方图片轮播组件，表单组件，分享组件等。这些组件依靠MIP-JS和本身剧本即可运转，不需求援用第三方库。援用MIP自界说组件的而益处在于，页面开辟时无需引入jquery，bootstrap等体积重大的库，增加页面发送的网络恳求及传输时刻，放慢网页的传输和衬着。

MIP-JS是MIP的运转情况，接收了MIP页的生命周期，剧本加载及页面衬着。

详细来说，MIP-JS包孕根底类引入(AMD)，内置组件加载(mip-img)，外置组件治理(组件css拔出)以及组件规划治理(处理规划兼容性成绩)。

MIP-JS选择运用精简的根底类，尽量增加网络传输时刻;内置优异的组件，在不壅塞阅读器衬着的前提下供应最好的交互体验;供应组件规划治理，事后为组件设定宽高，防止组件加载后的阅读重视规划。

MIP-Cache 经过CDN(Content Delivery Network)效劳器缓存静态MIP页面。

当用户拜访MIP页面时，恳求起首会发到CDN效劳器，假如页面存在，则从CDN直接前往静态页面;假如页面不存在，则会恳求第三方效劳器。前往的页面的同时参加MIP-Cache。

在运用MIP Cache时，MIP页面援用的一切静态文件和内部资本都邑被交换成绝对地址，缓存到CDN上。尽能够增加了DNS解析时刻和网络恳求时刻。

总的来说，MIP除了CDN减速，还针对阅读器衬着和网络加载做了优化。

讲师沈洲还在演讲中泄漏，经过MIP革新网站的数据标明：页面加载速度提拔了30-80%，抵达率提拔了5%-40%。

更快的翻开速度意味着更少的用户等候和保持，更好的用户体验。

那么，你的站点预备好改MIP了吗烦忙

来源：海瑶SEO研究中心（seo.cao4.net/forum-44-1.html） 微信号：seocnn