[Web翻译]谷歌AMP - 我们的转换率下降了70%。

374 阅读7分钟

原文地址:medium.com/the-set-lis…

原文作者:medium.com/@natekontny

发布时间:2018年8月8日 - 7分钟阅读

image.png

蛋。在。脸上。我刚刚完成了不少于3篇文章和3个YouTube视频,吹嘘我的设计工作有多么伟大,最近让我们的转化率提高了500%。

而现在,我最近的一些变化让我失去了一大半的进步。

我们来谈谈谷歌AMP。AMP是Accelerated-Mobile-Pages的缩写。这是谷歌最初推出的一项技术,目的是让网络开发者加快他们的网页在移动设备和移动网络上的运行速度。但在许多方面,它似乎是任何设备或网络的伟大技术。谁不希望网站速度快呢?

它并没有那么神奇。它的性能提升很大一部分原因仅仅是它的标准:不使用javascript,全部使用内联CSS,CSS只能测量50KB或更少。在这些要求下,你要让任何页面的加载速度更快。

但谷歌也从自己的CDN托管AMP页面。所以你从有机搜索结果中碰到的某些页面(现在还有谷歌广告)实际上会从谷歌自己的服务器上显示你的页面。耶! 那一定很快。

在有机(和最近的付费)放置你的页面,甚至有一个漂亮的AMP闪电图标。

image.png

而且据说Google可能会把这些位置的排名比非AMP页面更高。

让我们参与进来吧!

所以,我花了几周时间,在谷歌AMP中深入重建我们的着陆页体验。我当时很兴奋。我已经对我之前的胜利感到很高,现在事情应该会变得更好。早期的测试似乎很积极。在谷歌Chrome的Lighthouse(浏览器中内置的性能审计工具)中,100%。来自webpagetest.org的直接As。带来的流量,来自那些谷歌在我之前祝福的游客!。

蟋蟀。

不完全是蟋蟀,但铅流迅速(和统计)放缓。也许只是暑假的低迷?不,不是这样的,因为我比较我们的数字与一些伟大的转换性能,曾发生在美国独立假期。这真的很糟糕。

不可能知道到底发生了什么,因为有一堆变量。但让我强调几个,以防你进行同样类型的实验,并想避免类似的麻烦。

这是个骗局吗?

当你点击谷歌AMP页面时,你会注意到一件事,那就是现在你的页面,如果从移动/平板设备访问,很可能在 "谷歌AMP浏览器 "里面。

image.png

google.com在URL地址栏中,顶部有一些额外的UI chrome。现在,有google.com可能是一个信任信号的人。

但它是所有的时间?

我感觉在很多情况下都不是。对于阅读新闻,它是好的。但是,我试图建立我的公司作为一个合法的业务,可以信任一个陌生人为他们建立软件。有google.com气味的钓鱼骗局或飞由夜操作,无法负担自己的域名。点击 "汉堡包菜单",一个标准的设计实践,现在,并没有帮助。

image.png

它转到了一篇支持文章,我怀疑我的任何访问者都在阅读。

image.png

如果你然后找出如何返回按钮你的方式回到我们的网站,现在你可能会有更多的chrome关于被 "登录 "到谷歌。

image.png

我真的不喜欢这种体验,作为一个设计师或者作为一个我在互联网上发现的陌生网站的用户,他们试图让我成为他们的客户。

也许AMP真的坏了。

测试AMP页面也不是世界上最直接的事情。有时你的页面是从你的域名上提供服务的,有时不是,是来自谷歌的CDN。所以确保你彻底从这两个方面进行测试。

你可以做的一件事是使用Google Chrome的设备模拟器来模拟移动或平板设备来测试你的页面。

image.png

不过这对你来说可能很棘手。你需要先通过谷歌找到你的网页。搜索它希望用关键字,让你的网站在顶部的结果. 点击该有机列表和voíla你可以测试你的网站。

但有一个问题。有时我得到的是空白页。

image.png

在Javascript控制台中没有任何关于错误的信息(顺便说一句,AMP有自己的Javascript)。我以为这只是在模拟器中做测试的一个怪癖,但现在考虑到我的转换率表现,我不太确定。

关于这个问题有很多线程。

image.png

第一个建议是不要使用html{position:relative}。我不是这样的。这是唯一的提示。

而且问题是断断续续的。它出现的时候没有任何韵律和理由。我也没能在我测试过的几个实际设备上看到它。这是生产中真正的问题吗?

我不知道。但它可能是。我创建复杂的网站已经超过20年了,我甚至不能确定Google是否能一致地提供我的内容?

设计真的是一样的吗。

如果你想把一个页面转换到AMP上,你很可能需要做出一些不同的设计决定。不仅仅是重新定位CSS,而是选择一个不同的设计框架,保持小尺寸。然后你需要复制你的原始页面,如果你想要一个苹果对苹果的性能比较。

所以我花了大量的时间来复制网站,但并不完美。例如,在一定的宽度下,我的主标题变成了3行,而非AMP版本的是2行。

image.png

image.png

可能并不是一个足够显著的变化,以至于导致转化率下降70%,但这与上面提到的其他一切以及其他类似的设计怪癖结合起来,可能都会让我们的转化率下降。

这个设计部分是AMP的错吗?完全不是。

但是,如果你走我这条路,请确保你有足够的时间让这些页面完全相同,否则你也会遇到同样的麻烦,即在其他设计部分在变化的情况下,试图衡量转化率表现。这是很难的。留出充足的时间来做好它。

现在要做什么?好吧,我对AMP的概念和标准还是很有兴趣的。我很希望网页能变得更小更快。没有什么理由,一个小公司的网站,可以在100ms内加载为一个全部是HTML而没有Javascript的静态网站,实际上是一个100MB的React应用🙂。

但我犹豫是否要完全接受谷歌生态系统,它需要像AMP一样控制我的网站。我喜欢谷歌和所有的,但我有麻烦加载谷歌分析超过24小时,没有从 "支持 "的答复:/我想他们拥有更多的我的业务?

好消息是,谷歌支持采取AMP的最佳,并使其成为一个标准,并不是真正的谷歌

谷歌承诺,任何与AMP页面性能相匹配的网页都将在谷歌搜索中获得完全相同的待遇。

所以我很高兴看到这个领域的发展。

但是,当我在不久的将来继续在这里建立新的网站和登陆页面时,我将暂缓使用AMP建立这些网站。我会继续试验,但新的网站和登陆页将在我有更多控制和理解的地方保留它们的家。


P.S.如果你需要任何帮助建立软件,给我们一个呼喊。我相信我们可以帮助你。

而且你应该在YouTube上关注我:youtube.com/nathankontny ,在那里我分享更多关于我如何经营企业、做产品设计、营销自己,以及如何度过生活。

原文发表于2018年8月8日的www.rockstarcoders.com。


通过www.DeepL.com/Translator(免费版)翻译