Guía detallada de AMP: las páginas móviles aceleradas de Google

¿Cómo funciona AMP ? ¿Cómo crear y personalizar páginas móviles aceleradas? ¿Qué herramientas pueden usar los propietarios de sitios en CMS populares, incluidos WordPress, Joomla!, Drupal, OpenCart? ¿A qué dificultades se enfrentan los webmasters al implementar AMP y cómo resolver los problemas?

¡Consulte las respuestas a estas y otras preguntas en el siguiente manual!

¿Qué es AMP y cómo funciona?

AMP significa páginas móviles aceleradas. El término significa la tecnología de visualización de páginas de un sitio para usuarios móviles que proporciona la máxima velocidad de carga del sitio.

AMP es una versión radicalmente truncada de las páginas web convencionales. En las páginas aceleradas se mantiene el contenido principal. La mayoría de los elementos auxiliares, incluidos widgets, formularios de comentarios, bloques de contenido recomendado, anuncios tradicionales están ausentes en las páginas aceleradas.

Accelerated Mobile Pages es una plataforma de código abierto y un proyecto liderado por Google. Por lo tanto, cualquier persona puede utilizar esta iniciativa de forma gratuita.

El inspirador ideológico y portavoz del proyecto es Google. El motor de búsqueda más grande del mundo utiliza páginas AMP para mostrarlo en las páginas de resultados de búsqueda (SERP). Además, Google almacena en caché páginas optimizadas para dispositivos móviles aceleradas y actúa como CDN para ellas. Debido a esto, los usuarios de dispositivos móviles descargan rápidamente contenido de AMP incluso con una conexión de datos de baja velocidad.

Este diagrama y explicación, de Whiteboard Friday de Will Critchlow, simplifican el proceso:

Las páginas aceleradas consisten en marcado HTML con etiquetas especiales y la biblioteca de JavaScript dedicada.

• AMP te obliga a usar una versión optimizada de CSS;
• Javascript no está permitido en absoluto;
• Se ve obligado a utilizar una biblioteca Javascript lista para usar que AMP le proporciona, lo que obliga a sus imágenes a cargar de forma diferida.

En la página de AMP, puede usar un conjunto limitado de etiquetas y scripts. Esto reduce la funcionalidad y el atractivo externo de las páginas, pero aumenta drásticamente la velocidad de carga. Además, el tiempo de carga de la página se redujo gracias a la tecnología de almacenamiento en caché previo de Google.

Los internautas pueden utilizar AMP de dos formas fundamentalmente diferentes. El primero consiste en transferir datos del servidor del propietario del sitio a la computadora del visitante y mostrar la versión acelerada de la página en el navegador. Por ejemplo, en un sitio habilitado para AMP, puede configurar la redirección automática de todos los usuarios móviles a páginas aceleradas. El visitante puede acceder al AMP mediante el uso de un dispositivo móvil o agregar el sufijo "/amp" a la URL en la barra de direcciones del navegador.

El segundo método consiste en ver la versión en caché de AMP desde un servidor de Google.

El motor de búsqueda más grande del mundo muestra enlaces a páginas aceleradas en formato de carrusel en SERP o marca el contenido de AMP con un icono del logotipo de AMP.

Al visualizar la página, el usuario no accede al sitio sino que navega por el mismo contenido de la página del editor.

Desafortunadamente, Google no considera necesario mostrar carruseles de AMP en las páginas de problemas generados para estos dispositivos. Por lo tanto, gracias a Search Engine Land por un ejemplo.

¿Vale la pena usar Accelerated Mobile Pages?

Para responder a esta pregunta, debe prestar atención a las ventajas, desventajas y resultados de la implementación de AMP.

Ventajas de AMP

La principal ventaja de AMP es la espectacular optimización de la velocidad de carga. La tabla muestra los resultados de probar la versión AMP básica y acelerada de una página por un par de servicios de métricas populares.

La baja velocidad de carga afecta negativamente la experiencia del usuario. Más de la mitad de los visitantes no esperan más de 3 segundos a que se muestre el contenido. Las páginas aceleradas se cargan mucho más rápido que las estándar.

Esto es posible gracias a una reducción significativa en la cantidad de datos transferidos mediante la tecnología AMP.

Además, si un sitio de compras en línea gana $100,000 por día, una demora de 1 segundo en la página podría costarle $2.5 millones en ventas perdidas cada año.

La carga rápida es crucial para los usuarios de dispositivos móviles. Es por eso que Google almacena previamente en caché AMP y actúa como un CDN para las personas que usan Internet lento.

La velocidad de carga y la experiencia del usuario con el sitio web es uno de los principales factores de clasificación de Google. ¿Accelerated Mobile Pages en sí proporciona ventajas adicionales en el ranking de Google?

A mediados de 2016, en el Search Engine Journal Summit de Google en Chicago, el portavoz de Google, Harry Illes, dijo que las páginas móviles aceleradas no se encuentran entre los factores de clasificación. Pero el representante de Google no pudo decir sin ambigüedades que AMP no será un factor de clasificación en el futuro.

¿Qué significa? La tecnología AMP por sí sola no le da a los sitios la ventaja de la clasificación. Sin embargo, aumenta significativamente la velocidad de carga del sitio, lo cual es tenido en cuenta por Rankbrain que analiza los factores de comportamiento para el algoritmo de clasificación de Google.

Los sitios de noticias y los proyectos de contenido se benefician de la implementación de AMP cuando ingresan al carrusel de AMP. Este elemento se muestra en la parte superior de la SERP encima de los resultados de búsqueda. Esto proporciona a los editores clics adicionales e indirectamente mejora la clasificación en los motores de búsqueda y SEO.

Entonces, la principal ventaja de las páginas aceleradas es la alta velocidad de carga. Mejora la experiencia del usuario y puede influir indirectamente en las posiciones de los sitios en el SERP de Google. Además, los recursos pueden recibir vistas adicionales gracias al carrusel AMP.

Desventajas de las páginas móviles aceleradas

AMP tiene algunos inconvenientes. Aquí están los principales:

• Los visitantes de las páginas de AMP no son rastreables por el código estándar de Google Analytics en la versión principal del sitio web. Para realizar un seguimiento de las vistas y los visitantes de AMP, debe agregar un código de seguimiento dedicado a las páginas de AMP. Puede hacerlo fácilmente con el complemento Glue for Yoast SEO & AMP.
• Las páginas aceleradas tienen una funcionalidad reducida en comparación con las básicas. Todos los módulos clásicos como el menú de navegación, un bloque de publicaciones relacionadas, la barra lateral, el formulario de comentarios deben agregarse manualmente o mediante complementos.
• En aras de la alta velocidad de carga, sacrificas los efectos visuales del sitio.
• Si Google muestra las páginas aceleradas del sitio en el carrusel, los usuarios pueden leerlas sin salir de la SERP.

Por la alta velocidad de carga, debe pagar el precio de la funcionalidad y la apariencia de las páginas. Vale la pena señalar que la mayoría de las deficiencias se pueden eliminar total o parcialmente. Sin embargo, AMP siempre seguirá siendo una versión simplificada de la página base del sitio.

Resultados de la implementación de AMP

Google reconoce rápidamente AMP en un sitio web. La información sobre las páginas de AMP indexadas aparece en la sección de Search Console "Aspecto de búsqueda >> Páginas móviles aceleradas" varios días después de la implementación de AMP en el sitio.

Casi inmediatamente después de la indexación, Google enviará tráfico a la versión AMP de su sitio. A finales de mayo de 2018, aproximadamente el 50 % de los visitantes acceden directamente desde Google a la versión acelerada de la página en lugar de a la básica. Aquí hay algunas estadísticas interesantes:

• Dentro de una semana del 20 al 26 de mayo, 1812 visitantes llegaron al sitio de prueba de Google.
• 1011 de 1812 personas son usuarios móviles.
• 842 usuarios de Google han aterrizado en páginas móviles aceleradas.

Usando el ejemplo de un recurso en particular sin pretender ser representativo, está claro que Google voluntariamente envía visitantes a las páginas de AMP. En las páginas aceleradas del motor de búsqueda llegó el 46% del número total de usuarios o el 83% de los usuarios móviles. El 17% restante de los propietarios de teléfonos inteligentes y tabletas accedieron a las páginas básicas con diseño adaptable.

Estos son los datos a los que debe prestar atención:

• La tasa de rebote de las páginas móviles aceleradas es significativamente más alta que la de las páginas estándar. Según Google Analytics, alcanzó el 86% frente al 55% de las páginas normales. Esto puede deberse al seguimiento incorrecto del rendimiento de las páginas aceleradas por parte del servicio Google Analytics. Cuando un usuario pasa de AMP a una página básica, el sistema de monitoreo cuenta una nueva visita. En este caso, la tasa de rebote de las páginas aceleradas aumenta y la profundidad de la sesión disminuye.
• La proporción de páginas por sesión para los visitantes de AMP es menor que para los visitantes de páginas adaptables o páginas normales. Es mucho menos probable que los usuarios se muevan a otras páginas del sitio utilizando una sección de publicaciones relacionadas que los visitantes de las páginas normales.

Después de la implementación de AMP, hubo un ligero aumento en el tráfico de Google. La dinámica de crecimiento moderado del tráfico de búsqueda se ha mantenido.

Para evaluar los resultados del uso de AMP, solo un recurso con una asistencia promedio de Google de aproximadamente 150 visitantes únicos por día no es suficiente. Por lo tanto, vale la pena recurrir a la experiencia de otra persona. Aquí hay algunos datos interesantes:

De acuerdo con los resultados de la investigación, Google declaró la mayor eficiencia de los anuncios contextuales en AMP en comparación con las páginas básicas. El bloque de AdSense que se muestra en la parte visible de la pantalla creció un 80 % y el CTR de los bloques de anuncios aumentó un 90 %.

Datos curiosos de Search Engine Watch. Wired Magazine recibió un aumento del 25 % en los enlaces CTR en los resultados de búsqueda gracias a AMP. Y la posibilidad de hacer clic en anuncios en páginas aceleradas creció un 63 %. La asistencia mensual del sitio de la revista Slate creció un 44% luego de la implementación de AMP.

Los representantes de CNN en una entrevista con The Wall Street Journal dijeron que AMP y las páginas básicas se monetizan con la ayuda de la publicidad con la misma eficacia.

AMP se carga mucho más rápido que las páginas básicas. Pero hay que sacrificar la funcionalidad y apariencia de las páginas. En el sitio de prueba, no hubo un aumento repentino en el tráfico después de la implementación de AMP. Sin embargo, Google dirige cada tercer visitante en un total de dos de cada tres usuarios móviles a páginas aceleradas, en lugar de páginas estándar del blog de prueba.

Algunos webmasters consideran que AMP es un capricho innecesario de Google, por otro lado, muchos editores en Internet informan un aumento en la cantidad de visitantes a los sitios y aumentan la efectividad de los anuncios. Esta información lo ayudará a decidir por sí mismo si desea utilizar páginas móviles aceleradas.

Cómo instalar AMP en WordPress

Para la suerte de los usuarios de WordPress, las páginas móviles aceleradas se pueden implementar en un minuto. Para hacer esto, debe instalar y activar el complemento AMP para WordPress del equipo de desarrollo de WordPress. El complemento AMP de Automattic no tiene configuraciones, sin embargo, funciona perfectamente en una publicación de blog normal y es compatible con casi todos los temas de WordPress.

Puede probar su página de AMP en el validador de AMP.

Para ampliar la funcionalidad y mejorar la apariencia de las páginas AMP, recomendamos usar un AMP alternativo para el complemento WP. Después de instalar y activar el complemento, vaya al menú de configuración de la página rápida en el panel de administración.

En la sección General, si es necesario, cargue el logotipo del sitio. El tamaño de imagen recomendado es de 190×36 px. Con el botón Redimensionar, puede especificar un tamaño arbitrario del logotipo. A diferencia del complemento AMP en WordPress de Automattic, si necesita versiones AMP de páginas estáticas, cambie el botón a la posición de encendido.

En la sección Análisis, habilite el seguimiento de visitas de AMP mediante Google Analytics. Para ello, introduzca el ID de Google Analytics. Además, aquí puede habilitar Google Analytics usando Google Tag Manager.

En la sección Diseño, puede cambiar el tema y el diseño de las páginas de AMP. Aquí puede seleccionar opciones de diseño listas para usar. También puede crear su propio tema personalizado con AMP Theme Framework.

En la sección SEO, puede configurar la visualización de metadatos del complemento Yoast SEO en páginas aceleradas, agregar código HTML arbitrario al encabezado y también configurar la indexación de las páginas de archivos y categorías. Si no usa el complemento Yoast SEO, deje la configuración predeterminada.

En la sección Publicidad, configura la visualización de los anuncios de AdSense. El complemento ofrece cuatro opciones de publicidad: arriba del encabezado en todas las páginas, debajo del pie de página en todas las páginas y arriba y debajo del contenido en las páginas de las publicaciones.

Para colocar un anuncio debajo del contenido en la página de publicación, active el botón AD # 4. Seleccione el tamaño del anuncio. Cree un anuncio en su cuenta de AdSense y agregue los ID de usuario y bloque de anuncios a los campos sugeridos. Toma los datos del código del anuncio creado.

Puede mostrar un bloque de contenido coincidente en páginas aceleradas cuando sea necesario. El contenido relacionado es una herramienta de recomendación gratuita que le ofrece una forma sencilla de promocionar su contenido entre los visitantes de su sitio. Al ofrecer a sus lectores más contenido que sea relevante para ellos, puede aumentar las visitas a la página de su sitio, el tiempo que pasan en su sitio, la lealtad de los lectores, las impresiones de anuncios y, en última instancia, los ingresos por anuncios. Para que esto suceda, especifique la ID del bloque en el campo correspondiente del complemento.

En la sección Único, configure la apariencia y las características de la página de publicaciones. Puede habilitar íconos sociales adjuntos en la parte inferior de la pantalla, enlaces a la publicación anterior y siguiente, y también configurar un bloque de publicaciones relacionadas.

En la sección Compartir en redes sociales, habilita los botones para compartir en redes sociales. En la sección Datos estructurados, carga la imagen para el micromarcado de página acelerado. Google puede usarlo para generar resultados de búsqueda. Además, especifique el tamaño de las imágenes que se utilizarán en los fragmentos al publicar enlaces a páginas aceleradas en las redes sociales.

En la sección Notificación, puede configurar la visualización de notificaciones. Por ejemplo, puede informar a los visitantes sobre las políticas de uso de cookies y mostrar un aviso de RGPD.

En la sección Comentarios de Disqus, puede habilitar el sistema de comentarios Disqus en las páginas aceleradas. Para hacer esto, cambie el botón Compatibilidad con comentarios de Disqus a Activado, especifique la URL del recurso en el sistema Disqus y la ruta al archivo de comentarios en el servidor.

Si no habilita el sistema de comentarios, la página AMP mostrará el texto de los comentarios dejados por los visitantes de la página base y el botón "Comentar". Con el clic del botón, el usuario será redirigido a la versión básica de la página.

En la sección Configuración avanzada, puede habilitar la versión acelerada de la página principal, así como las páginas de los encabezados y archivos. Para esta función, use los botones Soporte de inicio y Soporte de página de archivo.

El botón Redirección móvil permite la redirección automática de todos los usuarios móviles desde la versión adaptativa del sitio a AMP.

No redirija a todos los usuarios a AMP. No todos los visitantes necesitan páginas aceleradas para el sitio. La redirección obligará a los propietarios de teléfonos inteligentes y tabletas a utilizar versiones abreviadas de páginas con funcionalidad limitada. Esto puede conducir a una caída en la tasa de conversión del sitio.

Además, si Google ve la versión de escritorio del sitio y AMP, para el índice móvil primero elige una versión para escritorio. Esto puede llevar a la pérdida de tráfico por la falta de adaptación del recurso a los dispositivos móviles.

Asegúrese de habilitar el enlace a la versión completa de las páginas en el pie de página usando el botón Enlace a no AMP en el pie de página. Esto ayudará a los usuarios a navegar a las páginas básicas con funciones adicionales.

En la sección Extensión, puede comprar y habilitar complementos para el complemento. Por ejemplo, puede usar una herramienta adicional para administrar la publicidad en páginas aceleradas o agregar la "Calificación" de micromarcado a AMP.

En la sección Corregir errores de AMP, puede habilitar el soporte pago. Los desarrolladores del complemento lo ayudarán a comprender la configuración y eliminar las notificaciones de error en Search Console.

El bloque Importar/Exportar le permite migrar la configuración de páginas aceleradas de un sitio a otro.

Entonces, en los sitios de WordPress, puede implementar páginas aceleradas en unos minutos. Un poco más de tiempo que dedica a personalizar el diseño y la funcionalidad con el complemento AMP para WP.

AMP para Drupal

Para implementar páginas móviles aceleradas en sitios de Drupal, use las siguientes herramientas:

• Módulo AMP.
• Tema AMP.
• HTML de la biblioteca AMP.

Para trabajar con el módulo AMP, se requieren los complementos Token y Chaos Tools. Si planea mostrar anuncios de AdSense en páginas AMP, instale la extensión de integración de Google AdSense.

En la página Configuración de AMP de la pestaña Configuración, habilite la visualización de versiones aceleradas para publicaciones y páginas. Seleccione el tema que se utilizará para crear las páginas aceleradas. Ingrese la ID de Google Analytics para rastrear las visitas a la página. Además, puede usar AMP-pixel para contar las vistas.

En la pestaña Metadatos de AMP, ingrese el nombre del sitio. Si es necesario, descargue el logotipo y seleccione su tamaño.

Después de la configuración, comprueba la visualización de las versiones aceleradas de las páginas. Para hacer esto, agregue el valor “?amp” a la URL.

AMP para Joomla!

Para implementar páginas aceleradas en Joomla! los sitios usan la extensión wbAMP. La versión completa de este complemento le costará $ 44 por año. La versión comunitaria está disponible de forma gratuita.

Después de instalar y activar el complemento, vaya a la página de configuración. La versión gratuita del complemento tiene una funcionalidad limitada, por lo que solo puede configurar parámetros básicos para mostrar páginas aceleradas.

Deje el valor de sufijo predeterminado para la URL de AMP. En este caso, solo necesita agregar el valor de amperaje para ver las páginas aceleradas.

También en la página de configuración principal, proporcione información sobre el sitio y los datos del editor. Elija el tipo apropiado de micromarcado: NewsArticle para notas de noticias y BlogPosting para publicaciones de blog.

Seleccione las páginas para las que desea crear versiones aceleradas. Para hacer esto, cambie a la pestaña Seleccionar páginas.

Complete la sección "Regla para com_content". Si planea mostrar páginas aceleradas solo para publicaciones, en el campo "Ver", especifique el valor del Artículo. En el campo “Categorías”, seleccione las categorías cuyas publicaciones tendrán versiones AMP. Escriba los campos ID, número de ID del material y “Tarea”, ingrese el valor “*”. En este caso, se creará AMP para todas las publicaciones en las categorías seleccionadas.

Otras configuraciones en la versión gratuita del complemento no están disponibles.

¡Hay otra herramienta comercial para crear páginas aceleradas en Joomla! sitios: complemento JAmp. Cuesta 39 euros. En el sitio de prueba del complemento, puede ver cómo la herramienta transforma una página estándar en una acelerada.

A diferencia de WordPress y Drupal, para Joomla! no existe una herramienta completamente gratuita para crear AMP.

AMP para tienda en línea

La tecnología AMP está diseñada principalmente para proyectos de contenido: recursos de noticias, blogs. ¿Debo crear páginas aceleradas para sitios de comercio electrónico?

Los autores del proyecto AMP argumentan que las tiendas online pueden y deben utilizar páginas aceleradas. El principal argumento a favor de implementar tecnología en los recursos de comercio electrónico: aumentar la velocidad de carga de las páginas móviles afecta positivamente la conversión. Por cierto, eBay está experimentando con AMP desde mediados de 2016.

AMP para OpenCart

Para crear páginas aceleradas para un OpenCart, use el módulo Páginas móviles aceleradas. Esta es una solución paga. Y siempre tenga la posibilidad de ver desde el enlace la versión de prueba de las páginas móviles aceleradas creadas con la ayuda de este módulo.

También puede probar el AMP para el módulo de páginas de productos. Esta es una solución gratuita. El complemento crea AMP solo para páginas de productos. Para el trabajo de AMP para páginas de productos, necesita el módulo SEO Friendly URLS.

Es mejor no recomendar un AMP gratuito para el módulo de páginas de productos en este momento, ya que se está probando en una fuente anterior en este momento durante un día y medio laboral y no funciona. Después de la instalación y activación del programa en OpenCart versión 2.3.0.2, las páginas aceleradas del sitio no aparecen. El complemento agrega un enlace a la versión AMP en el encabezado de la página. Al hacer clic en el enlace, aparece un error 404.

Además, como resultado de la instalación del módulo, el sitio se vuelve periódicamente inaccesible y en la pantalla del navegador aparecen diferentes tipos de garabatos y mojibake. La capacidad de servicio se restaura después de que el módulo se haya retirado y reinstalado.

Quizás el problema esté relacionado con la falta de experiencia real en la administración de sitios OpenCart. Los usuarios del foro de perfil tienen comentarios principalmente positivos sobre el AMP para el módulo de páginas de productos.

AMP para Magento

Si su tienda en línea se ejecuta en la plataforma Magento, use el complemento de pago Accelerated Mobile Pages. El módulo crea AMP para las páginas principal, de categoría y de productos.

AMP para PrestaShop

Las páginas aceleradas para la tienda PrestaShop se pueden crear utilizando el módulo de pago PrestaShop AMP. Genera versiones aceleradas de las principales, páginas de categorías y fichas de productos.

Las características del módulo se pueden evaluar en el sitio de prueba.

Implementar AMP o no, ¡esa es la cuestión!

Si tiene un proyecto de contenido que se ejecuta en WordPress, puede implementar páginas AMP de forma rápida y rentable. Pasará un minuto instalando el complemento base y media hora para instalar y configurar un complemento AMP alternativo.

Los sitios administrados por Drupal también tienen una solución gratuita que se puede instalar y configurar rápidamente. Pero para Joomla! y CMS para complementos de tiendas en línea para crear AMP debe comprarse.

Sin embargo, en algunos casos, los resultados de AMP pueden no ser tan brillantes como esperaba. En el estudio de caso de implementación de AMP, Kinsta comparte información muy importante, para el momento en que se habilitó AMP en el blog de Kinsta:

• Los clientes potenciales móviles cayeron un 59,09%.
• Las suscripciones a boletines electrónicos desde dispositivos móviles cayeron un 16,67 %.
• Las creaciones de cuentas desde dispositivos móviles cayeron un 10,53%.

Además, cuando AMP eliminó por completo la clasificación de Kinsta, en realidad subió. ¿Por qué está pasando? Probablemente una de las razones más importantes es que AMP puede aumentar el rendimiento de SERP para proyectos orientados a noticias y con mucha publicidad, mientras tanto, si su sitio web ya es bastante rápido en dispositivos móviles, AMP no tiene un gran impacto positivo.

Según Google, el 70 % de las conexiones de redes celulares en todo el mundo se realizarán a velocidades 3G o más lentas hasta 2020. Por lo tanto, si bien es muy importante optimizar para dispositivos móviles, aquellos que ya tienen un sitio bien optimizado probablemente no notarán grandes diferencias.

¿Tiene sentido usar páginas móviles aceleradas si su funcionalidad y apariencia son inferiores a las páginas estándar y aún no hay ventajas obvias en el ranking?

El líder mundial del mercado de búsquedas, Google, demostrará que solo irá más allá con este proyecto y otros tendrán que seguir sus reglas. La lógica es simple: la proporción de tráfico móvil está creciendo y seguirá creciendo. Las personas se conectarán en línea no solo con la ayuda de teléfonos y relojes. Incluso las cafeteras y lavadoras están en línea ahora. Por lo tanto, la tecnología de visualización de contenido en las pantallas de los dispositivos móviles evolucionará.

Por cierto, hace algunos años, los propietarios de sitios se mostraron escépticos sobre la necesidad de adaptar el sitio para el tráfico móvil. Hoy en día, una versión móvil o un diseño adaptable es imprescindible para el funcionamiento eficaz de un recurso en línea.

Es muy probable que la tecnología AMP se convierta en una de las condiciones básicas para la efectividad de los sitios en el futuro previsible.