Amp que es y en que puede ayudarnos

15
AMP Accelerated Mobile Pages Alvaro Fontela Consultor Wordpress y co-fundador de Raiola Networks

Transcript of Amp que es y en que puede ayudarnos

Page 1: Amp que es y en que puede ayudarnos

AMPAccelerated Mobile

PagesAlvaro Fontela

Consultor Wordpress y co-fundador de Raiola Networks

Page 2: Amp que es y en que puede ayudarnos

La navegación móvil, el futuro y el presente (I)

En 2014 el 67% de las conexiones a Internet en España se hicieron desde smartphones.

En el año 2016, más del 40% de las compras por Internet se realizan desde dispositivos móviles.

El smartphone se ha convertido en una herramienta imprescindible para consumir contenidos.

(datos de IABSpain)

(este es de los que explotan)

Page 3: Amp que es y en que puede ayudarnos

La navegación móvil, el futuro y el presente (II)

En las webs de ocio se nota mucho el tráfico desde conexiones móviles.

Un mayor porcentaje de usuarios desde conexiones móviles más lentas existe una mayor optimización de la velocidad de carga.

El dispositivo móvil es el futuro (smartphones y tablets) e Internet avanza directo a este objetivo.

Page 4: Amp que es y en que puede ayudarnos

La navegación móvil, el futuro y el presente (III)

Ahora mismo los sitios web se adaptan a dispositivos móviles con los siguientes métodos:

Versiones móviles especificas Diseño web responsive

Page 5: Amp que es y en que puede ayudarnos

La navegación móvil, el futuro y el presente (IV)

En 2015, Google empieza a apoyar el proyecto AMP para servir contenidos a móviles de forma optimizada.

Google AMP nace como una alternativa para servir contenido optimizado.

En 2016, Google empieza a mostrar AMP en los resultados de búsqueda.

Page 6: Amp que es y en que puede ayudarnos

AMP ¿Qué es y para qué sirve? (I)

AMP es un proyecto opensource impulsado por Google para servir contenido para móviles de forma rápida y optimizada.

AMP NO es una alternativa al diseño responsive de una web, es una forma de servir contenido adaptado a móviles.

AMP está preparado para cargar rápido en conexiones móviles y adaptándose en apariencia a dispositivos móviles.

Page 7: Amp que es y en que puede ayudarnos

AMP ¿Qué es y para qué sirve? (II)

AMP está orientado a blogs y sitios web de noticias, no a páginas estáticas o corporativas, es decir, está orientado a fuentes de contenido.

Los periódicos y revistas online son los principales beneficiados por la inclusión de AMP en los resultados de búsqueda.

Normalmente es necesario generar una versión AMP de la web en /amp/ y en Google Search Console podremos ver si la detecta.

Page 8: Amp que es y en que puede ayudarnos

AMP ¿Qué es y para qué sirve? (III)En la velocidad de carga también se nota:

CON AMP

SIN AMP

Page 9: Amp que es y en que puede ayudarnos

AMP ¿Qué es y para qué sirve? (III)En la velocidad de carga también se nota:

CON AMP

SIN AMP

Page 10: Amp que es y en que puede ayudarnos

Rendimiento de AMP El javascript (el poco que se carga) se carga de forma asíncrona.

En el código de una página AMP se especifica el tamaño de los elementos para que se carguen de forma optimizada y controlada.

Las peticiones externas no están permitidas, por lo que se eliminan retrasos y esperas sin sentido.

Page 11: Amp que es y en que puede ayudarnos

Ventajas de AMP Velocidad de carga rápida al tener un diseño simple y limpio.

Ahorro de ancho de banda en los dispositivos móviles.

Apariencia simple y centrada en darle importancia al contenido.

Framework fácil de personalizar, pero estricto con los elementos que se insertan.

Page 12: Amp que es y en que puede ayudarnos

Google y AMP Como hemos dicho antes, Google impulsa AMP y desde 2016

(hace poco), aparece en los resultados de búsqueda.

Desde Google Search Engine podemos ver como Google indexa las páginas AMP.

Page 13: Amp que es y en que puede ayudarnos

Errores AMP La versión AMP no aparece en los resultados de búsqueda hasta

que Google Search Console no detecta ningún error en la pagina. Los errores que pueden aparecer pueden ser desde un error de

sintaxis en las etiquetas del framework hasta la inserción de un javascript no permitido.

Page 14: Amp que es y en que puede ayudarnos

Wordpress y AMP Actualmente AMP se puede implementar fácilmente en cualquier

CMS mediante los módulos o plugins existentes.

En Wordpress existe un plugin oficial para implementar AMP: https://es.wordpress.org/plugins/amp/

Podemos usar otros plugins como “Facebook Instant Articules & Google AMP Pages by PageFrog” o “Glue para Yoast SEO & AMP” para darle una apariencia diferente a las páginas AMP usando el plugin oficial como base.

Page 15: Amp que es y en que puede ayudarnos

Esto ha sido todo…

…pero puedes encontrar más información sobre AMP en nuestro blog: https://raiolanetworks.es/blog/

También puedes encontrarnos en las principales redes sociales: Facebook: https://www.facebook.com/RaiolaNetworks Twitter: https://twitter.com/RaiolaNetworks Google Plus: https://plus.google.com/+RaiolaNetworksSLLugo/ Correo electrónico: [email protected]