What is Google AMP? Pros and Cons of AMP for SEO

Nov 14, 2023
Content of the post
Content of the post

What is google AMP and how does it work is a topic that many people explore in the web SEO process. Nowadays, AMP is considered a highly effective solution for optimizing website loading speed when accessed from mobile devices such as smartphones, tablets, etc. Let's explore useful information about AMP in this article with CanhCam.

 

 Overview of The Concept of AMP

What is Google AMP ?

Google AMP, also known as AMP, is an abbreviation for the term "Accelerated Mobile Pages." Google AMP applies open-source technology to increase the loading speed of web pages when accessed through mobile devices such as tablets, smartphones. 

Google AMP is a "fast-paced” website for mobile devices.
Google AMP is a "fast-paced” website for mobile devices.

 

What are the Google AMP technologies?

  • Lazy loading images: Lightweight content, usually text, is prioritized for loading first, while images and videos are delayed until the user scrolls to the point where they appear, as users often pause to view them. Skipping unnecessary content significantly improves page loading speed.
  • Asynchronous JavaScript loading (async): With this technique, data uploading and code execution are performed independently. While data processing at the top is still ongoing, data at the lower section continues to be processed, reducing waiting time for web users.
  • CDN for speeding up JavaScript: CDN (Content Delivery Network) consists of multiple strategically located "edge servers" in various countries and locations. With this system, data is transmitted from a source to web users more easily and quickly.

How does AMP appear on Google Search?

When searching for websites using AMP on Google from mobile devices, these websites will be displayed with the word "AMP" next to the URL and a lightning bolt icon in the search results. When users click on this link, the website's content will be displayed as follows:

Google AMP viewer: This is the default display mode, where Google stores and optimally delivers the content to enhance the user experience.

Signed exchange: This is the display mode for the original content link. If users want to access the website directly, without going through an intermediary step, they may be required to install additional components.

AMP appears in Google Search Console.

Google Search Console allows you to monitor the status of AMP for the websites you manage. When using this tool, you can determine which AMP pages have been successfully installed and identify pages that are reporting errors.

READ MORE: Website designing services

To check the status of AMP pages, you simply need to open Google Search Console, then click on the "Mobile Usability" section.

AMP Plugin

To use Google AMP for your website, you need to install an AMP Plugin. This is a plugin that supports the display of all websites optimized with HTML. In other words, it removes HTML code tag manager from websites to improve loading speed. However, this script will not appear in AMP for pages with JavaScript.

There are some important points to keep in mind when using an AMP Plugin:

  • Prioritize supporting AMP Plugin with the CSS Streamlined version.
  • Only use JavaScript libraries provided by AMP; otherwise, the website may experience Lazy Loading issues.
  • Validate the AMP correctly to ensure smooth operation and avoid errors.
  • Forms cannot be used on AMP Plugin pages.
  • Ensure that the image and frame proportions on the page are balanced by adjusting the width and height to fit.
  • If you need to embed videos, use the AMP Approved Extension for the best support.

The structure of AMP is divided into three types as follows:

  • AMP HTML: This is a subset of HTML that comes with specific tags and attributes for customization. However, it has limited features and elements. If you are familiar with basic HTML, using AMP HTML will be relatively easy.
  • AMP JS: This is a JavaScript framework specifically designed for mobile pages. AMP JS manages resource handling and does not allow synchronous loading.
  • AMP CDN: It is used to cache AMP pages and perform optimization.

 

What are The Benefits of Google AMP in SEO? 

Google AMP is listed among the criteria for website ranking. However, Google still monitors and indexes websites with AMP installed. Pages using AMP and achieving faster loading speeds on mobile versions provide an optimized experience for users. This, in turn, leads to a better evaluation from Google in terms of reliability and quality. The website ranking also improves indirectly.

Google consistently applies standard criteria to all websites and URLs during indexing, primarily focusing on page loading speed. Websites with faster loading speeds receive higher evaluations and rankings from Google, especially for mobile versions. In the current era where mobile devices are widely used, AMP serves as a practical solution to enhance SEO.

To effectively utilize AMP, it's crucial to pay attention to the Google mobile-friendly criteria. A website that meets both mobile-friendly standards and incorporates AMP will be prioritized in Google's rankings (Google mobile-first index).

To effectively use AMP, it's essential to consider Google's mobile-friendly criteria. A website that meets these criteria and incorporates AMP will be prioritized by Google in its mobile-first index, which is crucial for SEO.

AMP brings many benefits to SEO.
AMP brings many benefits to SEO.

 

Check with AMP 

To check the validity of AMP, you can follow these steps:

Step 1: Access the AMP validation page at https://search.google.com/test/amp.

Step 2: In the box displayed on the website, paste the URL you want to test for AMP.

Step 3: Click the "Test URL" button to initiate the test.

Step 4: If the system displays the line "Valid AMP" in green, it means your AMP is valid. Any other cases indicate that your AMP is not valid. The website will provide specific error messages to help you make adjustments accordingly.

Check the page loading speed

To test the page loading speed, you can use the following tools:

  • Google PageSpeed Insights: Helps assess the speed and evaluate the page loading process on various devices. This provides solutions to speed up website loading.
  • Think with Google: This tool tests the page loading speed under different internet connection conditions, such as Wi-Fi, 3G, 4G, etc.
  • Dotcom Monitor: This tool checks and provides in-depth, comprehensive analysis of the website. It includes loading speed on popular browsers, page load times, and checks on web servers and hosting.

 

What are the advantages and disadvantages of AMP?

Merits and demerits of AMP you should know
Merits and demerits of AMP you should know

 

Advantages 

The greatest advantage of Google AMP is its ability to improve website loading speed when accessed through mobile devices. Research data indicates that websites using AMP achieve loading speeds 15-80% faster than non-AMP pages. Higher loading speeds result in a significant reduction in the bounce rate.

AMP enhances the experience for users of smartphones, tablets, etc., accessing the website. When user experience improves, Google evaluates the website positively, leading to higher rankings and increased traffic.

AMP also helps boost server performance by minimizing data retrieval requests from mobile devices, optimizing them to the maximum.

Disadvantages

AMP accelerates page loading, affecting the display capabilities of ads. Additionally, setting up ads on AMP-enabled websites is significantly more challenging than on regular websites. If you want to increase ad revenue on your website, it is not recommended to install AMP.

Another disadvantage of AMP is the lack of support for Google Analytics. Consequently, collecting and studying website data will be more time-consuming and challenging. This limitation could pose significant issues if you need data for online marketing endeavors.

 

 Guidelines For Installing Google AMP For Your Website.

The principles of designing a Google-friendly website can also be applied to AMP. Here, CanhCam will guide you on how to set up Google AMP for your website:

Step 1: Simple HTML structure for AMP

To install AMP for your website, you need to use the HTTPS protocol and ensure the following conditions:

Standard HTML: <!doctype html>

Specify content using the AMP format: Use the <html amp> or <html ⚡> tag.

Include all <head> and <body> tags.

The first child tag within the <head> tag must be <meta charset=”utf-8″>.

The second child tag within the <head> tag will be <script async src=”https://cdn.ampproject.org/v0.js”></script>.

Within the <head> tag, include the <link rel=”canonical” href=”$SOME_URL” /> tag.

Set the mobile viewing mode by inserting the <meta name=”viewport” content=”width=device-width,minimum-scale=1″> tag inside the <head> tag.

Inside the <head> tag, insert additional AMP boilerplate code."

Step 2: Store AMP on URL

Use user-friendly URLs to store the page with your Google AMP installed.

Example: If your standard page is https://example.com/subfolder/this-is-an-example.html

Then use the following URLs to store the AMP page:

amp.example.com/subfolder/this-is-an-example.html

example.com/subfolder/this-is-an-example-amp.html

Setting up this way will help the URL display a certain level of relevance to your main website when users click on it.

Step 3: Make your AMP easier to display

If your website has both versions - one using AMP and one not using AMP - insert HTML tags as follows:

- For pages without AMP, create a reference to the AMP version of the website to increase its visibility on Google and other platforms. Example of using HTML tags:

<link rel="amphtml" href="https://example.com/this-is-an-example-amp.html" />

- For pages with AMP, insert the following HTML snippet to create a reference to the non-AMP version of the website:

<link rel=”canonical” href=”https://example.com/this-is-an-example.html” />

- For standalone AMP pages (pages with only one version, which is the AMP version), you need to specify that the AMP page is the standard version. Example:

<link rel=”canonical” href=”https://example.com/this-is-an-example-amp.html” />

Standalone AMP pages can also be indexed by Google if found. So link your standalone AMP page to pages appearing in your sitemap.xml (website schema) or other indexed pages.

Step 4: Check the validity of AMP

Check the validity of AMP in Google Search Console as instructed above. Monitor your AMP pages regularly and fix any errors promptly.

 

 How To Set Up Google AMP For WordPress?

Steps to set up Google AMP for WordPress
Steps to set up Google AMP for WordPress

 

WordPress allows you to install the AMP Plugin for free. To install this plugin, follow these steps:

Step 1: Access the WordPress Dashboard, then click on Plugins > select Add New.

Step 2: Enter the keyword "AMP for WordPress" in the search box.

Step 3: Press the Install button to proceed with the plugin installation.

Click on Plugins > select Add New in WordPress, search for the keyword AMP, and click Install to proceed.

Step 4: After completing the installation, click on the Appearance tab and select AMP.

Here, you will find various tabs to customize your AMP page. For example, some tabs include:

Design: Edit text, links, background...

General: Set up AMP for specific posts or pages...

 

 Guide On How to Open AMP Websites on Google Chrome

Currently, there are many websites that support AMP interfaces, allowing users to browse the web on mobile devices at a faster loading speed. The AMP interface helps reduce content loading time on smartphones, tablets, even when the user's internet connection is unstable.

Google Chrome browser is default set to display websites with the full interface. Therefore, if you want to browse the web in Google AMP format on Google Chrome, follow the instructions below:

Step 1: Open Google Chrome and download the AMP Browser Extension.

Step 2: After installing the extension, you can search and browse the web as usual. Websites with AMP will display a green lightning bolt icon next to them.

Step 3: When you click on an AMP-supported website, the AMP interface will be displayed instead of the default Google Chrome interface. When browsing in this format, the content of the website will be prioritized before images, videos, advertisements, etc.

Step 4: You can turn off the AMP interface to return to the default website interface. To turn off AMP, simply click on the AMP Browser Extension icon at the end of the address bar until the icon turns gray.

Step 5: You can also access the AMP Browser Extension settings interface by right-clicking on the corresponding icon > Select Options. In the extension settings interface, uncheck the Load AMP or MIP Pages Automatically option. When you do that, the website will be displayed with the default interface. Additionally, you can also set up specific websites that you do not want to display in AMP format.

 

 Guide On Disabling AMP in Google Search on Android/iOS

The AMP interface works wonders when browsing with a spotty internet connection. However, when you have a high-speed internet connection, you can disable Google AMP to display websites in their full versions. Here's how:

Option 1: Use Encrypted.google.com (Google's encrypted search engine)

Visit the link Encrypted.google.com. Then enter your keywords in the Search bar and search as usual. This method will force the regular versions of websites to be displayed on the search page.

However, this search engine doesn't always redirect to encrypted websites. Therefore, users can set a website as the default homepage on their Android or iOS devices.

Option 2: Remove Google AMP links with DeAMpify

DeAMpify is an Android app designed to bypass AMP links. However, this app only works on Google Search and is not effective when searching through a web browser.

When using Google Search to look for something, click on the AMP-labeled link > Choose DeAMpify > Always. This way, the app will automatically open the original link of that website in Chrome. The Pro version of the DeAMpify app also supports users in blocking ads and comes with many other useful advanced features.

Option 3: Use DuckDuckGo's Bang feature

DuckDuckGo is a privacy-focused search engine that doesn't track user behavior. You can use DuckDuckGo to search, and the links you receive will be the original links of the pages. If you'd like, add DuckDuckGo to your browser for easier searching.

Disable AMP links using DuckDuckGo

Step 1: Visit DuckDuckGo.com. Then click on the Add DuckDuckGo to Chrome button.

- For Google Chrome:

Step 2: Open the Settings of Google Chrome, click on the Search Engine section, and choose DuckDuckGo.

- For Safari browser:

Step 1: Open Settings > Select Safari.

Step 2: Click on the Search Engine section > Choose DuckDuckGo.

You can set DuckDuckGo as the default search engine for your browser. Insert the characters !g before your search keywords if you want DuckDuckGo to provide search results from Google.

These are the steps to disable AMP links using DuckDuckGo. If you have any difficulties deciding whether to use AMP or not, or if you don't know how to set up AMP, don't hesitate to contact CanhCam for further assistance!

 

Frequently Asked Questions (FAQs)

1. How do I measure the impact of AMP on SEO?

The effect of AMP in SEO is directly seen on metrics such as page load time, mobile traffic, bounce rate, and others. AMP can also impact search engine rankings and visibility in case of mobile searches.

2. Do AMP pages need to be indexed?

Although it’s not mandatory, indexing AMP pages aligns with Google’s focus on delivering a good user experience, especially on mobile devices. In summary, Google indexes both AMP and non-AMP version of websites.

3. Is Google AMP necessary?

Publishers who heavily depend on traffic from Google may find value in using AMP web stories. However, if your website already performs well in terms of Core Web Vitals, AMP may provide little to no additional benefit.

Frequently asked questions
01. What is the definition of web design?
02. What do you need to effectively prepare for a website design?
03. What is SEO-friendly web design?
04. How is a professional and high-end website design?
05. How much does it cost to design a website at CanhCam?
06. Is there a contract for website design service?
Holding a leadership role in the company, I aspire to fulfill the mission of bringing bespoke website solutions to empower businesses to thrive in the digital age, fostering both operational effectiveness and competitive advantage, ultimately contributing to sustainble business growth and success.
Mr Hua Thien Vuong
Co-Founder & CEO