Ir al contenido principal

AMP: Accelerated Mobile Pages

AMP es un framework de componentes web, diseñado para crear páginas orientadas al usuario, la velocidad y una buena User Experience

Para ello, utiliza unas etiquetas HTML propias creadas para ofrecer al usuario una mejor experiencia de uso en el sitio web.

Por ejemplo, para la carga de imágenes utiliza la etiqueta amp-img en lugar de img, la cual hace que la carga de imágenes sea lazy (las imágenes solo se cargan cuando el usuario necesita verlas y no en la carga inicial de la web), provocando que el tiempo de carga de la página disminuya considerablemente.

¿Para qué sirve AMP?

A medida que los usuarios que acceden a internet desde un dispositivo móvil aumenta, Google y otras empresas del sector se emprendieron en la creación de un framework que permitiría a los usuarios que buscan desde un móvil acceder más rápido a una página web, ofreciendo además una experiencia de uso similar entre distintas páginas (pues los componentes AMP que utilizan son los mismos).

Estas ventajas se vieron amplificadas por la utilización de caché por parte del propio Google o de Cloudflare, el cual hace que las páginas que utilizan AMP carguen casi instantáneamente al entrar desde el buscador.

Desventajas técnicas de AMP

No es oro todo lo que reluce, y en AMP esto también se aplica. Uno de los mayores problemas de AMP es que el uso de JavaScript en tu página web queda ¡deshabilitado!. Así es como AMP se asegura de que el código externo interfiera en el First Meaningful Paint, que tu página no bloquee el renderizado, y mantiene el tiempo de interacción lo más bajo posible.

Otra de las limitaciones es el CSS. "Solamente" se puede utilizar un máximo de 50KB de CSS personalizado, por lo que algunas páginas tendrán que apretarse el cinturón para poder adaptarse a AMP.

Implementando AMP en mi web

A pesar de que AMP es aún una tecnología joven, la fuerza que le ha dado Google ha hecho que prácticamente todas las plataformas online tengan disponibles temas con versión AMP, o plugins que convierten un tema a AMP:

Más información

Si deseas saber más sobre la tecnología de AMP, te dejo a continuación unos enlaces donde podrás aprender cómo implementarla en tu sitio web y qué ventajas tiene su utilización: