El proyecto AMP, acrónimo de “Accelerated Mobile Pages”, o “Páginas móviles aceleradas” en español, es una iniciativa comandada por grandes de la industria como Twitter, Automattic (empresa detrás de WordPress) y Google, entre otros.
Surge de la necesidad de mejorar la navegación móvil, y está enfocado básicamente en mejorar la velocidad de carga de las páginas web, algo que va de la mano de una reducción de peso de las mismas.
Así que como resumen puedes quedarte con que AMP son páginas diseñadas para cargar instantáneamente.
Nota
Para que esta entrada te resulte útil necesitas un blog, si aún no lo tienes puedes apuntarte al siguiente curso para conseguir crearlo en tan solo 3 clases 🙂
¿Quién está detrás de todo esto
Por si has leído la entradilla de este artículo de largo, vuelvo a recalcarlo:
Google está detrás de todo esto.
Y ya sabes que a Google le encanta que los sitios web carguen rápido, le gusta hasta tal punto que es un factor determinante a la hora del posicionamiento.
El proyecto está aún un poco en pañales, pero si le echas un vistazo a Google Trends comenzarás a ver los primeros picos importantes de actividad:
Es cierto que todavía hay meses donde el interés decae drásticamente, pero es solo cuestión de tiempo que Google termine por introducir AMP en su algoritmo y más de un webmaster se eche las manos a la cabeza la próxima vez que entre en Analytics.
Si no quieres ser tú, continúa leyendo esta guía.
Si has llegado tarde y has aterrizado aquí intentando arreglar el desaguisado, asegúrate de suscribirte a la newsletter para que en un futuro pueda avisarte de estas cosas 🙂
Diferencias entre AMP y páginas normales
No quiero llenarte la cabeza de tecnicismos que al final no te vas a leer por puro aburrimiento (para eso tienes la página oficial del proyecto)
Así que lo más práctico es que te enseñe una imagen para que veas las diferencias entre un artículo normal (izquierda), y un artículo en AMP (derecha)
Debido al tamaño de la pantalla no se puede apreciar todo el contenido, así que te recomiendo que te pases por los enlaces para verlo en directo:
- Artículo sobre TripMode visto normalmente
- Artículo sobre TripMode visto en AMP (distinto al de la foto porque lo he personalizado, te enseñaré a hacerlo más adelante)
Es cierto que ahora mismo puede que no veas muchas diferencias, sobre todo a nivel de diseño, pero ten en cuenta que mi blog tiene un aspecto muy minimalista por naturaleza, así que en ese sentido no notarás grandes cambios.
Lo que si deberías notar es una velocidad de carga mucho mayor.
¿Y qué pasa con el responsive?
No he incluido una foto de ”páginas responsive VS AMP” porque debido al tamaño de la pantalla de los smartphones tampoco apreciarías grandes diferencias, y menos en mi blog.
Si quieres comprobar las dos versiones simplemente entra con tu dispositivo móvil favorito a los enlaces que acabo de ponerte un poco más arriba.
En cualquier caso ten en cuenta que AMP no es responsive, esta última simplemente adapta lo que se vería en un navegador de escritorio a un dispositivo móvil, mientras que AMP reduce a base de limitar elementos como Javascripts y hojas de estilo externas.
¿Cuáles son los beneficios de las AMP?
Mejora el posicionamiento online
No van a pasar muchos meses hasta que Google comience a dar prioridad de forma masiva a las versiones AMP. De hecho ya lo está haciendo con las noticias de los medios con los que está colaborando.
Incluso si acudes a Google Webmaster Tools encontrarás una sección dedicada a este proyecto.
Hasta encontrarás un aviso por parte de Google:
Corrige los errores de las páginas de Accelerated Mobile Pages (AMP) para que se publiquen de forma preferente a los usuarios móviles
¿De verdad necesitas más pistas?
Mejora el porcentaje de rebote
Ya has visto que Google te va a querer si empiezas a utilizar AMP.
Y también lo harán tus lectores.
Seguro que más de una vez te has frustrado al intentar entrar a una página web que tardaba más de la cuenta en mostrar el contenido, incluso puede que llegases a cerrar la pestaña del navegador.
Pero gracias a las páginas móviles aceleradas va a ser más sencillo para tus lectores consumir tu contenido desde sus dispositivos móviles sin tener que esperar más de la cuenta.
Y un lector contento es precisamente lo que quieres en tu blog.
Menor consumo de datos
Hoy en día el tráfico es móvil.
Esto quiere decir que la mayor parte de tu audiencia te leerá desde un smartphone o tablet, algo que suele traducirse en conexiones 3G / 4G, donde no existe una barra libre de MBs.
Las páginas AMP pesan bastante menos que las páginas normales, así que tus lectores agradecerán que no aniquiles su tarifa de datos, y de paso le darás un respiro a tu hosting.
Cómo empezar a utilizar AMP en WordPress
La forma más sencilla de añadir AMP a tu sitio WordPress es instalando el plugin oficial desarrollado por Automattic.
Una vez lo tengas no tendrás que hacer nada más.
A partir de ahora si a cualquier entrada de tu blog le añades /amp al final, accederás a la versión AMP de la misma.
Cómo personalizar AMP
Si no te gusta el diseño por defecto que utilizan las páginas AMP, te recomiendo instalar el plugin gratuito PageFrog.
Una vez instalado, desde el panel de administración de WordPress Mobile Formats > Styling, en la pestaña de AMP, encontrarás un apartado donde configurar elementos básicos como colores, y tipos de letra.
Si además quieres eliminar la imagen destacada (recomendado para ganar velocidad), deberás ir a Mobile Formats > Settings, y en la sección other settings, desactivar la última opción.
Dudas frecuentes sobre AMP
A medida que el proyecto vaya evolucionando incluiré información sobre las dudas más frecuentes que están surgiendo ahora mismo.
Publicidad en AMP
Estando Google detrás de todo ya habrás imaginado que no tiene intenciones de matar su gallina de los huevos de oro y fusilar Adsense.
De hecho con el plugin de personalización PageFrog podrás conectar tu cuenta de Adsense muy fácilmente.
En el menú Mobile Formats > Ads encontrarás un pequeño botón que te permitirá conectarte con tu cuenta de Google y comenzar a añadir los bloques de publicidad que veas convenientes.
Analytics en AMP
De nuevo te recomiendo acudir a PageFrog para solucionar este problema.
En Mobile Formats > Analytics encontrarás varios servicios de analítica web.
Basta con que de nuevo te conectes con tu cuenta de Gmail, y selecciones el sitio que quieres conectar. Después haz click sobre enable integration y listo, ya podrás comenzar a recopilar datos que analizar más adelante.
Muros de pago y suscripciones
El proyecto AMP no puede llegar arrasando todo a su paso, así que habrá soluciones para los blogs que tengan secciones de pago en sus páginas web.
Espero que esta entrada te haya resultado útil, recuerda que la iré actualizando siempre que pueda, así que no olvides pasarte por aquí de vez en cuando o suscribirte a la newsletter para que te avise cuando añada nuevo material.
Un fuerte abrazo,
Javi
Hola Javi,
Cuando tengo activado el AMP, al crear una entrada para el post el botón de Imagen destacada no hace nada de nada. Además es muy curioso porque he intentado encontrar la opción Display featured image que comentas, pero aunque le doy a Opciones Avanzadas el plugin me ignora y me sigue mostrando las básicas. ¿Algún consejo? Por cierto, aprovecho para preguntarte qué plugin utilizas para que los comentarios como este cumplan con el RGPD.
Gracias por anticipado,