¿Qué son las páginas AMP y por qué mejoran la experiencia de los ‘mobile users’?

que es páginas AMP

¿Qué son las páginas AMP y por qué mejoran la experiencia de los ‘mobile users’?

Lo bueno, si rápido, dos veces bueno. Esta adaptación del refranero armoniza con las últimas políticas de desarrollo de Google, en ‘guerra’ abierta contra la lentitud de carga en páginas web. Y es que el famoso buscador de Alphabet emplea, desde 2010, la velocidad de carga como factor de posicionamiento web, «no sólo para mejorar su clasificación en los motores de búsqueda, sino también para mejorar la experiencia de todos en internet», como explicó Amit Singhal en el blog de Google.

Advertencias, cambios algorítmicos y herramientas gratuitas como PageSpeed Insights han concentrado los esfuerzos de Google por solucionar este problema. Pero en 2016 la multinacional presidida por Sundar Pichai dio un paso adelante con el lanzamiento de páginas AMP, una iniciativa open source que pretendía frenar el avance del servicio Instant Articles de Facebook y otros competidores.

En los últimos años, sin embargo, las páginas móviles aceleradas (AMP) se han impuesto como una solución eficaz a lentitud de carga, especialmente en aquellas webs con elevados volúmenes de contenido audiovisual. De ahí que BBC News, The New York Times, The Guardian, The Washington Post, Mashable, Gizmodo y otros medios de comunicación muestren una página AMP a sus mobile users. No obstante, eBay, Airbnb y otras plataformas ajenas al sector de la prensa utilizan versiones AMP.

Diseño AMP, una versión ‘mobile-friendly’ para los dispositivos inteligentes

El diseño AMP en páginas web se define como una versión compatible con la navegación mobile. Utilizan códigos open source pertenecientes a bibliotecas públicas (AMP Project de OpenJS Foundation, AMP de Google Developers, etc.), con el objetivo de mejorar la experiencia de navegación y acelerar la carga en páginas web —de ahí su denominación, AMP, por las siglas en inglés de «Páginas Aceleradas para Móviles».

Desde una perspectiva técnica, las páginas AMP operan como duplicados simples de hojas HTML y JavaScript, que contienen lo esencial para visualizar la página web en el menor tiempo posible. Para reducir el número de solicitudes HTTP y aprovechar la memoria en caché, utilizan la red de distribución de contenido de Google Cloud: Cloud CDN.

Esta CDN logra que páginas AMP funcionen rápida, eficientemente. Cuando los ‘robots’ rastreadores de Google detectan la versión AMP de un sitio web, procede a validarla y almacenarla en caché en sus servidores cloud. Desde entonces mostrará a los internautas esta ‘instantánea’ de la página web, en lugar de procesar nuevamente todos sus recursos y códigos HTML, CSS, JS, etc.

que es páginas AMP comparativa

La codificación AMP restringe las etiquetas disponibles y tiende a homogeneizar el diseño web, ofreciendo una mejora en la velocidad y la navegabilidad a cambio.

Aunque fuera de dudas, la efectividad del diseño AMP queda patente en una estadística aportada por Rudy Galfi, gerente del Proyecto AMP de Google: el promedio de carga del contenido en webs con versión AMP es de 0,7 segundos, mientras que el tiempo requerido para cargar estas mismas páginas sin dicha codificación alcanza los 22 segundos.

A través de Google Developers y otras plataformas asociadas a su buscador, Alphabet Inc. ha fomentado la propagación de versiones AMP, con la doble finalidad de optimizar la navegación desde móviles y de aumentar, a su vez, el rendimiento de sus anuncios display en estos dispositivos. Como explicó David Besbris en un conocido artículo del blog de Google, se pretende que «el contenido enriquecido como videos, animaciones y gráficos funcionen junto con los anuncios inteligentes y se carguen instantáneamente». Es importante, asimismo, que «el mismo código funcione en múltiples plataformas y dispositivos, para que el contenido pueda mostrarse en todas partes en un instante, sin importar el tipo de móvil, tableta o dispositivo utilizado».

Un vistazo a los múltiples beneficios de las páginas AMP

Tiempos de carga relámpago

Incrementar la velocidad de carga es su objetivo, su razón de ser. El diseño AMP utiliza el almacenamiento en caché de Google Cloud y las hojas HTML reducidas para cargar instantáneamente una versión simplificada. De este modo los internautas permanecen un tiempo mínimo en la ‘sala de espera’ de una página web, lo que aumenta sus interacciones dentro del sitio y disminuye métricas tan perjudiciales como la tasa de rebote.

Menores tasas de rebote

La lentitud de carga exaspera incluso a los internautas más pacientes, motivo por el que incrementa, por lo general, KPIs como la tasa de abandono y la tasa de rebote y minimiza el tiempo de permanencia en el sitio web. La implementación de páginas AMP revierte estas métricas negativas, al acelerar los tiempos de carga durante el acceso a la home y durante la navegación interna. Y dado que los usuarios perciben positivamente la inmediatez, también repercute en las conversiones. Nada más beneficioso, pues, para la UX de tus clientes que crear páginas AMP.

Fácil implementación y personalización

Pese a suponer una pequeña revolución para los mobile users, la codificación de páginas AMP no interfiere en las hojas HTML, JS y CSS existentes, siendo innecesario rediseñar ab ovo el sitio web. (No obstante, cada vez más desarrolladores recomiendan crear las versiones de escritorio, móvil y AMP de manera simultánea, para así facilitar su integración).

La implementación manual requiere un proceso sencillo, accesible a los conocimientos del desarrollador promedio. Al uso de plantillas específicas (AMP HTML y AMP JS) se suma la estructuración de códigos CSS y JavaScript; los primeros se insertan dentro de la etiqueta » en el », mientras que en los segundos se recurre a equivalencias AMP disponibles en las bibliotecas de WebComponents y Custom Elements de Google Developers. Además, las páginas AMP emplean, para la integración de contenidos audiovisuales, tags específicas como ‘amp-img’ o ‘amp-video’.

Pero las páginas AMP en WordPress, Joomla o Drupal pueden implementarse y personalizarse con el uso de aplicaciones, pensadas para simplificar esta tarea. Además del plugin oficial ofrecido por AMP Project Contributors, los desarrolladores de WordPress disponen de ‘All in One SEO Pack’ y ‘PWA for WP & AMP’. CMS como Joomla cuentan con extensiones como ‘wbAMP’, ‘JAMP’ o ‘Accelerated Mobile Pages’, mientras que Drupal ofrece su módulo ‘Accelerated Mobile Pages’.

que es páginas AMP usuarios

La velocidad de carga repercute en KPIs clave como las interacciones internas, las tasas de rebote o el tiempo de permanencia en el sitio.

Incremento del ‘engagement’

Las interacciones dentro del sitio web aumentan con el uso de páginas de AMP. Un estudio de DoubleClick realizado a 150 webs reveló que el 90% de los encuestados experimentó incrementos de las métricas de engagement gracias a la codificación AMP.

Esta mejora en las interacciones —medibles a través del tiempo de permanencia, las páginas vistas y otras KPIs— conduce a un aumento paralelo de las conversiones y la retención de clientes. Esta correlación es perfectamente lógica: si un usuario puede navegar cómodamente por un sitio web y disfrutar de sus servicio con la rapidez deseada, preferirá adquirir productos/servicios ahí en lugar de acudir a este competidor que demora 2-3 segundos en cargar.

Mayor visibilidad web

Con la actualización algorítima Speed Update en 2018, Google aupó en sus SERPs a las webs con versiones mobile de carga rápida, en perjuicio de las páginas con peor rendimiento en estos dispositivos. En muchos casos las ‘víctimas’ de esta novedad coincidían con páginas sin AMP. De ahí que el uso de esta codificación sea una forma excelente de lograr una mayor visibilidad online para los usuarios móviles.

Desde una perspectiva SEO, crear páginas AMP es beneficioso para las webs listadas en el Mobile First Index. Este subranking de Google, dedicado a las versiones mobile de páginas web, ha cobrado una gran relevancia en los últimos años gracias al fenómeno del comercio móvil o el auge del comercio social.

Un plus para el rendimiento de la publicidad ‘display’

La codificación de una página AMP es beneficiosa para el rendimiento de los formatos publicitarios de Google Ads. Y es que la lentitud de carga también lastra el desempeño de los anuncios display, limitando el potencial monetario de portales de noticias y medios de comunicación para los mobile users. A propósito de este punto, quizá te interese conocer estos trucos de Google Ads para mejorar tus campañas de marketing.

¡Cuidado! Una página AMP presenta desventajas a considerar

¿Son indispensables las páginas AMP? Diversos estudios avalan la necesidad de implementarlas. Y es que el 53% de los usuarios abandonaría una página web si tarda 3 segundos en cargar, según una encuesta de Double Click. La plataforma Kissmetrics, por su parte, reduce este porcentaje al 47% cuando la demora se reduce a 2 segundos.

Una página AMP presenta, sin embargo, desventajas nada halagüeñas para los desarrolladores web. Sacrifican una parte de su control sobre el contenido original y la personalización, por ejemplo. Aunque esta tecnología open source permite adaptar los parámetros básicos de la plantilla, suponen renunciar a una gran número de etiquetas y códigos diferenciadores. En una palabra, las páginas AMP tienden a homogeneizar el diseño web.

Por otra parte, el proyecto AMP opera al margen de los estándares de W3C (World Wide Web Consortium), un conjunto de protocolos y lenguajes de uso referencial para la comunidad desarrolladora.

Con sus virtudes y defectos, la codificación AMP aparece como una solución eficaz a la lentitud de carga en tablets y smartphones. A fin de cuentas, «lo bueno, si rápido, dos veces bueno», ¿verdad?