• jmtalarn.com

    The site home index page.

  • Web dev notes

    Web Dev Notes: Where I jot down tech insights, resources on technology and web development and handy tips to remember.

  • CV

    Explore my CV to learn about my background, experience, education, certifications, and projects.

How to activate Google's AMP and what they are

amp, web, html
Guest post, Web development
12, September 2018

How to activate Google's AMP and what they are

Do you know the Accelerated Mobile Pages or AMP? This new format optimized for mobile devices has numerous advantages, one of them is the improvement of web positioning. Do you still think that you should not have it implemented on your website? Today I'm going to explain how to activate the AMP, configure these pages and everything that surrounds this Google project.

What is AMP from Google?

There is no debate anymore, our favorite device is the mobile, we use it for everything. In most cases it has replaced the mp3 player, the wristwatch, the calculator, in some cases the books, even the teles! And of course we use it to socialize.

Having said this and understanding the importance of mobiles when surfing the Internet, the topic we're going to talk about today makes a lot of sense.

That 32% of traffic from smartphone is the indication that every day users access more information from these devices, which depending on many factors tend to have slower connections than for example, a laptop or desktop computer properly connected to a Wi-Fi or cable network. We must take this into account when thinking about the speed of loading web pages in mobile browsers, right?

This loading speed affects all those webmasters who, above all, live on the advertising of websites or subscriptions. To put a solution and get web pages from mobile load as fast as they never had before , the Digital News Initiative was created, a project in which Google, jointly with large media, launched an Open Source initiative that we know like AMP or Accelerated Mobile Pages (accelerated mobile pages).

Now, what are the MPAs? These are optimized web pages, with lighter versions to ensure that the loading speed increases considerably. It is based on the AMP HTML technology, a new format that allows pages with multimedia content to load instantly for correct viewing on mobile devices.

This Google solution is somewhat similar to Apple News or Facebook Instant Articles.

You may have already come across an AMP website. In addition to its design you can identify them through the URL, since at the end of it they have a built-in / amp.

The only difference between the two is the end of the link. If you agree, even if you do it from a computer, you can see the particularities of the AMP of that post, it is much simpler, without plugins, without menus, only with the basics to read the content.

Why do AMPs load so fast?

To make AMP pages load faster there must be sacrifices , which ones? Well, obviously the first victim is the design that is shown in a much simpler way, without the customizations of the Theme of the web turn. Of course, the design offered by AMP is simple and not at all ugly. AMPs are focused on the content, so everything that does not contribute to it goes away, there is no JavaScripts and the CSS it uses is very minimalist, everything to load faster than Billy the Kid.

Are the MPAs for you?

Although initially this initiative was promoted to favor the big media, publishing and technology companies, the MPAs are practically for everyone , I would say that much more than the Instant Articles of Facebook.

If you have a website where you post content, a personal blog, a corporate blog ... AMPs are for you. Everything that improves the speed of loading, optimizes your site and improves the user experience is good for your blog, for Google and therefore, for web positioning .

Another story is if you manage an ecommerce or a web that only consists of a Home or several other pages in which certain content is imperative that is displayed as it is. In these cases the AMP may not be for you , however, you must optimize in other ways so that the loading speed is not a problem .

Activate AMP for SEO

At this point you will intuit that implementing AMPs greatly enhances the loading speed of a web page, which in turn improves the SEO of said web. I would like to share the case study of one of my client’s brand named SkWebDesingingSolutions, after implementation of AMP they have got unbelievable improvement in SEO. Most of their web pages ranked top 10 after this implementation.

AMPs are good friends with SEO because of the following:

  • Google has affirmed that the websites with AMP versions will have benefits in the SERPs.

  • In addition to rewarding you for having the responsive website, now Google will reward you for having the web completely optimized for mobile devices.

  • Eliminating all multimedia and JavaScripts, and focusing on the content, with the AMP of Google you offer articles that will position better thanks to the semantics.

  • You will have more accessible content and a better user experience and that Google likes a lot.

  • Your upload speed will improve substantially, adding points for Google.

How to activate AMP for WordPress sites?

If you manage a website created by WordPress you are in luck: activating the AMP in your blog or web is quite simple and without touching code. ??

Simply look for the AMP plugin and install it, it is totally reliable, created by Automattic. Once installed and activated, the AMP pages of your blog or website will be enabled. To check it, you can even from the computer, take any URL from your website and add it to the end / amp or? Amp = 1, depending on the type of structure of the permalinks. If the new format appears, simpler and optimized, you have it ready!

How to know if Google is considering your MPAs?

To make sure that Google is recognizing the pages with AMP format of your web, you must access your session in Google Search Console (Google Webmaster tools) and open the Accelerated Mobile Pages tab. Here you will see the number of pages you have indexed with this format, in addition to the pages with errors.

What are these errors?

It is appreciated that Google warns of these errors and tells you what they are about. It turns out that the websites for AMP format should follow structured data guidelines , Schema.org and Rich Snippets and HTML specification for AMP . Stay tuned for your Search Console and watch the errors that appear.

Another way to validate MPAs

On June 8, AMP Project presented an extension for Google Chrome that allows you to easily know if the page you are visiting has its version in accelerated pages format. It is called AMP Validator , and after installing in your browser you will know if the web page:

  • Does not have AMP version

  • It has AMP version available

  • It has AMP version and you are in it

Appearance and personalization of MPAs

You may be thinking that the design of pages with AMP format is far from the original design of your website, that design that took you so long and of which you are so proud. It is normal to worry, the results of the AMP get all the websites are the same, it is like going out on the street and that everyone is the same dress, from the feet to the head.

If you want your website, even with AMP version to continue to differentiate you can modify parts of the design, yes, depending on the changes that you implement, you can do that it is very high loading speed is not so incredible.

There are ways to modify the appearance of the AMP of your website , one of them is touching code, but as there are many people who do not know how to touch a single line, we will see an option to do it without technical knowledge:

Google Analytics in AMP

In order for your Google Analytics account to correctly count your AMP results you must do a couple of things, very simple, too, with the plugin seen in the previous point.

  • We access the options of the plugin in the left sidebar and go to 'Analytics'. In this case we want to activate Google Analytics (although there are other services available such as Chartbeat or Parsely).

  • We chose Google Analytics and activated it. It will be necessary that you have the tracking code (UA - XXXXXXXX - X) and your active Google session nearby.

If you use Yoast SEO on your website , I also recommend that you install the Glue for Yoast SEO & AMPplugin . It is a Yoast extension that adds options to configure the AMP pages, both the appearance and the tracking in Analytics. Its your choice!

Blog post