Qué es AMP: son las siglas de Accelerated Mobile Pages, páginas aceleradas en formato móvil. Es una iniciativa de código abierto de google que busca resolver una de las urgencias actuales de las webs, la velocidad de carga en la navegación móvil.
Desde hacia un tiempo se llevaba considerando que los dispositivos móviles estaban comiéndole el terreno a la navegación a través del ordenador y google se puso serio de cara al SEO en cuanto a tener la página en formato responsive. Ahora la tendencia de SEO para 2018 es tener AMP activo en nuestras páginas, debido a 2 factores importantes: la sencilla usabilidad de la web y la velocidad de carga.
Las páginas web y los anuncios son cargados de manera inmediata dando una experiencia fluida al usuario no solo en móvil sino también en escritorio. Google afirma que las páginas cargan entre un 15% y un 85% más rápido, está claro que dependiendo de la complejidad de la web y sus funcionalidades esto será más alto o menos.
¿Qué nos aporta AMP?
De manera resumida lo que nos proporciona AMP es:
- Las páginas se cargan al instante
- Ordena estáticamente los recursos
- Prioriza la carga de recursos, cargando únicamente lo necesario
- No permite que los mecanismos de extensión bloqueen la representación de páginas
- Solo permite scripts asíncronos
- Mantiene contenido JavaScript de terceros
- La hoja de estilos CSS debe estar en una sola línea y tener un máximo de 50KB
- Se optimizan las fuentes de texto
- Se minimizan los recálculos de estilos
- Solo ejecuta animaciones con aceleración por GPU
Explicado de forma simple: nos muestra la página con los recursos necesarios para darnos esa inmediatez de la que hablábamos, eliminando elementos que ralentizan la carga de la web.
Debido a lo que pasa con el JavaScript debemos darnos cuenta que implementar AMP es más útil en blogs, periódicos online o incluso solo en alguna sección de la web como pueda ser la de artículos y entradas.
Aquí un ejemplo de una web vista con AMP y sin él:
Como veis las diferencias no son muy grandes pero elimina cierto contenido. Ambas versiones están online, por lo que para que google no nos penalice por contenido duplicado lo que se hace es utilizar la etiqueta canonical.
Desde Search Console podéis ver un apartado dentro de «Apariencia en el buscador». También tiene una implementación diferente para Google Analytics que podéis ver en esta guía.
Más adelante crearé una entrada explicando como meter AMP en tu sitio web, aún así si quieres hacerlo ya puedes mirar la guía desde el propio sitio del proyecto AMP. Si usáis wordpress cuenta con un plugin que nos facilita bastante la vida.
Aún así os diré que hay 2 componentes (y otro opcional) que deben tener las páginas AMP:
- AMP HTML: es HTML básico con alguna restricción y alguna extensión para compilar el código.
- AMP JS: que garantiza la representación rápida de página AMP HTML.
- Google AMP Caché: es opcional, y nos proporciona las páginas AMP HTML.
Existe otra versión de AMP llamada AMP Lite que está pensada para gente con conexiones muy lentas, restando peso a los recursos de la web, principalmente de las imágenes.
Muy buena guía y útil, parece un poco difícil de implementar.