WordPress外贸网站使用AMP移动端加速技术

什么是AMP

AMP是Google主导的开源网页加速项目，它可以提高静态内容的渲染速度，主要是为了提高移动端网页的载入速度。这项技术可以限制HTML，CSS，JavaScript中可能会影响网页加载速度的代码。AMP 就是一种简化的HTML5, 有自己一套的标签, 并只能有一个内链CSS (不允许有外部CSS文件, 因为CSS是会阻碍浏览器渲染, blocking), 对同步的JS代码也有很大的限制, 好像只能放在 iframe 里, 总之 这一切的设计就是为了让AMP网页读得快 加载得快 显示更快.

AMP的源代码：https://github.com/ampproject/amphtml

为什么要使用 AMP?

为了在网络慢的地方或者比较慢的手机上显示, 需要一个简化的AMP规范来提升用户体验. 而这是有代价的:只显示重要的文章内容 而其它可有可无的小插件就不会被加载。

AMP 内容会被Google 的CDN或者CloudFlare CDN 给预先缓存, 比如你在搜索的时候 显示搜索结果的时候 Google 已经把AMP的内容给下载下来放在本地缓存中, 等到你需要的时候直接加载渲染。

• AMP 的设计是手机友好的, 事实上AMP页面是静态布局, 不需要麻烦的CSS来灵活定义 viewpoint, AMP在加载的时候 智能设备就能先把局给布好了, 挖几个坑等着填文本 能不快么?

WordPress网站启用AMP

AMP实际上就是一个模板, 因为和传统的HTML5标准差异较大, 所以在设计的时候 就分成两个不同的网址, 规范是AMP的页面网址在源网址后加上 /amp 或者 /amp/ 但理论上没有这个限制的.

其实您做的最重要的第一步就是 装上官方的AMP插件: AMP for WordPress 是为WordPress开发的一个AMP插件，当激活这个插件时，你网站的所有文章都会动态生成一个AMP兼容版本，可以在url后添加/amp/访问。

例如，如果您的发布文章URL是http://example.com/2016/01/01/amp-on/，您可以访问AMP版本http://example.com/2016/01/01/amp-on/amp/。如果你没有启用漂亮的固定链接，你可以通过追加来做同样的事情?amp=1，即http://example.com/?p=123&amp=1

注＃1：目前不支持主页，博客索引和档案。

注＃2：此插件仅创建AMP内容，但不会在用户从移动设备访问时自动将其显示给用户。这是由谷歌搜索等AMP消费者处理的。有关更多详细信息，请参阅AMP项目常见问题。

 AMP for WordPress 插件

AMP for WordPress 下载地址：https://wordpress.org/plugins/amp/