淄博高端网页设计:如何使用官方的GoogleAMP WordPress插件

发布时间2020-02-26    阅读:163    作者:淄博网站设计开发公司

在移动设备上,网站速度通常比在浏览器上慢,页面内容越丰富,加载时间就越长。即使你尝试了一些东西来加速你的网站,谷歌AMP和WordPress AMP插件可能会给你提供你想要的动力。

当一个网站需要太长的时间来加载,它可以提高你的反弹率。另一方面,当网页几乎瞬间出现时,用户体验(UX)就会改善,您的流量可能会增加。这是谷歌AMP的工作原理,以及如何在你的网站上使用它。

GoogleAMP综述

GoogleAMP是一个开源项目于2015年10月启动。Amp代表“加速移动页面”,但GoogleAMP不再局限于移动页面;如今,它也适用于桌面页面。(不过,就本文而言,我将主要从移动页面的角度进行讨论,因为AMP在这方面最有用。)GoogleAMP的目的是让网页内容加载得更快。WordPress AMP插件是将页面转换为AMP版本的简单方法。

它的工作方式是AMP通过有限的CSS、HTML和JavaScript来加快网页速度。基本上,这是一种建立超轻网页的方法,这减少了加载时间。GoogleAMP缓存承载内容,缓存版本是Google发送给用户的,允许用户立即查看网页。谷歌、LinkedIn、Reddit和Twitter等大型科技公司都支持GoogleAMP,而且AMPs在所有应用程序、浏览器和网络浏览者中都可以看到。

Google AMP的利弊

淄博高端网页设计虽然大多数网站将受益于谷歌AMP,但也有一些缺点,它。以下是GoogleAMP的优缺点,它将帮助您决定WordPress AMP插件是否适合您。

行家

· 如果你从移动搜索中获得了大量的流量,AMP可以改善用户体验,帮助你获得更高的排名。

· 移动用户,谁是一个缓慢的互联网连接,可以参与您的网站。

· Google缓存所有使用AMP框架的网站,这有助于提高谷歌排名。

· 更快的加载时间导致更好的参与,这通常会带来更多的收入。

反方

· 由于AMP使用有限的css、HTML和JavaScript,网站设计者不得不创建精简页面.某些功能和小部件,如动画、社交媒体“像”盒子和智能选择表单,必须去减少臃肿。

· GoogleAMP支持GoogleAnalytics,但除此之外,它不支持大多数其他分析平台。

· 谷歌AMP支持的广告选择也不多。不过,有了额外的插件,你可以添加广告选项--稍后会有更多的介绍。

· 这是一个软欺骗,但如果您的移动页面已经轻巧和优化,他们可能不会得到明显的速度使用AMP,所以设置它可能是浪费时间。

WordPress AMP插件

 

谷歌AMP插件的WordPress自动-创建AMP版本的所有帖子。然后,由于源代码中的“amphtml”,搜索引擎和AMP支持的应用程序和服务知道在哪里查找页面的AMP版本。该插件与WordPress无缝工作,无论您使用的是经典的构建器还是古腾堡。

插件不创建一个单独的移动主题,它不直接移动设备到AMP版本的网站。然而,如果移动访问者在Google、Pinterest或Twitter等平台上找到您的内容,他们将看到AMP版本。

如果无法呈现页面的AMP版本,则插件确保加载非AMP版本。这意味着尽可能多的站点将是AMP优化的,对于站点中无法实现的部分,它们仍然会显示和执行您需要它们的部分。

WordPress AMP插件的特点

· 

兼容性和验证:

· 如果无法自动转换到AMP,您将得到详细的验证错误,以便找到无效的标记。您可以选择删除或保留标记。

· 

核心主题支助:

· 放大器是兼容所有核心WordPress主题。(它还与许多非核心主题兼容。)

· 

CSS树抖动:

· 自动删除未使用的CSS,以获得在AMP 50 KB限制内的总数。

· 

安培故事:

· 安培

故事

· 建设者,让您创建全屏幕广告和体验的游客。

 

资料来源:安培

如何设置和使用WordPress AMP插件

1.安装并激活插件。获取插件这里.

2.走向外观,选择AMP。在使用移动设备时,您将看到您的网站是什么样子的,您还可以查看AMP桌面版本。如果主页不能使用AMP,您将得到以下通知:

 

淄博高端网页设计当一个网页转换为AMP时,它基本上是原始网页的精简版本.下面,您可以比较我的博客文章的原始版本与AMP版本-标志(我的名字在风格化的字体),颜色和字体是不同的。

 

3.点击“设计”更新标题文字颜色,标题背景和链接颜色,以及配色方案(光或暗)。您也可以选择显示一个链接,让访问者退出读取器模式。

 

4.您可以访问网站上任何帖子的URL,然后添加/安培/到了它的末尾,看到了AMP版本的帖子。如果试图查看AMP版本时出现404错误,请转到Settings,然后单击左下角的“保存更改”。您实际上不需要做任何更改,但是通过单击“保存”按钮,您的permalink结构将被刷新,这将使这些AMP页面出现在您的面前。

选择网站模式

WordPress AMP插件有三种网站模式可供选择,您可以通过在左侧边栏中转到AMP,然后单击General:

1. 

标准:

2. 安培是你的网站的框架。你不需要单独的非AMP和AMP版本。

3. 

过渡性

4. 每个页面都有一个规范的URL和一个AMP URL。

5. 

读者:

6. 每个页面都有一个规范的URL和一个AMP URL。在读者模式中,AMP只用于单个帖子、页面和其他帖子类型;另外两种网站模式在整个网站中使用。

默认情况下,将选择读取器模式。如果您更改为其他两个选项之一,您将无法通过外观访问“设计”部分。

您选择的网站模式将影响您所拥有的其他选项。如果您选择标准或过渡,您将在下面的屏幕截图选项。如果选择读取器,则只能从这三种内容类型中进行选择。

 

使用附加插件自定义您的AMP

由于WordPress AMP插件没有很多定制选项,所以您可以使用其他插件来进一步个性化您的页面。例如,安培WP支持社交图标,并具有可自定义的配色方案(包括一系列其他功能),以及WP广告为AMP提供了先进的广告支持。

此外,如果您当前使用的是YoastSEO,则可以使用Yoast SEO和AMP胶水插件,以便您的AMP页面将有正确的YoastSEO元数据。安装和激活插件后,您将像往常一样设置YoastSEO选项。这个插件将在后台发挥它的魔力。

一旦您设置了额外的AMP相关插件,请确保重新验证您的AMP页面。这将检查以前没有的任何新的验证错误。

最后思想

设置加速移动页面只是您可以使用的许多技术之一,以使您的网页加载更快。感谢WordPress插件,你不需要了解AMP是如何工作的,知道它对你的网站是有益的。有了这样一个简单的,一切都做好了你的安装过程,你可以安装它在一个下午,并让你的整个档案在几天内转换。

还有一件事:如果你使用谷歌搜索控制台,如果你没有立即看到你的AMP页面的结果,不要担心。谷歌可以在索引你的AMP和显示数据时花点时间。

想从你的移动站点中获得更多的吸引力吗?看看我们的导游如何使用Divi主题生成器优化移动侧栏.

 


QQ客服
胡经理