What are Google AMP pages and how to create one?

faster mobile websites amp google

If you have heard on more than one occasion of the Google AMPsbut you don’t know what it is, what it does for web pages or how to implement it on your website, we tell you everything you need to know about this Google technology designed to enhance the experience of use of these websites by users who access from their mobile device, something that is on the rise.

Every time we connect more from the mobile or tablet and we appreciate that the web pages are optimized for a more comfortable reading. Google’s AMP seeks to go further by providing a faster charging, although it should not be confused with a “responsive” functionality. Find out what it is, how it works, advantages and disadvantages and how to implement it on a website.

What are AMP pages?

The AMP pages were announced in 2015, although they did not start to work until 2016, when mobile data networks were not like the current ones and this became an alternative to access web pages faster with slower or unstable connections. Pages that use the AMP framework omit some types of content that become heavy so that the pages load before.

Content text and main elements as images are still maintained, but other elements may be missing. For example, CSS or JavaScript are removed so that what is considered essential is prioritized. Therefore, you will not see forms, animations or other elements that suppose a slower load on the web.

This is available for any website, so you can install it on your website if you wish. Despite this, it is not the best option for e-commerce pages or some corporate websites in which elements that are essential for its proper functioning are eliminated. It is recommended that if you implement it, you put a rel=canonical tag to notify Google that the AMP version of your pages has a source page.

How do they work

AMP (Accelerated Mobile Pages) is a open source web technology developed by the AMP Open Source Project and implemented by Google for optimal viewing of web pages on any mobile device. It consists of a framework that focuses on creating optimized websites that can load quickly on smartphones and tablets. The main objective is to improve the mobile user experience.

this framework is based on the HTML code, but also contains CSS and JavaScript elements. First of all, there is this code AMPHTML and on the other the AMP js which works to prevent external JavaScript from loading, but the AMP libraries do. Thus, unnecessary elements that take time to load are eliminated, although you may see some necessary ones.

In this way, Google controls the web since, despite being open source, the content served from their servers and is controlled by the company. This is because when it crawls the web, it checks that it complies with technology standards and automatically includes it in its cache. Thus, when someone does a search, it collects the content from your CDN server.

Why use it?

The main benefits of this technology are found in its charging speed, much higher than in other developments. This helps website owners and online businesses get much better to all users who connect from mobile devices, especially those who do not have a good internet connection. It has been proven that the pages with this technology have a charge less than one second and a reduction of 3 times with respect to its version without it.

In addition, it provides a better positioning in Google results from mobile devices as it is optimized for them, something that is of great concern since this is what allows it to reach many more people. Keep in mind that mobile visits represent a higher percentage each time, so it becomes essential to think about improving the positioning focused on them. Of course, since 2021 they no longer require it to give them more preferential treatment as in the beginning.

Another of its advantages is that it allows comfortable reading to users who connect from their mobiles or tablets, which encourages them to stay longer reading the website and reduce bounce rates, something that also influences the SEO of the website.

google amp

Disadvantages and detractors

There have been many who have criticized this technology for different reasons, from the control by Google of the websites that used it, the preferencial treatment that websites with AMP had in mobile results, the javascript removal external when it was used and many others. In fact, at first, a speed tag was displayed in mobile search and only pages with this technology appeared in the news carousel, which almost forced many services to use AMP, although in 2021 they decided to eliminate these options.

google speed amp

One of the main disadvantages is that this version is less attractive, visual and sometimes without elements that its developers consider vital for being part of the personality of the web. In certain cases, even less functional, by eliminating forms, shopping carts and other elements necessary for certain web pages, so it becomes more of a solution for content pages text, news, blogs and the like. In addition, it is interesting to know that they contain less advertising space, something inconvenient for those who want to monetize their websites.

How to implement AMP on my website

Although this technology is no longer necessary in many cases, especially on web pages that already provide good loading speed, and this is demonstrated by Google deprioritizing it in its mobile searches and allowing other pages in its news carousel, it may be that Interest you implement this technology on your website because the benefits convince yous that it provides you or because you like its result.

For create your first AMP page from scratch you will have at your disposal the guide of the official website in which you will discover basic concepts of an AMP page. If you follow the steps you can learn to create it, check if it is valid and publish it on the network. It is interesting that you know all the information of their guides and tutorials to discover how to do it step by step.

learn to create webamp

On the web you can also see examples, templates, reference documents, tools to facilitate its use and much more. If you want more resources, you are also interested in this GitHub address.

On a website with WordPress

If your website is developed in WordPress, you can have it very simple, since there is a plugin that makes all your posts generate AMP-compatible versions by adding amp at the end of their url. To start using it, you just have to go to your WordPress website, in administration and give add plugin and search for it. You need the original plugin, which is this. If you want to modify the visualization and aesthetics of the web can you help AMP for WP – Accelerated Mobile Pages.

plug-in amp

Once you have installed it, you can take advantage of its features to your advantage by exploring the different options it provides. don’t forget the rel=”canonical” to avoid SEO penalties for being considered duplicate content. Then you only have to customize the website according to your requirements and that’s it.