Email marketing: what it is and how to implement it

We recently wrote about Yandex turbo pages, which allow you to increase site loading on mobile devices by almost ten times. We continue the conversation and consider a similar technology from its main competitor - Google AMP.

Optimizing Your Mobile Website: An Overview of AMP Pages by Google

The statistics are merciless:  53%  of mobile users leave a site if it takes longer than three seconds to load. People are accustomed to the fast pace of life and do not agree to put up with a long download, especially if they access it from a smartphone or tablet.

Major search engines, Yandex and Google, figured out the trick and almost at the same time rolled out accelerated pages that allow you to optimize the site and increase loading speed at times: at the end of 2016, Google introduced AMP, and Yandex introduced turbo pages in 2017.

By the way, these are different technologies, but they have common principles of work:

1. The site owner creates light versions of the pages.
2. The content is cached on the Google and Yandex servers and is loaded from there, and not from the server where the site is hosted.
3. The source code is simpler than regular pages, the pages contain only text, pictures and some widgets.
4. The correct display of Turbo or AMP pages does not depend on the device.

AMP is no worse and no better than Turbo from Yandex - they are just different, with their own pros and cons.

What is AMP

As we already mentioned, AMP (Accelerated Mobile Pages) are Accelerated Mobile Pages.

Essentially, AMPs are heavily stripped-down versions of regular web pages with a JavaScript library included and special tags needed to load faster on mobile devices.

Such pages are stored directly in the Google cache and, if the connection is broken or the speed has dropped, they are loaded from there. In other words, Google becomes the CDN base for all pages on the site.

That is, we do not physically go to the site, but remain in Google, which loads the content of the selected page for us.

What does an AMP page consist of?

A standard AMP page includes three main elements:

• AMP HTML  is basically just plain HTML, but with limitations for more robust performance and some extensions for media content creation.
• AMP JS  is a JavaScript framework for mobile pages that speeds up asynchronous loading and manages the site. It should be noted that third-party JavaScript for AMP is not allowed.
• AMP CDN  is an additional service for working with content (Content Delivery Network). With it, AMP pages are stored in the Google cache and, on a slow connection, are loaded directly from it.

Optimizing Your Mobile Website: An Overview of AMP Pages by Google

Benefits of AMP Pages

All the benefits of AMP stem from their main purpose - to maximize the loading speed of sites.

• Instant download . It only takes 0.7 seconds, according to Google. In addition, AMP contains ten times less secondary data than the equivalent of a regular mobile page.
• Higher conversion . According to the AMP website, the number of users who complete the targeted action grows by an average of 10-15%.
• Increasing positions in search results . You can get into the photo/post carousel in the SERPs if the page has a metadata structure supported by Google. However, we note that while mobile pages with accelerated loading are not considered a ranking factor, they affect it only indirectly.
• Open source . AMP is an open source platform, so anyone can embed accelerated pages on their site, and it's completely free.
• Advertising opportunities . Accelerated pages increase the click-through rate of ads and the effectiveness of advertising campaigns in general. According to a Google study, AMP saw an 80% increase in visible display ad impressions and a 90% increase in block CTR.

Optimizing Your Mobile Website: An Overview of AMP Pages by Google

Disadvantages of AMP Pages

A spoon of tar. AMP pages are not without flaws that make it very difficult to work with them and spoil the appearance of the pages.

• Stripped down functionality . AMP displays only the main content - text, links, pictures. A variety of "decorations" - widgets, sidebars, comment forms, recommendation blocks, advertisements - are completely absent. The necessary elements have to be “fastened” manually or using plugins.
• Unattractive appearance . The appearance of AMP differs from the base pages not for the better. For the sake of high speed, you have to sacrifice visual appeal.
• Complicated link exchange . AMP greatly complicates the exchange of links: in order for a user to send a link to another user, you need to click a special button that copies the original URL.
• Problems with indexing the main site . Search engines often include accelerated pages in the search results instead of the main ones. For example, Yandex (logically). This is because AMP links to canonical pages with the rel="canonical" attribute.

Most of the shortcomings can be completely or partially eliminated. However, keep in mind that AMP is a simplified, stripped-down version of a site's base page that doesn't require much frills.

Who is AMP for?

AMP is an interesting technology, but only for narrow tasks. Ideal for content projects: where you need to convey information to the user as quickly and in a simple way as possible:

• Information resources (blogs, online magazines, news sites and portals).
•  Online store catalogs (no filters)
• Lightweight mobile version of the site (if it satisfies the functionality)
• Hook pages to interest a person and lure them to the main site.
• Separate sections that do not require high functionality.

For large and complex projects, AMP will not be a replacement for a mobile or responsive version. At least for now.

So if your business is the sale of computers, then transferring product cards to AMP is absolutely pointless. But if at the same time you maintain your blog with unique articles on various topics of computers, then make an AMP version.

The Guardian AMP page

Regular The Guardian page

Who is already using

There are already about 1.6 billion AMP sites on the Internet. The technology is used by many well-known large companies and platforms:

• Ecommerce sites (eBay and AliExpress)
• Publishing platforms (WordPress and Medium)
• Social media (Twitter, LinkedIn and Reddit).

How to implement AMP on the site

Basically, all you need to know is HTML and a little bit of CSS.

An AMP HTML document must include the following components:

• Start with <!doctype html>.

• Contain a top-level <html> or <html amp> tag.

• Contain <head> and <body> tags.

• Inside the <head> container, contain the <meta charset="utf-8"> tag.

• As the href attribute of the <link rel="canonical" href="$SOME_URL" /> tag inside the <head> container, contain a link to the site;

• Inside the <head> container, contain the <meta name="viewport" content="width=device-width,minimum-scale=1"> and <style amp-boilerplate> tags.

• Before the closing </head> tag, contain a <script async src="https://cdn.ampproject.org/v0.js"></scrip> tag to connect AMP JS.

First, we create a separate template for the site using the necessary tags from  the AMP specification . Then, either manually make an AMP version of each new page according to a ready-made template, or set up automatic generation of an AMP page using our CMS.

In order for Google and other systems that support AWP to have the opportunity to switch to the AMR version, in the original article we prescribe a special “link rel” tag indicating the AMR page. Conversely, all AMP pages must have a canonical link tag to the original plain HTML version of the page.

Google's AMP caching mechanism has a built-in validation system to check if pages are working. Make sure that AMP pages are implemented without errors. Otherwise, they will not get into the Google cache, and users simply will not see them.

Check the page for errors  here  and  check out Google's tips on how to fix them if there are errors.

After implementing AMP, you will need to maintain two versions of your pages: the original version as you are used to seeing it on the site, and the AMP version.

The Future of Accelerated Mobile Pages

AMR is only gaining momentum. It is clear that Google will implement it in all their services: Google News, Google Now, Google Play Press, Google Now in tap. The search engine will give preference to pages in AMP format. For example, clicking on a Google News snippet will redirect the user to an AMP page, if available. All partner projects will follow the same logic: Twitter and Pinterest will also open AMP pages on mobile devices.

But still, while the technology is supported only by the search engine itself, the rest are wary of it. Yandex incorrectly indexes AMP pages, and they are not yet included in the Russian-language version of Google's search results (although this is only a matter of time).

By the way, a few years ago, site owners were skeptical about the need to adapt the site for mobile traffic. Today, a mobile version or adaptive layout is a prerequisite for the effective operation of an online resource. It is highly likely that AMP technology will experience the same fate in the foreseeable future.