MIP动态:新版MIP问题解决方案大全(2017年7月版)发布

作者:MIP开发团队

前言:MIP (Mobile Instant Pages - 移动网页加速器) 主要用于移动端页面加速,使用 MIP无需等待加载,页面内容将以更友好的方式瞬时到达用户。关于MIP的基础知识可以到MIP官网进行了解。为帮助站长和开发者更好地了解MIP,MIP开发团队对大家的疑问进行了整理,帮助大家了解 MIP 的知识。

目录:

一、MIP 认知类问题

二、改造前准备

三、前端改造,组件使用

四、提交生效

五、MIPCache

六、更多学习资源

一、MIP 认知类问题

1.1 MIP 化的收益是什么?具体数据是怎样的?

从目前收集到的数据来看,网站 MIP 化上线后,页面速度提升 30%~80%,页面到达率提升 5%~40%。

1.2 开发 MIP 后,搜索流量是导流到 MIP,还是导流到原页面?

应该导流到 MIP 页面,需要在 MIP 页面中做好和原页面的 对应关系

1.3 MIP 移动网页加速器做了之后是只针对移动百度的展示,还是说也对我们其他的正常用户一样显示?

MIP 页面是可以独立运行的,可以在浏览器中通过 url 直接访问,不依赖百度结果页。由于 MIP 页速度较快,体验更优,会在百度移动结果页有更高的权重。

1.4 搜索结果打开是百度的域名,用户分享的是否也是是百度链接?使用百度域名是否不利于网站的品牌传播同时也会影响流量统计,该如何解决?

答:如果用户通过分享组件分享,则分享的标题,图片和内容都是原页面内容,具体分享内容可以在使用组件时定义。这种做法不会影响品牌传播,也不会影响流量统计。如果用户直接从浏览器复制链接分享,那么被分享的是当前页面 URL (MIP Shell 链接),URL 中是能够反解出原页面 URL 的。统计代码在页面加载完成后都会生效,不会受到分享影响。

1.5 搜索结果打开是百度的域名,是否会影响广告计费?

从搜索结果页点出的MIP页面,其页面上的任何内容(包括但不限于广告、在线咨询、统计等组件)均视为在原站点上的投放和使用。详情请见MIP 内容声明

1.6 如果采取新建一套 MIP 页面的方式,假设新建 MIP 页面出现问题,譬如改造错误、失效或者其他不可预知问题,百度的处理机制是怎样的?

MIP 是有回退机制的,MIP 访问出问题后,会直接回到原来的 H5 页面;不会影响权重,MIP 会更被认可和优先。

1.7 MIP 可以加什么样的广告?

MIP 既可以加入百度联盟广告,也可以加入第三方广告。

1.8 MIP 是否开源?

MIP 核心代码和组件都是开源的,欢迎交流讨论。

核心代码 GitHub :https://github.com/mipengine/mip

MIP 组件 GitHub :https://github.com/mipengine/mip-extensions

1.9 MIP 对什么样的内容有较好的效果?

目前我们对内容浏览类的站点支持比较全面。后续,随着不断丰富的开放组件,MIP 可以支持更多类型的站点。

1.10 站长构建一个 MIP 的成本有多少?

MIP HTML 是基于 HTML 进行的优化。对于新建站点,按照 MIP 规范开发即可,没有额外成本;如果是已有的页面,需要具体看页面生成方式,模板形式的改造一次性成本。

1.11 MIP 与 Mobile Friendly 是什么关系?

Mobile Friendly 是用于评估个页面在手机端的浏览体验,评估标准包括内容易读性,功能易用性,广告面积等。

而 MIP 是一套解决方案,不仅可以提升移动端浏览体验,还会解决页面加速和安全性的问题。

所以应用了 MIP 的页面能够提升一定的移动友好性,但不一定能达到 Mobile Friendly 的要求。

1.12 加了 MIP 标签后对页面的展示有没有影响?

没有影响。MIP 标签会自带一些样式,但这些样式是可以被覆盖的。所以加了 MIP 标签后网页还可以保持原来的样式。

二、改造前准备

2.1 MIP 在原网站搭建,还是重新在新子域做,还是新目录做?

答:都可以,这三种方案改造 MIP 都是可行的。做好 canonical 标签 对应即可。

2.2 使用伪静态 url 的网站如何使用 MIP?

MIP 页面可能会被 MIP-Cache 缓存,所以用户看到的不一定是动态的页面。当需要更新页面内容时,可通过 MIP 组件形式封装 JS 请求,以及后续更新 DOM 的 JS 操作。

2.3 代码适配站点如何使用 MIP?

区别讨论。如果后端根据 UA 判断是否为移动端页面,并返回页面,则将返回的页面 MIP 化即可。如果是前端判断浏览器宽度或 UA,再请求后端返回相应页面,则需要改变这套流程,使用后端判断,或直接改为响应式页面。

2.4 是否必须是 HTTPS 才能 MIP 化,如果不是 HTTPS 会有什么影响?如何快速 HTTPS 化 ?

MIP 改造本身是不需要支持 HTTPS 的。但如果页面需要与服务端进行交互,比如发送统计,提交表单,获取数据,需要支持 HTTPS。快速进行 HTTPS 化可以通过百度云加速的 HTTPS 方案进行快速部署 HTTPS 环境。

2.5 gbk 编码的网站如何使用 MIP?

更改成 utf-8 编码后使用 MIP。gbk 编码并不是国际通用标准,在一些手机上会有会显示乱码。

三、前端改造,组件使用

3.1 目前 MIP 组件之外的一些 JavaScript 插件如何支持?譬如广告、统计、推荐,等等?

答:

(1)MIP 为了确保安全性和性能表现,不允许用户自定义 JavaScript,需要用 MIP 组件的形式引进来;MIP 组件是开源的,允许开发者自行开发组件并提交给 MIP 组件库。

(2)目前 MIP 组件已经支持多种功能组件:如广告支持站长自定义的横幅广告、视频广告、H5 广告,同时也支持一些第三方广告系统,统计可以支持百度统计,更多具体的组件支持的可以参考官网的 组件说明;后续 MIP 也将持续提供多样的组件,以适应不同的需求 .

3.2 MIP 页面中可以展现哪些元素?对于弹窗广告有何限制?

MIP 页面中可以展示所有原页面的元素,在前端代码中对于一些标签做替换即可。比如,如果需要使用悬浮元素(position:fixed)需要改用 mip-fixed 组件或 mip-semi-fixed 组件。

3.3 MIP 提供的组件不能满足交互需求怎么办?

在 MIP 官方组件不能满足需求的情况下,如果升级官方组件可以满足,可以 提需求 或自己升级官方组件,MIP 项目组来审核;如果涉及到站点自身业务逻辑,可以自行封装组件并通过 组件审核平台 提交审核组件,审核通过后可以上线。

3.4 网盟反屏蔽广告申请广告位的时候,能否同时生成 MIP 页面的广告代码片段?

答:暂时还是不支持直接生成的,需要人工的根据转换规则将非 MIP 反屏蔽投放代码转换成 MIP 反屏蔽投放代码。这个转换规则还是比较清晰的,在 MIP 文档 里有说明。

3.5 对于自适应站点,MIP 对页面的改造要怎么弄?

MIP 改造主要有三步:

1.引用 MIP 提供的 JS 和 CSS

2.替换部分标签为 mip-html 标签

3.去除原有 JS 逻辑,改引用 mip-js 组件。

是否需要特殊改造,由网站对 “响应式” 的实现方式决定:

1.如果您的自适应站点是用 CSS 的 Media Query 来实现的,那么不需要做特殊的改造,MIP 对 CSS 没有限制。

2.如果您的自适应是通过 JS 计算实现的,则需要进行相应的改造(见改造第 3 步)。 如果您需要的功能不在我们的组件列表里面,可以通过 GitHub issues 给我们反馈。

3.6 MIP 规范中写到不能用 link 标签对样式表进行加载,是不是我的样式都要写到 HTML 页面里,并且只能出现一次 style 标签?

MIP 规范不建议外链样式表,是为了节省网络加载时间,加速 MIP 页面。 开发时,样式表可以作为单独的文件维护,上线前通过一次编译(fis3,grunt,gulp)实现文件内联,将 CSS 作为