En 2015 Google plantea su respuesta a los Instant Articles de Facebook. Se trata de las páginas AMP, una tecnología Open Source (código abierto) que sale en defensa de los dispositivos móviles con peores conexiones. Si no sabes qué son las páginas AMP, te explicamos en qué consisten y cómo aprovechar su potencial.

¿Qué es AMP?

Puede que te estés preguntando qué es una página AMP. Las Accelerated Mobile Pages son páginas de carga rápida, una simplificación de nuestra web que tiene que cumplir ciertos requisitos técnicos y que facilita la carga de páginas en dispositivos móviles con malas conexiones. Cuidado, esto no quiere decir que solo sirvan para móviles, el protagonista de la historia es la mala conexión, por lo que si estás con tu portátil en medio del monte y no te llega bien la señal, también te será servida la versión «acelerada». Es por ello que Google recomienda que estas páginas se trabajen con un diseño adaptable a los diferentes formatos. También es cierto que no todas las funciones tienen soporte fuera del móvil, por lo que lo mejor es probar y probar antes de subir la web.

Las AMP no dejan de estar basadas en HTML, pero es una especie de framework que tiene unas etiquetas propias para un montón de funciones. Por ejemplo, la etiqueta <amp-img> sustituye a <img>.

Deben de cumplir con una serie de condiciones que aseguran la carga rápida de la web. Por ejemplo:

Se deben utilizar las etiquetas propias de AMP
No se pueden cargar archivos CSS, debe de ir todo en línea.
JavaScript debe de ser cargado de forma asíncrona.
El peso del CSS no puede exceder un tamaño determinado.

Si se cumplen las condiciones y la página se valida, Google guardará en su caché una versión de esta web reducida de manera que pueda servirla a través de su CDN. El tema de la validación de AMP queda un poco fuera del objetivo de este artículo, pero lo retomaremos en una futura entrada.

¿Para qué sirven las AMP?

Como decíamos, su principal objetivo es conseguir que dispositivos con malas conexiones a internet puedan cargar la página muy rápido. Se evitan así largas esperas de carga de contenido que empeoran la experiencia de usuario.

Pero, como desarrolladores y consultores SEO, nuestro interés irá más allá. Por ejemplo, las tarjetas de sugerencias (Google Discover) que se muestran en el móvil funcionan a través de este tipo de formatos. Es un terreno muy jugoso, porque, si logras meter tu URL en estos resultados, puedes obtener un importante aumento de visitas.

Ventajas

Velocidad de carga
Mejoras en el posicionamiento
Acceso a las búsquedas Discover
Adaptabilidad móvil extrema

Desventajas

Su escueto js no deja muchas opciones
El que sean servidas por los CDN de Google, no gusta a muchos
Sus restricciones CSS la hacen más austera y menos atractiva de lo que podría ser

Ejemplos de páginas AMP

Nuestra web misma está disponible en este formato, puedes forzar su carga en este enlace.

Si quieres encontrar ejemplos de páginas AMP puedes dar una vuelta por Google y buscar cualquier tema de actualidad. La mayor parte de los periódicos digitales ofrecen este formato. Antes se podían distinguir por un pequeño icono en su esquina: un rayo sobre un círculo. Sin embargo este icono parece haber desaparecido en otro de los cambios de estilos a los que Google nos tiene acostumbrado. De todas formas, como digo, la mayoría de las noticias tienen su versión AMP. Te dejo, como ejemplo, esta página correspondiente a la primera noticia de la imagen.

Si aún quieres más, Google tiene este repositorio de ejemplos AMP.

Lo dejaremos aquí, por ahora. En próximos artículos hablaremos de cómo crear páginas AMP y cómo realizar una validación de este código para comprobar que nuestras AMP son correctas.

Páginas AMP: Qué son | Cómo crearlas