Qué es AMP (Accelerated Mobile Pages) y cómo funciona

AMP son la siglas de Accelerated Mobile Pages, (que en español puede traducirse por 'páginas móviles aceleradas'), un proyecto implementado por Google y otros socios con el objetivo de mejorar la velocidad de carga de los sitios web en los smartphones.

Google es consciente de la paradoja que representa el hecho de que, aunque la navegación en dispositivos móviles ya hace varios años que supera a la de los equipos de escritorio en muchos países, (en este último año en España el 54,5% de visitas provienen de dispositivos móviles), todavía existen numerosas páginas web que no están suficientemente adaptadas a los dispositivos móviles.

Cuando esto ocurre, la experiencia de navegación del usuario baja considerablemente, en especial en lo que respecta a la velocidad de carga, por dos motivos.

La conexión en dispositivos móviles es más inestable y suele ser más lenta que en escritorio. Por otro lado, los usuarios desean una mayor velocidad cuando navegan con su móvil. 

Esto afecta a la satisfacción y el tiempo que pasan los usuarios en nuestra página, llegando también a repercutir al porcentaje de conversión de leads. Y consecuentemente afecta también al SEO.

¿Cómo funciona AMP?

AMP es un protocolo de código abierto disponible para todas la webs y válido para cualquier contenido, aunque no está tan pensado para la portada de una web o un blog, sino más para sus posts y noticias.

Las accelerated mobile pages tratan de centrarse en el contenido, en el texto, y eliminar otros recursos para así facilitar la carga rápida. Para conseguir esto, se desarrolló un lenguaje específico.

La tecnología AMP utiliza, como el resto de las páginas web, el lenguaje de programación HTML, pero con algunas particularidades. De hecho, este lenguaje ha adoptado un nombre ligeramente diferente: AMP HTML, y se caracteriza por los siguientes elementos diferenciales:

• Solamente es posible usar las etiquetas de HTML permitidas o equivalentes. Por ejemplo, la etiqueta para las fotos, img, puede usarse con la forma img-amp (que permite publicar fotos pero con menos peso, por lo que se cargan más rápidamente). Otras etiquetas, como object o frame, no pueden utilizarse.
• El uso de los recursos JavaScript queda restringido a las librerías de AMP HTML. Por eso, no es posible insertar scripts de terceros o deben ser rediseñados.
• Uso de cachés CDN del propio proyecto, lo cual permite que sea este tipo de servidor el que obtenga las páginas AMP, confirme que su implementación sea correcta y, en caso afirmativo, guarde la respuesta para poder servirlo al usuario en óptimas condiciones.

Para cualquier página puedes tener la versión “normal” y la versión AMP. La versión AMP cambiará de URL. Dependerá de cómo se haga, pero en la mayoría de casos se añadirá “amp” en alguna parte de la URL. No habrá problemas de contenido duplicado, pues la URL canonical de la versión AMP será la versión normal y así lo detectarán los motores de búsqueda. 

De primeras, esta versión AMP sólo se mostrará en los usuarios que entren a través de los motores de búsqueda (y sólo en dispositivos móviles, claro). Aunque podrías configurarlo para que todos los usuarios que naveguen a tu página desde un dispositivo móvil vayan a la versión AMP independientemente del origen de entrada.

¿Cómo implementar AMP en tu web?

Para conseguir que tus páginas sigan el formato AMP y se muestren así en los resultados de búsqueda, debes crear una versión de esa página con el código AMP HTML. En la página oficial del proyecto AMP hay muchos tutoriales y documentación.

Muchos CMSs ya lo crean de forma automática. Por ejemplo, Wordpress cuenta con varios plugins para ello y HubSpot tiene una funcionalidad incorporada para activar este tipo de páginas. 

Para verificar si una página AMP es correcta puedes analizarla con esta herramienta de Google. También podrás verlo en tu cuenta de Google Search Console.

Ventajas y desventajas de implementar AMP en tus páginas

Ventajas

Las principales ventajas de implementar AMP en tus páginas son las siguientes:

Velocidad de carga

Según un estudio de la empresa Kissmetrics, si pasados 3 segundos una página web no aparece correctamente en sus terminales móviles, al 40% de los usuarios se le acaba la paciencia y, al final, sale de esta prematuramente.

Esto es precisamente lo que quiere evitar la plataforma AMP, poniendo los medios técnicos necesarios al alcance de los programadores o responsables de las webs para que puedan optimizar su rendimiento en dispositivos móviles, sobre todo en lo que hace referencia a la velocidad de carga.

Estos son algunos datos concretos que se pueden lograr con el sistema de accelerated mobile pages: 

• Las páginas que utilizan la tecnología AMP se cargan en los móviles hasta un 85% más rápido que las páginas convencionales.
• El promedio de carga estimado de las páginas AMP no llega a 1 segundo.

Con esto, pues, podemos conseguir:

• Que un número más alto de usuarios no abandonen nuestra página y además tengan un mayor engagement, ya que pasarán más tiempo navegando.
• Esto también beneficiará correlativamente a la conversión de leads, ventas, etc.
• De la misma manera, este comportamiento nos beneficiará a nivel SEO. Al tener un menor porcentaje de rebote, también afectará a nuestro posicionamiento en los resultados de búsqueda.

• También debemos tener en cuenta que la velocidad de carga es un factor de ponderación de Google en la SERP, así que cuanto menor sea esta, más fácilmente podremos conseguir un buen posicionamiento.
• Ahora bien, es importante entender que Google no premia a las páginas AMP, sino a aquellas que cargan rápidamente. Por eso, puedes conseguir una buena valoración de este aspecto con una página no-AMP que esté bien optimizada.

Página adaptada para móviles

Por otro lado, otro aspecto que puedes asegurar conseguir con las páginas AMP es una web que a nivel de diseño se adapte a los dispositivos móviles, otro factor fundamental tanto para la experiencia de usuario como para los motores de búsqueda. Pero de nuevo, puedes conseguir este mismo resultado con una página no-AMP.

Si trabajas con un CMS que proporcione la creación de la versión AMP de tus páginas de forma automática, podrás conseguir estos resultados de forma muy rápida, así que te puede servir como vía para tener páginas rápidas y responsive en mobile sin tener que dedicar mucho tiempo y esfuerzo.

Desventajas

Pero con todo, la tecnología AMP también tiene algunos inconvenientes:

• Al usar su propio código, sus etiquetas AMP HTML, sus librerías de javascript, etc., no podrás incluir todos los elementos que quieras. Sí que podrás añadir casi cualquier elemento (como formularios, comentarios, animaciones, CTAs, etc.) pero todo deberá ser incluido o transformado con las etiquetas de AMP HTML.
• Así pues, si usas scripts de terceros, como por ejemplo tracking codes, pop-ups, formularios y CTAs de otras plataformas, etc. no podrás incluirlos en la versión AMP (a no ser que tengan una adaptación AMP, por ejemplo el tracking code de Google Analytics, lo tiene).
• Por este mismo motivo, dependiendo de cómo sea el diseño de tu versión desktop o cómo sea el diseño que has planteado para tu versión mobile, no podrás replicarlo exactamente para las páginas AMP. 
• También debes tener en cuenta que, aunque existan muchísimas etiquetas AMP, si usas un generador automático de versión AMP (con un plugin o configuración de tu CMS) es muy probable que los ajustes sean muy limitados y que por lo tanto muchos elementos desaparezcan y que a nivel de diseño no puedas personalizar muchos elementos.

Cambios recientes

Por último, queremos avisarte de algunos cambios importantes que ha hecho Google con respecto a la forma de mostrar las páginas AMP, ya que puedes encontrar esta información desactualizada en muchas fuentes.

• Antes, en los resultados de búsqueda en Google, podías ver un icono como el logo de AMP (un relámpago) en aquellos resultados que dirigían a una página AMP. Este icono ha desaparecido, por lo que ahora no es posible saber si se trata de una página AMP o no antes de entrar en ella.

• Las noticias de Google (o Top Stories), estaban reservadas a páginas de AMP, ahora ya no.

• Antes, cuando entrabas en una página AMP, la URL del navegador seguía siendo de Google, como en la imagen siguiente. Ahora ya aparece la URL de la propia página (en su versión AMP).

En este artículo hemos visto como la tecnología AMP puede aumentar la velocidad de carga de tu página en dispositivos móviles y, en consecuencia, mejorar su posicionamiento en buscadores.