什么是 AMP

张俊SEM seo优化172字数 2126阅读7分5秒阅读模式

如果你是一位SEO爱好者最近应该有听说过AMP技术,什么是 AMP?对网站优化加速有什么价值?无忧来给各位站长进行下讲解。

源于是一种最新的SEO技术,是Google的AMP项目。文章源自张俊SEM-https://www.zhangjunsem.com/25657.html

AMP,Accelerated Mobile Pages,译意大致是”加速的移动页面”,是Google去年10月份推出的一个提高移动页面访问速度的技术,你可以官方查看到相关的介绍。文章源自张俊SEM-https://www.zhangjunsem.com/25657.html

点击了解详情    或者 文章源自张俊SEM-https://www.zhangjunsem.com/25657.html

来看看官方的视频讲解吧,需求科学上网。文章源自张俊SEM-https://www.zhangjunsem.com/25657.html

 文章源自张俊SEM-https://www.zhangjunsem.com/25657.html

通过 AMP 可以构建快速渲染的静态内容网页。 AMP 实例由三个不同部分组成:文章源自张俊SEM-https://www.zhangjunsem.com/25657.html

  • AMP HTML
  • AMP JS
  • Google AMP Cache

AMP HTML 是为确保可靠性能而具有某些限制的 HTML, 它进行了一些扩展,可以构建超出基本 HTML 的丰富内容。 AMP JS 库可确保快速渲染 AMP HTML 页面。 Google AMP Cache(可选)提供 AMP HTML 页面。文章源自张俊SEM-https://www.zhangjunsem.com/25657.html

AMP Landing Pages experience shown in a Google Search flow文章源自张俊SEM-https://www.zhangjunsem.com/25657.html

AMP Landing Pages experience shown in a Google Search flow

AMP 页面加速演示

AMP HTML

AMP HTML 本质上是使用自定义 AMP 属性扩展的 HTML。 最简单的 AMP HTML 文件如下所示:文章源自张俊SEM-https://www.zhangjunsem.com/25657.html

<!doctype html>
<html >
 <head>
   <meta charset="utf-8">
   <link rel="canonical" href="hello-world.html">
   <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
   <style amp-boilerplate>body{-webkit-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-moz-animation:-amp-start 8s steps(1,end) 0s 1 normal both;-ms-animation:-amp-start 8s steps(1,end) 0s 1 normal both;animation:-amp-start 8s steps(1,end) 0s 1 normal both}@-webkit-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-moz-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-ms-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@-o-keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}@keyframes -amp-start{from{visibility:hidden}to{visibility:visible}}</style><noscript><style amp-boilerplate>body{-webkit-animation:none;-moz-animation:none;-ms-animation:none;animation:none}</style></noscript>
   <script async src="https://cdn.ampproject.org/v0.js"></script>
 </head>
 <body>Hello World!</body>
</html>

尽管 AMP HTML 页面中的大多数标记都是常规 HTML 标记,但部分 HTML 标记替换为了 AMP 特定标记(另请参阅文章源自张俊SEM-https://www.zhangjunsem.com/25657.html

)。 利用这些自定义元素(称为 AMP HTML 组件) 可以轻松高效地实现常见的模式。

例如, 标记可提供完整的 srcset 支持,即使在尚不支持该标记的浏览器中也是如此。

了解如何。

AMP JS

AMP JS 库可实现所有 AMP 的最佳性能做法,

管理资源加载,并为您提供上面提到的自定义标记, 所有这些都是为了确保快速渲染您的页面。

重大优化之一就是使来自外部资源的所有内容保持异步,让页面中的任何内容都能毫无阻碍地渲染。

其他性能技术还包括:将所有 iframe 沙盒化、加载资源之前对页面上每个元素的布局进行预先计算,以及禁用性能缓慢的 CSS 选择器。

如需详细了解和相关限制,.

Google AMP Cache

Google AMP Cache 是一种基于代理的内容交付网络,用于交付所有有效的 AMP 文档。

它可提取 AMP HTML 页面,对页面进行缓存,并自动改进页面性能。 使用 Google AMP Cache 时,文档、所有 JS 文件及所有图像都从使用 HTTP 2.0 的同一来源加载,从而可实现最高效率。

此外,Google AMP Cache 还带有内置验证系统,可确认页面能够正常工作,并且不依赖于外部资源。

此验证系统运行一系列断言,确认页面的标记符合 AMP HTML 规范。

另一个版本的验证器与各个 AMP 页面捆绑提供。此版本可在页面渲染时将验证错误直接记录到浏览器的控制台中,让您可以看到代码中的复杂变化可能会对性能和用户体验产生怎样的影响。

 

本文属于专业SEO技术研究内供SEO爱好者阅读理解,非专业开发人员不要折腾哦。

声明:转载此文是出于传递更多学习交流目的。若有来源标注错误或侵犯了您的合法权益,请作者持权属证明与本网联系,我们将及时更正、删除,谢谢。本站部分图文来源于网络,仅供学习交流,发表作品观点仅代表作者本人,本站仅提供信息存储空间服务,不承担连带责任。如有侵权,请及时联系管理员删除。

weinxin
ynxtwl
加个微信
交个朋友
张俊SEM
  • 本文由 张俊SEM 发表于 2023年9月2日08:28:42
  • 转载请务必保留本文链接:https://www.zhangjunsem.com/25657.html
淘宝客营销计划如何删除?有什么功能?
淘宝客营销计划如何删除?有什么功能? seo优化

淘宝客营销计划如何删除?有什么功能?

  近几年不少的小伙伴们都在做着淘宝推广这一行,因为淘宝推广这一行市场是非常广的,并且市场的前景非常不错,淘宝客就是很多小伙伴们正在做的,那怎么删除呢? 下面我们随着汉聪小编一起来看下吧!   一、怎...
淘宝平台服饰类商品争议处理规范有哪些?
淘宝平台服饰类商品争议处理规范有哪些? seo优化

淘宝平台服饰类商品争议处理规范有哪些?

  21世纪的前20年里,我国电子商务经济发展迅速,而电商行业的高速发展同时也带动了网店数量的增加,而且现在在淘宝开店做服饰这一行的小伙伴们越来越多了,因为服饰这一行他比较好做,但也是由于他比较好做,...
淘宝工厂店和淘宝旗舰店有哪些区别?都是什么?
淘宝工厂店和淘宝旗舰店有哪些区别?都是什么? seo优化

淘宝工厂店和淘宝旗舰店有哪些区别?都是什么?

  我国的电子商务行业起步较晚,在1999年到2002年得到了初步的发展,在2008年以后,我国的电子商务发展猛然加快,呈现出爆发式的增长,一直持续到现在。而电商经济良好的发展前景也让更多人选择网店创...
淘宝平台特殊商品交易争议处理规则有哪些?
淘宝平台特殊商品交易争议处理规则有哪些? seo优化

淘宝平台特殊商品交易争议处理规则有哪些?

  现在大家在淘宝平台开店的时候,首先会先去查看一下相关的规则,因为在淘宝平台开店很多的交易纠纷都是有相应的处理规范的,开店是避免不了会出现交易纠纷的,那交易争议处理规则有哪些?一起来汉聪代运营来了解...