谷歌 搜索引擎优化指南( 国内首家AMPHTML标准，你知道几个？(组图))

　　谷歌 搜索引擎优化指南(

国内首家AMPHTML标准，你知道几个？(组图))

　　

　　前面：网站接入AMP有什么好处？

　　AMP 框架是 Google 推出的全新 HTML 标准。网页的HTML-AMP格式可以：标准化源代码，精简代码，自带谷歌CDN，网页加载速度提高4倍。采用AMP框架不会直接影响网站的SEO排名，但会直接提升用户体验和搜索引擎印象，间接提升网站在搜索结果页的排名。谷歌发布AMP的同一年，百度发布了MIP框架，这也成为影响百度排名的一个因素。

　　Ps：网站 接入AMP后，谷歌站长平台会自动识别并推送相关通知，直接搜索结果会显示闪电符号。百度站长平台需要单独的MIP/AMP验证（类似于HTTPS认证）。验证通过后，搜索结果会显示一个闪电符号。访问MIP只对百度排名有用，访问AMP对百度和谷歌有效！

　　“AMP 网站”搜索结果：

　　

　　“MIP 站点”搜索结果：

　　

　　一、Google-AMP框架解析：1.什么是Google AMP框架和百度MIP框架？

　　AMP（Accelerated Mobile Pages-Accelerated Mobile Pages）是谷歌为静态内容创建的网页，提供可靠和快速的渲染，加快移动页面的加载速度，改善用户的浏览体验。

　　MIP（Mobile Instant Pages-Mobile Web Accelerator）是百度推出的一套适用于移动网页的开放技术标准。完全借鉴AMP，被很多开发者视为AMP的国产版。

　　2.Google AMP 框架技术分析！

　　AMP HTML 是 HTML 的子集！

　　作为 HTML 的一个子集，它对通过 HTML 提供的全套标记和功能施加了一些限制，但它不需要开发新的渲染引擎：现有的用户代理可以像所有其他 HTML 一样渲染 AMP HTML。

　　AMP网站是通过搜索结果显示出来的，然后用户点击打开后显示的页面就是从谷歌缓存中获取的AMP页面。与MIP站点的区别在于：当打开AMP站点时，会清晰地观察到页面顶部AMP页面特有的导航栏：

　　

　　点击顶部导航栏右侧的“链接”符号，显示当前AMP页面对应的源站点链接（非AMP页面）。点击访问源站：

　　

　　AMP 和 MIP 都由三部分组成。前者由AMP HTML、AMP运行时和AMP缓存组成，后者由MIP-HTML、MIP-JS和MIP-Cache组成。

　　在 AMP HTML 上，它只允许有限数量的标签，例如 body 和 article 标签，它们可以直接使用，但脚本、框架和框架集等标签受到限制或禁止，就像在 MIP 中一样。但是img或者video等标签不能直接使用，需要更换其他标签才能使用。比如AMP中需要替换为amp-img，mip中需要替换为mip-img。

　　AMP 运行时完全用 JavaScript 实现，并由引入它的 AMP 文件启动。它的主要作用是协调资源的加载时机和优先级，插入AMP组件，并为AMP HTML引入运行时验证等调试功能。 MIP-JS用于管理资源的加载，支持使用MIP标签保证页面的快速渲染。

　　AMP 缓存提供第三方缓存，以便可以预加载甚至预渲染来自 Google 搜索的 AMP 页面。 AMP-Cache为所有符合规范的MIP页面提供CDN缓存服务，积极提升页面加载速度。

　　具体的前端页面制作规范请参考官方文档：

　　十大AMP优化技巧（不限于）：只允许异步脚本加载；静态计算资源布局大小；没有防止页面生成的扩展机制；关键路径中不允许使用第三方脚本； CSS是直接嵌入的，并且有大小限制；字体下载优化；尽量减少样式重新计算；只运行 GPU 加速*敏*感*词*；资源加载的优先级管理；预加载以快速显示。

　　

　　补充说明：如果直接使用AMP站点作为移动站，且没有对应的源对应站，则无需添加。

　　AMP 的工作原理：

　　二、Google-AMP接入指南：1.AMP站点独立域名的选择：

　　写在前面：通过分析市场上现有网站cms系统接入AMP框架的原理，实现方案可以分为两大类。一种主要的解决方案是通过判断用户终端UA（User Agent）来展示AMP站点，另一种主要的解决方案是通过给AMP站点绑定一个单独的独立域名来展示AMP站点。

　　解决方案 1：

　　在网站域名不变的情况下，根据用户UA（User Agent）判断实现MIP页面，构建网站@移动端页面> 也实现了。

　　即当用户访问我们的网站时，它可以通过判断用户的UA来识别用户的访问终端是手机还是电脑。手机呈现AMP站点，电脑呈现正常HTML页面。

　　前提条件：一个站点需要两套前端模板！一个是普通的HTML模板，另一个是AMP框架模板！当用户访问我们的网站时，页面通过判断用户的UA来识别终端。终端为电脑，页面调用原创普通HTML模板，终端为移动端，页面调用AMP框架模板。优点：无需为AMP页面单独设置对应的独立域名，无需添加上述标签属性来强调amp站点与源站的对应关系。

　　解决方案二：

　　第二种方案是将对应的独立域名绑定到站点的AMP站！

　　也就是说，一个站点必须至少绑定两个域名！例如：******.com、amp.******.com。

　　需求：当用户访问以www开头的域名（原域名）时，页面调用原普通HTML模板；当用户访问开头的amp（amp域名）时，页面调用对应的AMP框架模板。

　　

　　补充：考虑到域名权重继承和市场现有AMP站点的实现，建议AMP站点采用“原域名/amp/”的链接格式。比如原站点链接是：******.com，AMP站点可以设置为：******.com/amp/。用户访问******.com 显示源站点，访问******.com/amp/ 显示AMP 站点。可能有人会问，搜索引擎不会也显示原来的www站点吗？答案是不。源站点和新的AMP站点添加上述对应关系后，谷歌搜索引擎会自动识别。几天后，站长就可以在谷歌站长平台上看到AMP页面的提示了。当用户搜索相关关键词时，Google会优先展示AMP域名（展示优惠+闪电标记）。

　　2.AMP网站前端模板制作：

　　AMP和MIP页面的前端验证规则越来越严格！所以AMP模板的*敏*感*词*必须严格遵守AMP框架访问规范：

　　

　　具体的AMP框架编码规范请参考：

<p>因为谷歌搜索引擎会自动识别AMP站点，所以无需到站长平台单独提交验证！所以对源码的要求好像没有百度MIP验证那么严格~但是还是建议前端在写amp页面代码的时候一定要检查平台验证码是否符合AMP开发规范！