Weebly - Websites, eCommerce & Marketing in one place.

What is AMP and How to Setup AMP on WordPress Blog or Website

What is AMP ( Accelerated Mobile Pages)

AMP stands for Accelerated Mobile Pages. AMP is an open-source HTML toolset or framework that enables web pages to load extremely quickly, even when resource-heavy content such as video or images are included in the pages. In action, Accelerated Mobile Pages delivers only the absolute essential content of a web page, removing any unnecessary extras. This enables a page to load in a browser almost immediately, instead of requiring the median mobile-site wait time of around twenty seconds.

Benefits of Setting AMP

There are two main benefits of setting AMP. The first benefit comes in increasing the speed in page loading, while the second benefit is the improved indexing for Google’s search engines.

  • AMP Speeds Up Page Loading

In the world of the Web, speed is everything. Most people who browse the web on mobile devices don’t want to wait a long time for the content to load. Therefore, when presented with a slow-loading page, they simply will move on. No matter how good the content on a page if it is never seen, it is wasted. Using Accelerated Mobile Pages enables prospective viewers to quickly get to the actual content, and eliminates the frustration of spending time waiting for a page to load. In addition, if a page loads quickly and the content is good, visitors are more likely to remain and look at additional content. Therefore, Accelerated Mobile Pages can have a powerful effect on your site, although that effect is indirect.

  • AMP Improves Google Indexing

Google has recently begun testing a mobile-first index. In practice, this means that Google will look at the mobile version of a site first to determine how that site should be indexed. Therefore, it makes sense to ensure that the mobile version of your website is ready for Google’s inspection.

setup AMP on WordPress

How to Setup AMP on WordPress Blog or Website

AMP itself is extremely easy to set up on a WordPress website or blog. There is no need for most of the back-end work that usually goes into changing web page formats for a new medium. Instead, you can use a pair of very useful plugins to get Accelerated Mobile Pages up and running quickly and without much effort. There are two steps in the process: making your site AMP-ready and customizing it so that it matches the look and feel of your default site.

Step 1: Making Your Site AMP-Ready

The first plugin actually makes your site AMP ready. This is a free plugin by Automattic that enables Accelerated Mobile Pages for WordPress pages by adding a “/amp/” suffix to the end of all your WordPress pages. In practice, if the current URL for your page is “http://www.justmychoice.com/seo/“, the new URL will be “http://www.justmychoice.com/seo/amp/“. To verify that the change worked, open the page in any mobile browser and compare the AMP page to the existing full version. All extraneous features should be gone, leaving only the bare content.

Step 2: Adding Branding to Your AMP Site

Now that the AMP version of your site exists, you’ll probably notice that the Accelerated Mobile Pages site is quite barren compared to the standard version. To make your AMP site have the same general look and feel of your standard site, you can use the second plug-in from Yoast to bring your meta-data into the new Accelerated Mobile Pages site and also to customize the colors so that they will match the standard site. This plugin is available on WordPress. After installing and activating the Glue for Yoast SEO Plugin, go to the WordPress dashboard. From here, open the Yoast SEO menu and click AMP. In the AMP menu, choose the Design tab and set your preferred colors. You can also add a default image.

After installing and activating the Automatic and Yoast SEO plugins, you will have two versions of your blog or website. Both will have your specified color theme and branding, but the Accelerated Mobile Pages version will have only what is absolutely required. No extras such as headers or social sharing icons are included. Removing these extras has the added benefit of freeing up space on your site for the content and reducing the time your viewers need to spend even more, as in many cases the content that previously was hidden below the fold will be visible without any scrolling.

Please note that the Yoast SEO plugin will not work if you have any other SEO plugin also activated on your WordPress site. It is quite common for plugins with similar functionality to have problems co-existing. If this situation occurs, you will have to choose which plugin you want to keep. If you prefer to keep the default black-and-white AMP look, you can deactivate the Yoast plugin. However, if you would rather make the Accelerated Mobile Pages site look and feel more like the main site, you can choose to deactivate your conflicting SEO plugin instead.

Checking AMP With Google Search

Google has recently begun testing a mobile-first index, meaning that the mobile version of a page will be checked first to determine how it should be indexed in the search. Therefore, once you’ve set up Accelerated Mobile Pages and customized the look and feel of your page, you need to confirm that Google has taken notice of the changes. First, log into the Google Search Console and click the Search Appearance > Accelerated Mobile Pages.

In the search console, you can track the indexing process for your pages, and you also can fix any errors that may occur. A graph in the search console displays the indexing progress over time, and any errors display below the graph. Click on each error to view the details and find the cause. Common causes include malfunctioning scripts or incompatible plugins. Once you have found and fixed the error, you should run the Validator to ensure that the error no longer occurs.

Setting AMP on Non-Wordpress Sites

This article is specific to using AMP on WordPress sites. However, if you would like to use Accelerated Mobile Pages on non-Wordpress sites, the Accelerated Mobile Pages Project has a detailed guide available at Project. The process for non-WordPress sites is more complex, but the guide is thorough and will enable you to set up AMP on your standard websites as well.

Total Comments (2)

  1. Akshay December 7, 2018
  2. Viraj Patil July 10, 2017

Reply

15K Followers
4.1KFollowers
28021
Close