首先移动加速页面(AMP)是一个开源框架, 由谷歌在2016年2月推出, 重点放在移动性能方面。人们一直关注于针对移动设备的高数据成本、缓慢的加载时间和糟糕的内容渲染的局限性,因此AMP也因此问世了。谷歌想要达到的是一个一致的标准, 在向任何手机、平板电脑或移动设备发送内容时,应用到网页上,确保页面即时而丰富地加载展现。

  为了达到这个目标,AMP团队开发了一个新的网页格式,基本上是一个简化版的 HTML,特别是针对移动设备。通过仅允许最新形式化的设计模式和对资源密集处理的JavaScript,AMP页面的速度也因此大大超过了在网上发现的其他HTML页面。

  为了进一步提高加载速度,AMP使用AMP组件的服务器端来渲染,在谷歌服务器上缓存页面内容, 以便内容尽快到达浏览器。这个策略现在正在流行, 因为目前在线有超过20亿个AMP页面,遍布全球超过90万个域名。在这篇文章中, 我们将看看哪些品牌正在使用AMP, 如何构建 AMP页面,AMP如何改进电子商务网站, 以及框架的一些缺点。

  如果你在过去一直在用手机浏览谷歌,那么你很可能已经在浏览 AMP 页面了。当你在 Google 上搜索一个特定的关键词, 比如”火星”, 你会看到AMP链接出现在顶部的轮展位上,当你看到AMP文章标题下面的闪电图标时, 你可以区分哪些链接是 AMP 搜索结果,效果如下:

【谷歌GTM 教学】什么是AMP-移动端SEO加速利器解析

  

      一个页面有了一个可供选择的AMP版本,这个版本是由谷歌索引的,它就会出现在搜索引擎的搜索结果中,并且带有闪电符号和AMP标签。要注意的是,你要给你的 AMP-optimized 页面一个独特的URL, 例如:testsite.com/testpage/amp。在Chartbeat进行的一项研究中发现, 截至2017年12月,美国的顶级出版商现在看到AMP占据了他们所有流量的7%,而且读者使用 AMP 内容阅读的时间比其他普通移动网络要长35%。出版业巨头cond Nast是AMP的早期使用者, 他们很快就意识到, 包括《纽约客》(The New Yorker)、《连线》(Wired)和《名利场》(Vanity Fair)等品牌,如何能够从移动设备的精简和谷歌缓存内容中获益。

  如何使用AMP构建页面如果你已经熟悉普通的HTML和网页的样式, 适应AMP应该就很容易了。虽然它被剥离了,但是语法和代码结构是建立在现有网页设计标准的基础上的,作为一个AMP文档它有一些新的标签来识别网页,以及加载独特的库。

  由于AMP是对常规网页的重新设计,但是针对移动网页进行了优化, 因此在常规 HTML 和 AMP 之间有一些主要的差异。例如,AMP 的顶级 html 标签是 html AMP 或者 html,它允许浏览器识别这个页面为AMP内容。类似地,还有一个特定的JavaScript库必须加载, 通过在网页的添加。此外, 因为不是所有的访问者都会使用移动设备,所以你可以在页面的标签中加入一个canonical链接。例如:<link rel=”canonical” href= “$SOME_URL”>,如果你要使用web的 版本的URL,你可以将规范链接指向web的url。

  其他的差异包括图片是如何添加到页面中的。另外,<img>不支持AMP,但这个标签可以替代。一个固定的宽度和高度被包含在amp-img标签中,可以是这样的:

<amp-img src="hello-world.jpg" alt="hello" height="400" width="800">

  

你也还可以通过简单地在amp-img标签中写上layout=”responsive”, 从而使你的图像在不同尺寸的屏幕上完全响应。

    版权声明:

     本网站的所有文字、图片资料,【未注明转载的】均由作者亲自整理创作,任何媒体、网站或个人未经本人同意和授权不得复制、转载、转贴或以其他方式复制发布/发表,请尊重我的劳动成果,侵权必究,谢谢。

阿沐
1625139774@qq.com

发表评论

电子邮件地址不会被公开。 必填项已用*标注