Accelerated Mobile Pages

Accelerated Mobile Pages (AMP), es un marco de trabajo multiplataforma de código abierto con el que se puede aumentar significativamente la velocidad de carga de los sitios web móviles. Se basa en la reducción de CSS y JavaScript, una red de distribución de contenidos, así como de HTML modificado. El proyecto cuenta con el apoyo de Google.

Antecedentes

El uso de Internet móvil está aumentando a un ritmo acelerado en todo el mundo. Por esta razón, el futuro de Internet será móvil en muchas áreas. Por lo tanto, el contenido web debe ser optimizado para los dispositivos móviles. Ni siquiera el comercio móvil se libra del creciente uso de Internet móvil. Los cambios en los hábitos de navegación afectan a las técnicas de diseño y adaptación de las webs que se utilizan para la presentación de las mismas. Para mejorar la usabilidad en la medida de lo posible, los sitios web móviles tienen que ser rápidos.
Un estudio reveló que la tasa de rebote aumenta a más del 50 por ciento si una web móvil tarda más de 10 segundos en cargarse. El efecto de las diferencias en los tiempos de carga de la página se hace aún más evidente en las tiendas online. Aquí, unas pocas fracciones de segundo pueden determinar si un visitante se convierte en comprador o no. La optimización de la velocidad debe ser incorporada definitivamente en la optimización móvil. Al declarar la velocidad de la página como un factor de posicionamiento en 2010, el propio Google destacó el hecho de que las velocidades de carga de la web son un factor importante para una experiencia de usuario positiva.

Historia

El proyecto de Accelerated Mobile Pages se lanzó en octubre de 2015. La base para el establecimiento de la iniciativa de código abierto forzó debates y discusiones entre editores y empresas de tecnología, donde la necesidad de cargar más rápidamente el contenido móvil era a menudo el tema principal. Los iniciadores, que incluyen Google, WordPress y Adobe, aspiran a crear un ecosistema móvil completo. Este sistema debería ser beneficioso tanto para los editores como para los desarrolladores, usuarios y plataformas de consumidores. Otros socios tecnológicos incluyen la red social Pinterest, Twitter y LinkedIn. Entre las primeras editoriales en implementar AMP se encuentran “Zeit” y “Frankfurter Allgemeine Zeitung” en Alemania, “Washington Post” y “Buzzfeed” en Estados Unidos, “The Guardian” en Inglaterra y “El País” en España.
Debido al enfoque de código abierto, es de esperar que AMP se extienda y arraigue rápidamente, al igual que el sistema operativo Android para smartphones.

Principio de funcionamiento

La velocidad de carga de una web depende principalmente del tamaño de los archivos que se van a cargar. Por lo tanto, el marco de trabajo intenta reducir al mínimo el tamaño total de una página web. Al mismo tiempo, los contenidos de la web de AMP se almacenan en caché y se ponen a disposición en un servidor proxy. Si un usuario accede a los contenidos, éstos se cargan a través de una red de entrega de contenidos. El código fuente de las web de AMP puede ser interpretado por todos los servidores.

• AMP HTML: El código fuente HTML es personalizado y reducido por AMP. Sólo se produce una solicitud HTTP por llamada de página.
• AMP JavaScript: Las webs de AMP sólo utilizan JavaScript asíncrono. Esto asegura una rápida renderización de la web ya que la carga de la página no puede ser bloqueada por los recursos de JS. Si se integran archivos JavaScript de terceros, la incrustación se realiza a través de iframes.
• AMP CDN: Se crea una caché de sitios web AMP en servidores proxy de todo el mundo. De esta manera, el contenido puede ser entregado a través de una red de entrega de contenido basada en http 2.0. La CDN también comprueba si el sitio web de AMP es funcional.

La gran ventaja de AMP es que la velocidad de carga de una web puede ser calculada y escalada con precisión de antemano. Otras mejoras incluyen la especificación del tamaño exacto del archivo para imágenes u otros medios incrustados. Cuando se carga una web AMP, la tecnología es capaz de priorizar las descargas individuales. Aquí, las posiciones de los archivos individuales en las fuentes también se interpretan además del tamaño del archivo.
Los archivos CSS también se ven afectados por la optimización de la velocidad. Por ejemplo, sólo se permiten para CSS los estilos online que no superen los 50 kilobytes.

Aplicaciones

Básicamente, las Accelerated Mobile Pages no están limitadas a un área específica de la web. Las aplicaciones de e-commerce para sitios web de AMP, formularios de registro especiales, paywalls, etc. también son concebibles. Los iniciadores optaron por abstenerse de cualquier restricción previa. En cuanto a la integración de los sitios web de AMP en los resultados de búsqueda de Google, hasta ahora sólo se han visto afectados los editores de noticias. A largo plazo, sin embargo, es probable que también se integren las tiendas online que tienen páginas de productos AMP especiales, o los proveedores de servicios de viaje que, por ejemplo, simplifican las reservas a través de sitios web AMP rápidos para usuarios móviles.

Modificaciones al código HTML

Las modificaciones del código fuente HTML son necesarias para implementar las webs de AMP. Por ejemplo, a las etiquetas de medios se les da el prefijo “amp”.

• Imágenes: amp-img.
• Vídeos: amp-video.
• Archivos de audio: amp-audio.
• iframes: amp-iframe.

Ejemplo en el caso de un vídeo:

Estas etiquetas deben utilizarse para los sitios web de AMP:
Tipo de documento: <!doctype html>

Etiqueta de nivel superior

tag ( also works)
Enlace canónico en la sección :

Codificación en la sección:

Ver puerto head en la sección:

Referencia a AMP-CDN en la sección head:

Especificación de la opacidad:

Mientras que el rel-attibute y la etiqueta canónica no son obligatorios en las webs convencionales, los sitios web de AMP deben contener estos dos elementos en la sección head.
rel-attribute: Muestra a los rastreadores que también existe una versión del sitio web AMP de la página actual.
Ejemplo:

Etiqueta canónica: La etiqueta canónica en el sitio web de AMP apunta a la web original.

Si la página AMP es el único sitio web que tiene este contenido, la etiqueta canónica apunta hacia sí misma.

Importancia para el marketing móvil

Los sitios web AMP deberían cargarse en milisegundos. Dado que los anuncios también se ven afectados por las velocidades de carga optimizadas, los anunciantes pueden utilizar AMP para intentar asegurarse de que sus anuncios no tengan un efecto negativo en la experiencia del usuario. Esto se debe a que hoy en día, los banners publicitarios o intersticios son a menudo percibidos como una molestia por los usuarios de Internet móvil.
Los marcos de trabajo AMP son compatibles con muchos formatos publicitarios diferentes. Por lo tanto, esta tecnología ofrece a los anunciantes una amplia gama de opciones de publicidad. Dado que el marco de trabajo no depende de la plataforma, los anunciantes no se limitan a una sola empresa cuando desean publicar anuncios.