What is AMP? : It’s a way to improve user experience
contents
- 1 What is AMP?
- 2 Verification of AMP Implementation
- 3 Summary
AMP stands for Accelerated Mobile Pages. The introduction may involve some difficulties and restrictions, which are disadvantages.
It’s worth noting that non-AMP pages are now appearing in news and carousels since June 2021, and Google has stated that AMP doesn’t influence search rankings. So, it’s not a must-have for all sites.
However, having a fast-loading site significantly enhances user experience, potentially leading to improvements in site performance and conversion rates. Let’s delve into AMP.
What is AMP?
AMP (Accelerated Mobile Pages) refers to mobile pages optimized for speed, pronounced as ‘amp.’
It works by accessing data that’s already cached (stored), bypassing the need to access and load the website as usual. This dramatic reduction in loading time is what makes AMP stand out.
Originally initiated by Google and Twitter in October 2015, AMP was initially the project’s name, but now it refers to the AMP HTML framework.
Why AMP Loads Quickly
Regular websites require loading various elements like html, css, Javascript, and images, which can slow down due to the number of requests and file sizes.
With AMP, three elements—AMP HTML, AMP JS, and AMP Cache—are loaded, but they’re all specified statically, ensuring faster loading times.
AMP pages are cached by the AMP Cache content delivery network, enabling content retrieval from the cache when users tap on search results or URLs, bypassing direct website access.
In essence, AMP involves preparing lightweight, cached pages separate from the main website to maximize loading speed.
Therefore, sites heavy on images or videos might not benefit much from AMP, while those focused on article content are ideal candidates.
Not Related to Mobile-Friendliness
Despite being ‘accelerated mobile pages,’ AMP isn’t directly related to mobile-friendliness, which is a Google update where mobile-friendly pages affect search rankings. However, while AMP speeds up loading, it doesn’t impact rankings directly.
*Strictly speaking, improved page speed enhances user experience, leading to increased engagement and indirectly affecting rankings.
AMP’s SEO Impact
Implementing AMP doesn’t directly affect SEO. However, since mobile page speed influences rankings, converting slow pages to AMP could potentially affect rankings by improving page speed.
Google acknowledges that page speed is one of the ranking factors. However, it’s not a case of faster pages always ranking higher; rather, if the speed falls below a certain threshold, it might affect rankings negatively.
While improved page speed enhances user experience, it doesn’t necessarily mean a boost in rankings.
*As of March 2021, Google acknowledges that AMP isn’t a ranking factor.
Reference: Core Web Vitals & Page Experience FAQs (Updated: March 2021)
Sites That Should Consider Implementing AMP
AMP offers a significant advantage in accelerating mobile page load times, making it a worthwhile technology to adopt if feasible. However, due to the associated complexities and limitations, it’s not a one-size-fits-all solution for every website.
Although it began in 2015 with considerable improvements since then, as of 2021, it’s not mandatory to adopt AMP for all sites.
Nevertheless, considering the substantial benefits, it’s worth exploring implementation for the following types of sites
- Sites primarily focused on article content (as opposed to those heavily reliant on images or videos)
- Sites that can be converted to AMP just by installing a WordPress plugin
- Sites where the coding effort required for AMP conversion does not become a burden
- Sites not heavily reliant on ad monetization (due to ad limitations)
End of AMP Preferential Treatment in June 2021
Before 2021, there were preferential treatments for AMP, such as appearing in Google News, displaying a carousel, and showing the AMP badge (a lightning bolt symbol ⚡ that indicates the page is AMP-optimized).
However, as announced by Google in April 2021, Google News and carousels now display non-AMP pages, and the AMP badge has been discontinued. This update was implemented in June 2021, diminishing the previous advantages of AMP.
Reference: Timeline, Tools, and More Details for the Page Experience Update
Pros and Cons of Implementing AMP
Aside from the benefit of faster page loading speeds and the inconvenience it may entail, there are additional pros, cons, and considerations to consider when implementing AMP.
Benefits of Implementing AMP
In addition to faster page loading speeds, there are two other benefits.
Increased Traffic Sources
Converting to AMP may lead to the inclusion of previously unseen carousels and rich results, potentially expanding search traffic sources. However, since June 2021, carousels may also display non-AMP pages, diminishing this benefit.
Higher Click-Through Rates
AMP article cards automatically feature large thumbnail images, contributing to an increase in click-through rates.
*Note that while displaying large thumbnails on non-AMP pages is possible, it’s not automatic.
Drawbacks of Implementing AMP
While the improvement in page loading speed is a significant advantage, there are various drawbacks to AMP.
Potential Design Disruption
Depending on the site’s design, converting to AMP may significantly disrupt the layout.
Ad Restrictions
If you’re running affiliate campaigns and your ASP ads aren’t AMP-compatible, you won’t be able to display ads. This could result in decreased or zero ad revenue.
While Google’s AdSense ads are compatible with AMP, there’s a potential for reduced conversions.
Operational Burden
When you implement AMP, you’ll need to manage two types of pages: AMP pages and non-AMP pages, which can increase the operational burden.
However, if you’re using WordPress with a plugin for AMP, AMP pages are automatically generated, reducing the workload.
Decrease in Traffic
While there’s a benefit of increased search traffic sources, there’s also a downside: page links within snippets may not be displayed. This could result in fewer accesses from snippets, especially if the links weren’t previously displayed or clicked.
Considerations When Implementing AMP
As you can see, there are several drawbacks to converting to AMP. Before proceeding, make sure to consider these points carefully.
Inability of converting to AMP
Sometimes, you may encounter difficulties in setting up AMP. While it’s possible to redesign your site to enable to convert to AMP, this is a significant undertaking and not recommended.
Remember, while AMP can be useful, it’s not always feasible to set up.
No Guaranteed Ranking Boost
While AMP can improve site speed, it doesn’t necessarily boost search rankings. Some argue that AMP can positively impact rankings by improving speed, but Google confirms that AMP doesn’t influence rankings.
However, improved user experience leading to increased engagement, decreased bounce rates, and higher click-through rates could indirectly affect rankings.
Moreover, faster loading speeds are always beneficial, so if you can implement AMP without much hassle, it’s definitely worth considering.
Significant Constraints
AMP comes with numerous technical constraints. Coding must adhere to detailed rules, such as JavaScript limitations and CSS file size restrictions (50KB or less).
Sites Unsuitable for AMP
AMP is particularly effective for text-centered static pages.
However, for sites with main content consisting of images or videos, or those prioritizing design, there’s a risk of display issues or malfunctioning. Additionally, due to ad restrictions, there’s a possibility of revenue decline.
Methods of AMP conversion
The method of AMP conversion varies depending on whether you’re using WordPress or not. In the case of WordPress, it may be as simple as installing a plugin, so consider it as an option.
For WordPress Users
WordPress offers various plugins for AMP, such as those provided by the AMP project. Ensure to use regularly updated plugins to maintain security.
For Non-WordPress Users.
For those not using WordPress, there are websites offering guidance and code samples for creating AMP pages, along with updates on new AMP features. It’s recommended to refer to these when implementing AMP for the first time.
If setting up AMP manually, the following elements are essential.
AMP HTML Declaration
<!doctype html>
<html amp lang=”ja”>
Be sure to include the AMP HTML declaration at the beginning.
meta Element Specification
<meta charset=”utf-8″>
<meta name=”viewport” content=”width=device-width,minimum-scale=1,initial-scale=1″>
Specifying character encoding as utf-8 and viewport are mandatory. Both settings are required.
Specification of canonical Tag
<link rel=”amphtml”
href=”https://www.example.com/url/to/amp/document.html”>
The specification of the canonical tag is essential. Additionally, for non-AMP pages, ensure the following specification
head and body Tag Specification
In AMP HTML, specification of the head and body tags is mandatory. While this is usually specified in regular sites, it cannot be omitted, so make sure to check.
Loading Necessary Libraries
<script async src=”https://cdn.ampproject.org/v0.js”></script>
The loading of necessary libraries is required to display AMP. Place this script just above the </head> tag.
Specification of amp-boilerplate Element
<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>
The specification of the above AMP boilerplate code is mandatory.
By specifying the amp-boilerplate element, you can hide content until the AMP JS library is loaded.
Structured Markup
Structured markup is mandatory in AMP. Omitting it will result in errors, so describe it using JSON-LD from schema.org.
Verification of AMP Implementation
With the AMP test provided by Google, you can verify whether AMP implementation is done correctly.
Even if you haven’t deployed it to production, you can test its functionality by entering the code.
Summary
As of now, I don’t believe implementing AMP will lead to an immediate boost in SEO rankings. However, in the future, if users understand that pages with the ‘AMP’ mark load faster when searching via mobile devices, they may prioritize clicking on AMP-enabled pages. This could potentially make it easier for sites with AMP to attract traffic. Therefore, it seems that considering AMP implementation alongside mobile-friendliness is a step towards future SEO strategies.