Accelerating your mobile web with AMP

Tuesday, February 21, 2017

Accelerating your mobile web with AMP

We have known for a long time that web traffic from mobile devices has increased significantly, even shadowing desktop computers. We must recognize it, the mobile devices are almost always within our reach, providing us with that facility of being able to consult the information that interests us at any time and almost anywhere.

The information that users consume from their tablets and smartphones is not only composed of text and images, but also by other formats, such as video. With this diversity of formats, so that the user experience in these devices is the most satisfactory possible, in web development it is usual, not to say essential, to include aresponsive version , that is, a version of the web capable of adapting to the device From which it is being displayed, by modifying the appearance of the page.

This growing trend in the use of mobile devices to consume information has led to a change of strategy in web development; Not only the design of the page is especially important in these cases, also the loading speed of the page plays a fundamental and delicate role , and therefore the responsive version is given special attention, since its design still depends on the Original development for desktop computers; In addition, it must be taken into account that its objective is more focused to offer flexibility.

The importance of speed in SEO positioning

The main factor that contributes to the abandonment of a website is the loading speed of its pages. According to a study by Google, 53% of users will abandon it if it does not load in less than three seconds. This does not seem to be a very desirable scenario for the vast majority, either users or companies or content publishers, especially if the site is an online commerce, since the impact on sales would be very negative, and need not tell you What happens if an eCommerce does not reach the goals set.

It is clear then that the loading speed of our web is a factor to take care of, even more since Google began to maintain its importance for the positioning of the same in its search engine.

Maybe you do not hear the term Web Performance Optimization (WPO), or maybe yes, if you usually stay in touch with web technology, in any case, you should pay attention, since this set of techniques is widely used by marketing experts to Develop SEO strategies to improve our positioning in search engines.

The WPO techniques are aimed at the analysis and subsequent optimization of the performance of a web page for better loading times, and to achieve this it carries out actions both in the web itself and in the configuration of the server.

With what we have just seen we have enough elements and enough work ahead to optimize our page, improve its positioning and offer a better user experience to our audience, but given the importance of using the mobile ...

Would not it be great to be able to offer these devices even more in terms of loading speed?

Tread the accelerator on the web

In October 2015 Google introduced AMP (Accelerated Mobile Pages), an open source project that aims to speed up the loading time of web pages on mobile devices.

AMP was born with the idea of offering to the mobile devices a very optimized method that delivers the static content of a web page at high speed. What the mobile device gets is a very basic version of the page, but with all the relevant content of the same, ie only information, without features.

Do not confuse AMP with responsive design, both have different goals. While the responsive focuses on redesigning the design to work on any mobile device, AMP does it in speed.

AMP is ideal for applying to static content , such as news, blog entries, information pages, etc. AMP does not replace the responsive design, since the latter still offers functionalities like forms, animations, AJAX queries and more than AMP can not carry out due to its limitations; It is not even possible to include forms, and the JavaScript library it includes is very limited.

Responsive version AMP Version

And what about the results?

In the first tests with AMP, the results showed a reduction in the loading time of between 15% and 85%. Not bad at all, right?

AMP consists of three parts:

AMP HTML

This is basically HTML, but with certain custom properties. While most HTML tags are common tags, some of them have been replaced by specific AMP tags, called HTML AMP components.

AMP JS

Provides the JavaScript resources required for AMP HTML components to work. Among the improvements that stands out is the transformation into asynchronous all those calls to external resources, ensuring that no element of the page can block the presentation.

Google AMP Cache

Google provides its own Content Delivery Network (CDN) for the delivery of all valid AMP content. To do this, it caches the AMP pages and optimizes them. It is important to note that for AMP HTML content to be validated, it should not contain external resources; Everything should be served from the same source using HTTP 2.0.MP

Do I need AMP for my page?

AMP is a technology that comes to meet a very specific need, serving content on mobile devices as fast as possible.

If your website offers content oriented to mobile users, it is quite likely that AMP provides a better user experience, however, as I told you before, AMP is very limited, and if you are concerned about the loyalty of your users, the fact Avoiding elements like contact forms and even functionalities implemented with JavaScript, will make this new technology not help you.

If you decide to implement this technology in your page, you can do it by creating AMP format pages using the elements that make up this technology, or also using any of the available plugins if your web is developed on a CMS like WordPress or PrestaShop.

You already know the AMP project and what you can contribute, but you should also know that it is not a standard, but that it is only a project, so nobody can guarantee your continuity in the future; But to tell the truth, promises enough seeing their results.