AMP: Accelerated Mobile Pages

¿Qué es exactamente AMP (Accelerated Mobile Pages)?

AMP (Accelerated Mobile Pages) es un lenguaje de creación de sitios web derivado del HTML y optimizado para que las webs se carguen casi de forma inmediata en dispositivos móviles.

Mediante estructurar el HTML de una manera común y predefinida, se consigue aligerar las páginas acelerando su despliegue en plataformas móviles.

Situación Actual

Actualmente, el tráfico procedente de dispositivos móviles es superior al de ordenadores de escritorio y en muchas ocasiones los diseños web no se adaptan correctamente. Además, la experiencia de navegación del usuario (UX) disminuye notablemente cuando la velocidad de carga de un sitio web es lenta.

Por estos motivos, Google ha liderado el proyecto AMP a través de una entrega de contenidos CDN (Content Delivery Network).

Objetivos del proyecto AMP

El principal objetivo de AMP es mejorar la velocidad de carga de las páginas web para móviles mejorando así la experiencia de los usuarios. Hoy en día, si una página web no aparece en la pantalla de dispositivos móviles en aproximadamente 3 segundos, el 40% de los usuarios abandona e inicia otra búsqueda.

La plataforma AMP pretende evitar este alto porcentaje de abandono facilitando a los programadores y responsables de sitios web los medios técnicos que necesitan para optimizar el rendimiento en dispositivos móviles.

En definitiva, Accelerated Mobile Pages es un proyecto diseñado para optimizar y conseguir que los sitios web móviles sean más rápidos.

Principales beneficios de la tecnología AMP

• Las webs que utilizan la tecnología AMP se cargan hasta un 85% más rápido en dispositivos móviles que las webs que no utilizan AMP. El gasto de datos es notablemente menor y también se reduce el gasto de batería del dispositivo móvil.
• La tecnología AMP puede aumentar el número de visitas y la permanencia de los usuarios en el sitio web.
• Las páginas optimizadas AMP obtienen mejores rankings en motores de búsqueda y una mayor tasa de conversión de usuarios móviles a clientes.
• Incremento de la captación de leads en entornos móviles

El lenguaje AMP HTML

Las páginas AMP se programan en AMP HTML (sublenguaje del HTML) un formato abierto con licencia Apache. El código AMP HTML está disponible en GitHub para su integración en sistemas de gestión de contenidos.

La estructura de una página AMP cuenta con los siguientes archivos:

AMP HTML:

Ofrece elementos que otorgan un mayor rendimiento y una carga inmediata de contenido estático.

AMP JAVASCRIPT:

Framework de Javascript para las páginas móviles que administra los recursos y su carga. En Accelerated Mobile Pages sólo esta permitido el JavaScript facilitado por AMP JS.

AMP CDN:

Red de distribución de contenidos, recoge las páginas AMP, las guarda cacheadas y las optimiza automáticamente.

AMP CACHÉ:

Sistema de distribución de contenido y archivos. Este caché almacena los HTML del sitio web para que la entrega sea más ágil.

¿Cómo identificar páginas AMP?

Las páginas de un sitio web en HTML que tienen una versión AMP deben tener una etiqueta en el código con el atributo “amphtml” indicando a Google dónde se encuentra la versión y una etiqueta con el atributo “canonical” indicando cuál es la página HTML de la que proceden para evitar que el contenido se contemple como duplicado.

Por su lado, las páginas que no tienen una versión HTML tendrán un “canonical” a sí mismas para que se indexen.

AMP LITE y el algoritmo RAISR

Google ha lanzado una versión más ligera del proyecto AMP para que los usuarios naveguen a máxima velocidad aun teniendo una conexión limitada y lenta.

La versión AMP Lite mejora en un 45% el consumo de los datos de AMP. Google comprime las imágenes en formato Web con aquellos navegadores con los que es compatible. Las imágenes hacen uso el algoritmo RAISR, capaz de reducir el peso de una imagen en un 75% reduciéndose igeramente su calidad.