什么是谷歌AMP?

谷歌的加速移动页是一组表现的重点,最大限度地提高性能,并允许谷歌使用自己的CDN分发优化的内容的HTML,CSS和JavaScript的约束和限制。简而言之,谷歌AMP安普强制Web组件到位某些HTML标签的使用,限制了CSS选择器,可以对性能产生负面影响,并禁止非谷歌AMP JavaScript的沙箱外I帧的使用。要了解更多关于AMP格式,它是如何工作的,以及它如何融入到谷歌搜索,看看在官方综述技术说明AMP的例子门户。

为什么我们发布在谷歌AMP?

康泰纳仕是世界上最负盛名的出版商之一。你可能认识一些我们的品牌,其中包括Ars Technica的,胃口好,高尔夫文摘,GQ,干草叉,纽约人,名利场,时尚,有线,和其他人。作为发布商,实现AMP是一个没有脑子。AMP提供在性能,一致性和经验,为移动用户方面带来许多好处。从谷歌抵达用户进行搜索,从不间断地流进我们的内容。AMP含量快速加载由于谷歌的CDN和AMP HTML执行性能准则。AMP的布局系统可确保防止网页从跳来跳去作为第三方内容加载一个伟大的阅读体验。我们的正规网站是不以任何方式慢,我们不断击败竞争对手的加载和渲染时间,但也有一定的性能保证,谷歌可以提供给他们的用户(如预取)在内容上他们的CDN。

让我们退后一步,想想我们什么incentivises作为一个出版商。为了创收,我们需要我们的内容通过尽可能多的受众是影响力和发现。保持该观众通过我们的品牌提供优质的内容从事帮助我们最大限度地提高我们的收入。谷歌AMP帮助我们满足这些需求。AMP通过允许它被纳入谷歌的最新新闻旋转木马,以及改善的常规谷歌搜索结果中的经验,提高了我们的内容的知名度和曝光率。AMP保证我们的内容一直快速加载,在世界任何地方与谷歌搜索通过其集成的AMP观众的无缝体验。这种无缝的体验导致增加参与和减少反弹。货币化的好处是不太果断,然后等待我们目前执行的进一步分析。我们最初的AMP推出仅投放的广告与具有较低的CPM(费用每千次,发布者使一个千次展示的广告量)比我们服务于我们的常规移动网站支持的广告内容相关定位既上下文和受众定位。正如我们已经改善定位和添加了其他收入合作伙伴的支持,我们可以看到,每千次展示AMP已要么保持不变或取决于品牌增加。

我们与谷歌AMP去住上名利场略高于去年同期水平。发布后,业务流量和搜索排名结果是非常积极的:通过点击来自谷歌搜索率从5.9%(定期)去了10.3%(AMP)和平均搜索位置从5.9(正常)去1.7(AMP)。从那时起,我们已经部署了AMP在我们品牌的十五岁,我们一直很高兴的结果。今天,AMP占我们的移动搜索流量的79%,我们的总移动网络访问的36%。我们能够在康泰纳仕1-15个品牌与我们的品牌最小的破坏和工程努力扩展我们的谷歌AMP执行。

怎么会有我们实现了谷歌AMP?

我们的品牌AMP含量得到由具有正页面发现包括在他们的头部指向的URL页面的AMP版本标记。在我们的架构,我们为AMP网址,我们内部的AMP服务,它负责生成请求内容的AMP版本的代理业务。下图是我们的内容创建和AMP分布体系结构的概述:link rel="amphtml"

网站制作介绍谷歌AMP是什么?

康泰纳仕AMP服务架构

我们所有的品牌都使用副驾驶,我们内部的内容管理系统(CMS)。我们的CMS存储在降价的定制版本,称为副驾驶降价内容。副驾驶降价就是一组关于CommonMark规范它增加了特殊的语法嵌入代码,标注,型材以及其它由我们的编辑使用的功能扩展。

当谷歌用户打开AMP结果为我们的品牌之一,谷歌AMP CDN可以快速提供最新的缓存副本。在幕后,在谷歌AMP CDN触发对我们品牌的域的AMP文件的URL的请求。我们所有的品牌都在快速度CDN提供的缓存另一层门前。当请求命中快速度,在品牌的清漆控制语言(VCL)配置逻辑确定该请求是用于AMP含量。如果是这样,快速度设置了成为AMP服务,然后接管并生成AMP HTML用于所请求的内容的请求的后端。

为了让我们的AMP服务呈现一块内容,我们来从我们的CMS内容,然后解析并将其转变成起反应,因此得到呈现为有效AMP HTML组件。下图显示了此渲染流水线,其是内部的AMP服务:

网站制作介绍谷歌AMP是什么?

AMP服务渲染管道

Conde Nast的,我们的技术堆栈使用的Node.js和反应我们的大多数品牌的正规网站。使用带有阵营服务器端渲染生成AMP含量非常有意义我们。这种选择可以让我们的品牌工程师轻松贡献我们的代码库AMP。和使用Node.js的发生反应也使我们能够在我们的正规网站和AMP服务重用的组件和助手代码。

确保品牌维持其外观和服务时在创建AMP服务时AMP是一个重要的优先事项感觉。AMP的服务,允许品牌商提供自己的配置和自己的使这个萨斯文件覆盖我们理智的默认值。如果提供的话,配置和SCSS文件控制输出分别AMP HTML标记和CSS。通过这一方法,品牌能够切换的功能和定制自己的设计。在未来,我们将采取反应的组分扩展性,允许品牌AMP HTML标记输出的更深层定制的另一个优点。有一个服务,是能够为我们所有的品牌做到这一点已经被证明非常有价值,大大减少了重复劳动。要启动服务AMP交通,一个品牌只需要添加一个配置文件,并修改其快速度VCL配置。正如我们已经长大了AMP执行的功能集和onboarded更多的品牌,这种架构已经被证明是一种非常灵活的解决方案。

我们学到了什么?

我们集中的内容管理系统和面向服务的架构使得它几乎毫不费力地将新加入的品牌到AMP。这并非总是如此。当我们onboarded我们的第一个品牌,我们没有使用一个服务架构,而是我们有一个插件架构,其中每个品牌不得不依赖于AMP插件。这个插件架构导致重复的代码,因为我们onboarded其他品牌,这也令它具有挑战性的推出在所有品牌的新插件的版本。当我们切换到共用AMP服务这些问题就走了。面向服务的架构的强大和可扩展性已经明确。AMP的服务验证整个康德纳斯使用的跨品牌共享服务。此外,具有存储在我们的所有品牌的通用格式(副驾驶降价)我们的数据,共享的工具,API和努力的好处从来没有更明显。

总体而言,AMP不得不进行的业务流量,并给我们的谷歌用户而言在经验方面产生积极的影响。今天,AMP占我们总移动流量的36%,我们正不断增加,对于企业创造盈利机会,提高我们的AMP用户体验功能。我们很高兴地看到什么样的未来持有的谷歌之外的其他平台决定提供AMP含量多的组织开始贡献给AMP开源项目