AMP (Accelerated Mobile Pages) – .com

In this tutorial we are going to see what AMP is that everyone is talking about, and why Google recommends that you apply it to your websites.

What is that AMP thing?

AMP is an acronym for Aaccelerated mobile Pages. Something you will hear more and more about. Especially because . According to them, the goal is to build a better, faster, and more secure Internet.

That’s all very well, but what exactly is it? Well, to understand it in an easy way, AMP is a more limited simplified version of the web.

AMP pages are programmed with their own language, a variation of HTML, called AMPHTML (the name is very original, there they have herniated thinking).

As an example is worth a thousand words, here you can see an example of a website viewed on an iPhone in HTML and in AMP HTML

Regardless of the design itself, the AMP version removes most of the elements that usually slow down the web, such as everything that is JavaScript, forms, etc. But don’t worry, a large part of CSS is accepted without any problem.

Google says that AMP pages load 15% to 85% faster. Obviously, we must take this statement with a grain of salt, because apart from the fact that it is a very wide fork, it depends a lot on how the web is originally programmed.

This type of pages may remind many of the usefulness of many “reading mode” browsers, or of many RSS readers, which remove “everything that is left over” to leave only the basic content.

Google highlights 4 key points that will be achieved thanks to AMP:

• Quick: True, those pages load much better.
• Nice: Debatable, but you get the idea 😉
• Secure: To use AMP you will be forced to use HTTPS.
• Cooperative: Turns out 🙂

that it is clear that AMP is not the same as responsive.

Adapt or die (exaggerating)

The point is, for better or worse, Google has grown fond of AMP, and has even placed it in Webmaster Tools.

In other words, if you have “vital” features on your page that depend on JavaScript, you can start looking for alternatives for your AMP version.

Google has not yet ruled on whether it will consider AMP as a factor to rank better, but let’s remember that , and I am 100% convinced that it will do the same in this case.

In fact, as with responsive websites, for now it has already begun to “mark” the pages that have it, with the green AMP logo:

It is normal for Google to bet on this technology, because apart from better usability, it also gives the web speed, which is another of the factors we have talked about , , , .

For fans of statistics, don’t worry, because AMP will already incorporate support for Analytics, and work is underway to become compatible with other similar tools.

In any case, tomorrow, Wednesday, February 24, Google will start using AMP on its own search pages, . Be careful, this does not mean that they make any changes to the algorithm, simply that they are going to do what they preach 🙂

In fact, they have already reached agreements with more than 30 reference websites that will also do the same, such as , , , , , or .

Technically, how does this work?

That would be enough for an entire course, but I’ll summarize it for you so that you get the idea easily:

• Our website will continue to be in HTML, the one of a lifetime
• HTML pages on our website that have an “AMP version” must have a tag in the code with an “amphtml” attribute that tells Google where that version is.
• In turn, the AMP pages of our website must have a tag with a “canonical” attribute telling it which HTML page “they came from”, to avoid being seen as duplicate content.
• “AMP independent” pages, that is, pages that do not have an “HTML” version, will have a “canonical” to themselves, so that they are indexed.

To some it may sound like Chinese. If this is the case, don’t worry, because over the next few months we are going to see how hundreds of online services appear that will allow us to create an AMP version of our pages “at the moment.”

In fact, even WordPress already has a plugin that automatically creates an AMP version of all our posts. It’s called AMP and . Just install and activate, and you will have all the technical issue solved, since it will create an AMP version of your posts by adding /amp/ to the end of the URL. If you want to modify the visual appearance, you must do so by modifying the template.php file.

For example, here you have a link to a , and here to its version . These days I am working with several clients with this plugin and other options, I will keep you informed 🙂

Summary and conclusion

AMP HTML is a web authoring language derived from HTML, optimized for webs to load quickly on mobile devices.

Like it or not, this language is here to stay. In other words, read the , and if you want me to do about AMP HTML programming, tell me and I’ll be happy to do it 🙂