El AMP y cómo afecta al SEO, Accelerated Mobiles Pages

que es amp

¿Qué son las AMP?

¿Qué significan las siglas AMP?

Sus siglas corresponden al término inglés accelerated mobiles pages, traducible al castellano como «páginas móviles aceleradas».

Definición de AMP (Accelerated Mobiles Page)

Es una iniciativa de código abierto impulsada por Google, y optimizada por la comunidad, gracias a la cual las páginas web pueden visualizarse de la mejor manera posible en los dispositivos móviles. En concreto, acelera los tiempos de carga, lo que impacta muy significativamente en la experiencia de navegación de los usuarios. 

Nació como respuesta al uso cada vez más masivo de los smartphone y las tablets para navegar por Internet.

AMP Source Project

AMP Source Project es el nombre que toma la iniciativa en su inglés original. En palabras de la propia Google en un artículo de su blog, «queremos que las páginas web con contenido rico como vídeo, animaciones y gráficos funcionen junto con anuncios inteligentes y se carguen instantáneamente».

 La idea está clara: poder enriquecer los sitios web que son visitados a través de los dispositivos móviles sin que ello se convierta en un lastre de velocidad.

AMP Dev

Hace alusión a los desarrolladores AMP. Puesto que se trata de un proyecto open source, cualquier programador puede intervenir en el código para mejorarlo. 

De hecho, dichas intervenciones altruistas son las que han transformado y optimizado este lenguaje de marcado desde su nacimiento en el año 2016, cuando Google, Twitter, Pinterest, Linkedin y WordPress apostaron juntos por él.

Especificaciones principales

HTML

Como lenguaje de marcado, solo puede utilizar algunas etiquetas HTML especificadas. El resto están prohibidas y cambian su marcado deliberadamente. Es el caso de , que se transforma en .

JS

Exactamente lo mismo ocurre con Java Script, pues el desarrollo AMP, destinado a diseñar páginas específicas para disposivos móviles, solo permite utilizar las etiquetas JS contempladas en sus librerías.

caché

Emplea una caché propia que valida el marcado tanto HTML como JS y asegura que el contenido insertado a través de estos lenguajes carga apropiadamente rápido. Influye en el motor de búsqueda de Google.

runtime

Porción de JavaScript ubicada dentro de cada documento AMP y cuya finalidad es controlar la carga externa para garantizar que sea tan eficaz y veloz como sea posible. El usuario no quiere esperar demasiado.

AMPD CDN

La CDN es un componente muy importante de los documentos AMP. Se trata de redes de entrega de contenidos basados en proxy que capturan el contenido y lo almacenan para entregarlo más velozmente.

Hermes AMP

¿Para qué sirve?

Para el desarrollo de páginas web que carguen muy bien en los dispositivos móviles y aporten una excelente experiencia de usuario a quienes las visiten.

Pros y contras de implementar AMP en un sitio web

Ventajas

1. Velocidad de carga
Principal aspiración de esta tecnología. Se comprende que los usuarios no tienen mucha paciencia en su navegación móvil y no quiere esperar muchos segundos a que una web rica en contenidos cargue.
2. Mejora la experiencia de usuario
La velocidad de carga web es uno de los factores más determinantes de la experiencia de usuario. Una web diseñada con AMP tiene más probabilidades de agradar y ser revisitada por los usuarios de dispositivos móviles.
3. Páginas adaptadas a dispositivos móviles
Es una tecnología compatible con cualquier dispositivo móvil y con cualquier navegador. Eso implica que los beneficios de los sitios web desarrollados con este lenguaje de marcado mejoran la experiencia de todos.
4. Reduce la tasa de rebote
La tasa de rebote refiere al porcentaje de usuarios que entran en un sitio web y lo abandonan antes de realizar cualquier acción dentro de él, lo que suele suceder a causa de una mala velocidad de carga. 
5. Mejora el bounce rate
La mejora de la tasa de rebote, también conocida como bounce rate, influye en el posicionamiento orgánico en los motores de búsqueda, incluido en Google. Es un aliado en la visibilidad en los buscadores.

Desventajas del accelerated mobiles pages

1. No puedes implementar todo lo que quieras
Esta tecnología no permite la implementación de hojas de estilo externas. Además, también limita el alcance de los lenguajes HTML y JavaScript, lo que puede limitar mucho algunas funcionalidades.
2. No se puede hacer una réplica exacta
Puesto que existen muchas limitaciones en cuanto a los contenidos que pueden agregarse a las páginas AMP; como por ejemplo los llamados contenidos pop-up, no se puede hacer una réplica exacta AMP de todas las páginas de un sitio.
3. Plugins automáticos muy limitados
Estas mismas limitaciones afectan a los plugins automáticos que pueden implementarse en las páginas diseñadas con AMP, lo que conlleva buscar otros mecanismos alternativos más complejos o renunciar a ciertas funciones web.

¿Cómo afecta al SEO el AMP?

Beneficios para el SEO


Dispositivos móviles

Una mayor velocidad de carga web y una mejor experiencia de usuario deberían afectar positivamente al tiempo que transcurren los usuarios en el sitio web y, en consecuencia, desembocar en un mejor posicionamiento orgánico.

Fragmentos destacados
Los fragmentos destacados que Google incluye en sus páginas de resultados, y que tienen tanta visibilidad, suelen ser ocupados por las páginas diseñadas con AMP para los dispositivos móviles. Google las recompensa.

Optimizar recursos del servidor

Incrementa la velocidad de carga porque contiene una versión del sitio web almacenada en caché. Esto reduce la presión sobre el servidor y permite optimizar el ancho de banda, lo que también tiene impacto SEO.

Contras en una estrategia de SEO

URLs diferentes
Los enlaces AMP a la web se muestran ligeramente diferentes en ocasiones, lo que puede afectar a la amigabilidad de las URLS y, por lo tanto, al posicionamiento. La solución consiste en enlazar a las URL’s canónicas.

Aspecto visual
El aspecto visual de las páginas diseñadas con AMP no alcanza el nivel de sofisticación de las convencionales. Esto puede llegar a afectar al SEO dado que el diseño forma parte de la experiencia de usuario.

Contenido duplicado
Guarda una versión del sitio web en caché para mostrarlo más rápidamente. Eso hace que existan dos URLs diferentes con el mismo contenido, lo que puede penalizar si no se canoniza correctamente.

Traqueo del tráfico
Dificulta el seguimiento de las visitas a las páginas a través de Google Analytics. Esto es así porque provoca un hinchamiento ficticio de algunos datos de tráfico debido a su propia naturaleza.

Plugins para WordPress

Plugin Oficial

El plugin oficial para WordPress permite implementar esta tecnología a los sitios desarrollados con este CMS. De hecho, cuenta con la ventaja adicional de posibilitar la integración de plugins preexistentes, lo que reduce ciertas limitaciones naturales.

WeebrAMP

Otro plugin para aplicar la tecnología acelerada a una página web ya preexistente diseñada mediante WordPress. Una manera muy sencilla de transformarla en una página optimizada para la visualización desde dispositivos móviles.

AMP for WP

Plugin cuya principal ventaja es que agrega la funcionalidad de páginas móviles aceleradas automáticamente a los sitios web.

Glue for Yoast & AMP

Glue es una especie de pegamento entre dos de los plugins más populares de WordPress: Yoast SEO, ya que en principio parecen no casar demasiado bien. En concreto, Glue permite que puedan convivir y funcionar adecuadamente juntos.

AMP for stories for WordPress

Plugin que permite crear contenidos visuales a través de mensajes cortos con diapositivas conocidas como story pages.

AMP WP – Google AMP for WordPress

Enésimo plugin que añade automáticamente las funcionalidades aceleradas a tu sitio web en WordPress. Promete una aceleración del 500%.

PWA for WP & AMP

Plugin que implementa la tecnología progressive web apps para que los sitios web parezcan prácticamente aplicaciones.

AMP Toolbox para WordPress

Plugin que complementa el plugin oficial de WordPress: permite añadir enlaces a los artículos, modificar el CSS o reparar averías.

Custom AMP para WordPress

Plugin que complementa el plugin oficial de WordPress: permite configurar el icono, el logo, el ancho de contenido o el template.