¿Cómo sacar el máximo provecho a AMP (Accelerated Mobile Pages)? Aquí tienes criterios, pasos, herramientas para sacar el máximo provecho a las páginas aceleradas para móviles.

1. AMPCómo Optimizar y Sacar el Máximo Provecho
#optimizandoamp por @aleyda de @orainti en #SSW18

2. #ampoptimization by @aleyda from @orainti at #ampconf#optimizandoamp por @aleyda de @orainti en #SSW18
Hola, soy Aleyda Solís
Fundadora &
Consultora
SEO en Orainti.
Blogger en
SEL & SEJ.
Autora de
“SEO. Las
Claves
Esenciales”.
Conferenciante
en +100 Eventos
en 20 países.
Encuéntrame
en @aleyda y
orainti.com

3. #ampoptimization by @aleyda from @orainti at #ampconf
Mi trabajo
como SEO es
ayudar a las
empresas a
conectar con
ellos…

4. #ampoptimization by @aleyda from @orainti at #ampconf
Algunas de
ellas son
marcas que
conocéis
#optimizandoamp por @aleyda de @orainti en #SSW18

5. #ampoptimization by @aleyda from @orainti at #ampconf#ampoptimization by @aleyda from @orainti at #ampconf
La velocidad de la Web es crítica para lograrlo
https://www.thinkwithgoogle.com/insights-inspiration/research-data/need-mobile-speed-how-mobile-latency-impacts-publisher-revenue/

6. #ampoptimization by @aleyda from @orainti at #ampconf
Lo cual se hará
aún más
importante con
la actualización
de velocidad
móvil de Google

7. #ampoptimization by @aleyda from @orainti at #ampconf
Sin embargo, esta es nuestra realidad en velocidad
https://www.thinkwithgoogle.com/insights-inspiration/research-data/need-mobile-speed-how-mobile-latency-impacts-publisher-revenue/

8. #ampoptimization by @aleyda from @orainti at #ampconf
En España también
https://testmysite.withgoogle.com/

9. #ampoptimization by @aleyda from @orainti at #ampconf
Y no solo con las Webs de noticias,
también las transaccionales
https://testmysite.withgoogle.com/

10. #ampoptimization by @aleyda from @orainti at #ampconf
Las Webs grandes tienen plataformas restrictivas
y las pequeñas pocos recursos para el WPO
#optimizandoamp por @aleyda de @orainti en #SSW18https://developers.google.com/speed/docs/insights/rules

11. #ampoptimization by @aleyda from @orainti at #ampconf
Por eso se desarrolló AMP, para hacer más fácil
seguir las mejores prácticas de velocidad Web
#ampoptimization by @aleyda from @orainti at #ampconf

12. #ampoptimization by @aleyda from @orainti at #ampconf
Las páginas AMP se pueden publicar
“paralelamente” a tu Web (lenta) actual
#optimizandoamp por @aleyda de @orainti en #SSW18
https://www.forbes.com/sites/alanwolk/2017/09/07/apple-is-
losing-its-cool-factor-and-thats-a-problem-if-they-want-to-break-
into-tv/#4707740c71f8
https://www.forbes.com/sites/alanwolk/2017/09/07/apple-
is-losing-its-cool-factor-and-thats-a-problem-if-they-want-to-
break-into-tv/amp/
Web Móvil Original URL en AMP

13. #ampoptimization by @aleyda from @orainti at #ampconf
Para que se muestren en su lugar en los resultados
de búsqueda móviles con esta velocidad
#optimizandoamp por @aleyda de @orainti en #SSW18
Web Móvil Original URL en AMP

14. #ampoptimization by @aleyda from @orainti at #ampconf
Por ello Google hizo de AMP un requerimiento
para ser incluido en las “Top Stories”
#optimizandoamp por @aleyda de @orainti en #SSW18
Resultados AMP en el Carrusel
AMP en Resultados Orgánicos

15. #ampoptimization by @aleyda from @orainti at #ampconf#optimizandoamp por @aleyda de @orainti en #SSW18
Llegando a ofrecer más visibilidad y tráfico
orgánico a las Webs que lo han implementado
AMP Rich Results
AMP Non-Rich Results
Non-AMP Results
Más visibilidad a través
de resultados AMP que
No-AMP

16. #ampoptimization by @aleyda from @orainti at #ampconf#ampoptimization by @aleyda from @orainti at #ampconf
Lo cual ha hecho que se incentive su uso aún más
y ya no sólo por las Webs de noticias
https://www.semrush.com/sensor/

17. #ampoptimization by @aleyda from @orainti at #ampconf
Ahora AMP ofrece también más funcionalidades a
través de componentes para todo tipo de Webs
https://www.ampproject.org/learn/showcases/

18. #ampoptimization by @aleyda from @orainti at #ampconf
Ya no sólo es una forma de “hacer tu Web más
rápida más fácilmente” sino de desarrollarla
#optimizandoamp por @aleyda de @orainti en #SSW18https://developers.googleblog.com/2018/02/amp-stories-bringing-visual.html

19. #ampoptimization by @aleyda from @orainti at #ampconf
Y está resolviendo las “desventajas” que ha tenido
su implementación para acelerar más su adopción
https://amphtml.wordpress.com/2018/01/09/improving-urls-for-amp-pages/amp/

20. #ampoptimization by @aleyda from @orainti at #ampconf
Sin embargo,
+70% de los
medios con AMP
tienen errores en
su implementación
https://www.semrush.com/blog/amp-mistakes-semrush-study/

21. #ampoptimization by @aleyda from @orainti at #ampconf
Valida la
implementació
n de AMP antes y
después del
lanzamiento
priorizando
problemas
críticos
Valora el uso
de AMP vs. tus
propias
necesidades de
velocidad y
capacidad
Durante
Después
Es fundamental evitar estos problemas y maximizar
resultados con un proceso de optimización
Antes
Monitoriza el
impacto en
visibilidad de tus
páginas AMP para
priorizar
esfuerzos
#optimizandoamp por @aleyda de @orainti en #SSW18

22. #ampoptimization by @aleyda from @orainti at #ampconf
La tasa de rebote de mi Web se
ha disparado después de lanzar
la versión AMP
Alguien que no valoró correctamente la implementación
#optimizandoamp por @aleyda de @orainti en #SSW18

23. #ampoptimization by @aleyda from @orainti at #ampconf
VALORAEl uso de AMP vs. tus propias necesidades,
capacidad de implementación y expectativas
#optimizandoamp por @aleyda de @orainti en #SSW18

24. #ampoptimization by @aleyda from @orainti at #ampconf
Comienza por verificar que tus expectativas están
alineadas con lo que AMP puede ofrecerte
#optimizandoamp por @aleyda de @orainti en #SSW18

25. #ampoptimization by @aleyda from @orainti at #ampconf
Tienes problemas
de velocidad
móvil
Quieres que tu
Web sea incluida
en los resultados
de Carrusel de
Google
Estás
desarrollando
una Web nueva y
deseas la mejor
experiencia y
rapidez
fácilmente
AMP puede ser usualmente una solución
en 3 escenarios comunes
#optimizandoamp por @aleyda de @orainti en #SSW18

26. #ampoptimization by @aleyda from @orainti at #ampconf#ampoptimization by @aleyda from @orainti at #ampconf
Verifica que las funcionalidades de tu Web pueden
ser implementadas con los componentes
https://www.ampproject.org/docs/reference/components

27. #ampoptimization by @aleyda from @orainti at #ampconf
Valida con tu equipo de desarrollo si tienes la
capacidad y flexibilidad de usarlos
https://ampbyexample.com/

28. #ampoptimization by @aleyda from @orainti at #ampconf
Toma esto en cuenta eligiendo la forma más
costo-efectiva de integrar AMP en tu Web
AMP
canónica
Sitio Web móvil
independiente
brand.com
m.brand.com
brand.com
m.brand.com
m.brand.com/amp
AMP
canónica
Sitio Web Responsive
o Dinámico
brand.com
brand.com
brand.com/amp
#optimizandoamp por @aleyda de @orainti en #SSW18
AMP
no-canónica
AMP
no-canónica

29. #ampoptimization by @aleyda from @orainti at #ampconf
La complejidad puede ser mayor cuando se elige
usar AMP con una Web móvil independiente
Web de Escritorio
Versión Web Móvil Independiente
Versión AMP
Canonicaliza a
Versión Web Móvil Independiente en AMP
Canonicaliza a
Web de Escritorio
vs
#optimizandoamp por @aleyda de @orainti en #SSW18

30. #ampoptimization by @aleyda from @orainti at #ampconf
Si estás usando etiquetas hreflang,
deben ser incluidas en tus páginas AMP
https://ampbyexample.com/introduction/internationalization/

31. #ampoptimization by @aleyda from @orainti at #ampconf
Lo que se vería así si usas páginas AMP no-
canónicas junto con una Web móvil independiente
https://ampbyexample.com/introduction/internationalization/

32. #ampoptimization by @aleyda from @orainti at #ampconf#ampoptimization by @aleyda from @orainti at #ampconf
Google también requiere que las páginas AMP
incluyan el mismo contenido que las originales
https://webmasters.googleblog.com/2017/11/engaging-users-through-high-quality-amp.html

33. #ampoptimization by @aleyda from @orainti at #ampconf
Esto significa que las páginas en AMP no pueden
ser usadas para mostrar contenido distinto
NO HAGAS ESTO

34. #ampoptimization by @aleyda from @orainti at #ampconf
Una interfaz inconsistente también tendrá un
impacto negativo en el comportamiento de usuario
Original Mobile URL AMP URL
<>
#optimizandoamp por @aleyda de @orainti en #SSW18
WEB ORIGINAL VERSIÓN AMP

35. #ampoptimization by @aleyda from @orainti at #ampconf
El objetivo debe ser de mantener la interfaz, el
contenido y funcionalidades consistentes en ambas
#optimizandoamp por @aleyda de @orainti en #SSW18
=WEB ORIGINAL VERSIÓN AMP

36. #ampoptimization by @aleyda from @orainti at #ampconf
Siguiendo siempre las buenas prácticas
de optimización móvil
#ampoptimization by @aleyda from @orainti at #ampconf
NO HAGAS ESTO

37. #ampoptimization by @aleyda from @orainti at #ampconf
Y si en algún momento deseas deshabitar AMP,
debes referir el tráfico a tu Web original
https://developers.google.com/search/docs/guides/remove-amp
ELIMINA LA ETIQUETA AMPHTML Y
REDIRIGE CON 301 A LAS URLS CANÓNICAS

38. #ampoptimization by @aleyda from @orainti at #ampconf
Es valorar la viabilidad y el
propósito de implementar AMP en
tu Web para poder planificar de
forma efectiva.
#optimizandoamp por @aleyda de @orainti en #SSW18

39. #ampoptimization by @aleyda from @orainti at #ampconf
La mayoría de las páginas
estaban mostrando errores
después de lanzar AMP y no
podemos resolverlos todos
Alguien que no validó la implementación AMP
#optimizandoamp por @aleyda de @orainti en #SSW18

40. #ampoptimization by @aleyda from @orainti at #ampconf
VALIDATu implementación AMP antes y después
de lanzar priorizando los problemas críticos
#optimizandoamp por @aleyda de @orainti en #SSW18

41. #ampoptimization by @aleyda from @orainti at #ampconf
Comparte el etiquetado AMP requerido así como los
errores de validación al planificar el desarrollo
#ampoptimization by @aleyda from @orainti at #ampconfhttps://www.ampproject.org/docs/reference/validation_errors
+

42. #ampoptimization by @aleyda from @orainti at #ampconf
Existen un par de errores adicionales que específicos
de Google que deben también ser validados
#ampoptimization by @aleyda from @orainti at #ampconfhttps://support.google.com/webmasters/answer/7320015

43. #ampoptimization by @aleyda from @orainti at #ampconf
Toma en cuenta los errores más comunes de AMP
y deja tiempo y recursos para verificarlos
Name of Mistake % of Affected Sites
Disallowed attribute 45 %
Disallowed tag 44 %
Invalid attribute value 38 %
Invalid URL protocol 36 %
Invalid URL 34 %
Mandatory tag ancestor with hint 26 %
Disallowed style attribute 20 %
Mandatory attribute missing 13 %
Wrong parent tag 12 %
Missing URL 10 %
https://www.semrush.com/blog/amp-mistakes-semrush-study/

44. #ampoptimization by @aleyda from @orainti at #ampconf
Valida manualmente durante el desarrollo
el código de tus páginas más importantes
#ampoptimization by @aleyda from @orainti at #ampconfhttps://validator.ampproject.org/

45. #ampoptimization by @aleyda from @orainti at #ampconf
Puedes usar también ngrok para validar
las páginas que no son públicas
#ampoptimization by @aleyda from @orainti at #ampconfhttps://developers.google.com/search/docs/guides/debug#testing-firewalled-pages

46. #ampoptimization by @aleyda from @orainti at #ampconf#ampoptimization by @aleyda from @orainti at #ampconfhttps://www.deepcrawl.com/
Rastrea todo el sitio antes de lanzarlo, simulando al
googlebot móvil para buscar problemas pendientes

47. #ampoptimization by @aleyda from @orainti at #ampconf
Prioriza los problemas críticos (no advertencias)
antes de lanzar para mostrar AMP en resultados
#ampoptimization by @aleyda from @orainti at #ampconfhttps://sitebulb.com/

48. #ampoptimization by @aleyda from @orainti at #ampconf
Estos serán directamente segmentados para ser
descargados, para poder revisar y resolver
#optimizandoamp por @aleyda de @orainti en #SSW18

49. #ampoptimization by @aleyda from @orainti at #ampconf
Después de lanzar busca errores remanentes en el
informe AMP del nuevo Google Search Console
#ampoptimization by @aleyda from @orainti at #ampconf

50. #ampoptimization by @aleyda from @orainti at #ampconf#ampoptimization by @aleyda from @orainti at #ampconf
Elige los errores críticos del informe y comienza
con aquellos que afectan a más páginas

51. #ampoptimization by @aleyda from @orainti at #ampconf
Filtra las páginas para iniciar con las áreas más
importantes y pincha para ver los errores en código

52. #ampoptimization by @aleyda from @orainti at #ampconf
Puedes también revisar la página publicada,
abriéndola directamente en el validador de AMP

53. #ampoptimization by @aleyda from @orainti at #ampconf
Si los errores aún existen puedes compartir el
informe con el equipo de desarrollo para revisar
#ampoptimization by @aleyda from @orainti at #ampconf

54. #ampoptimization by @aleyda from @orainti at #ampconf
Cualquiera que tenga el enlace podrá tener un
acceso público limitado al informe compartido
#ampoptimization by @aleyda from @orainti at #ampconf

55. #ampoptimization by @aleyda from @orainti at #ampconf
Una vez que los errores se han resuelto, puedes
verificar nuevamente y elegir que se “valide"
#optimizandoamp por @aleyda de @orainti en #SSW18

56. #ampoptimization by @aleyda from @orainti at #ampconf
Esta opción en el nuevo Google Search Console
enviará las páginas para que sean actualizadas
#optimizandoamp por @aleyda de @orainti en #SSW18

57. #ampoptimization by @aleyda from @orainti at #ampconf
Recibirás una notificación también
cuando ya estén resueltas
#optimizandoamp por @aleyda de @orainti en #SSW18

58. #ampoptimization by @aleyda from @orainti at #ampconf
Y podrás ver el progreso de la validación de todos
los problemas con el informe general de AMP
#optimizandoamp por @aleyda de @orainti en #SSW18

59. #ampoptimization by @aleyda from @orainti at #ampconf
Haz esto resolviendo todos los errores críticos
y luego puedes seguir con las “advertencias”
#optimizandoamp por @aleyda de @orainti en #SSW18

60. #ampoptimization by @aleyda from @orainti at #ampconf
Se trata de validar durante todo
el proceso de implementación
priorizando los errores críticos
#optimizandoamp por @aleyda de @orainti en #SSW18

61. #ampoptimization by @aleyda from @orainti at #ampconf
No estamos seguros cuáles
términos y páginas tienen el
mejor impacto en AMP
Someone who didn’t monitored the AMP implementation
#optimizandoamp por @aleyda de @orainti en #SSW18

62. #ampoptimization by @aleyda from @orainti at #ampconf
MONITORIZATus resultados de AMP para priorizar continuamente tus
esfuerzos durante el proceso
#optimizandoamp por @aleyda de @orainti en #SSW18

63. #ampoptimization by @aleyda from @orainti at #ampconf
Da seguimiento a las páginas indexadas: ¿Están ya
ahí incluidas las más importantes de tu Web?
#optimizandoamp por @aleyda de @orainti en #SSW18

64. #ampoptimization by @aleyda from @orainti at #ampconf
Usa el informe de Search Analytics del Google
Search Console para verificar tus resultados AMP
#optimizandoamp por @aleyda de @orainti en #SSW18

65. #ampoptimization by @aleyda from @orainti at #ampconf
Analiza cuáles son los términos con las mejores
métricas para cada tipo de resultado
#optimizandoamp por @aleyda de @orainti en #SSW18

66. #ampoptimization by @aleyda from @orainti at #ampconf
Verifica los términos más importantes para cada
tipo de página para identificar oportunidades
#ampoptimization by @aleyda from @orainti at #ampconf

67. #ampoptimization by @aleyda from @orainti at #ampconf
Puedes usar índices de posicionamiento para
obtener los términos de tu competencia con AMP
#ampoptimization by @aleyda from @orainti at #ampconfhttps://www.sistrix.com/

68. #ampoptimization by @aleyda from @orainti at #ampconf
Usa herramientas de rank tracking para verificar
los resultados AMP de tus términos objetivos
#ampoptimization by @aleyda from @orainti at #ampconfhttps://www.seomonitor.com/

69. #ampoptimization by @aleyda from @orainti at #ampconf
Puedes monitorizar a tu competencia para buscar
oportunidades en sus términos posicionados
#ampoptimization by @aleyda from @orainti at #ampconfhttps://www.semrush.com/

70. #ampoptimization by @aleyda from @orainti at #ampconf
Haz lo mismo analizando tu posicionamiento vs. el
de tu competencia en el carrusel de Google
#ampoptimization by @aleyda from @orainti at #ampconfhttps://www.rankranger.com/

71. #ampoptimization by @aleyda from @orainti at #ampconf
Verifica cuál es el impacto de esta visibilidad en tu
tráfico y conversión: ¿es consistente y positivo?
#optimizandoamp por @aleyda de @orainti en #SSW18

72. #ampoptimization by @aleyda from @orainti at #ampconf
Se trata de dar seguimiento a tu
indexación, rankings y tráfico AMP
para entender su comportamiento
e identificar oportunidades
#optimizandoamp por @aleyda de @orainti en #SSW18

73. #ampoptimization by @aleyda from @orainti at #ampconf
Valida la
implementació
n de AMP antes y
después del
lanzamiento
priorizando
problemas
críticos
Valora el uso
de AMP vs. tus
propias
necesidades de
velocidad y
capacidad
Durante
Después
Antes
Monitoriza el
impacto en
visibilidad de tus
páginas AMP para
priorizar
esfuerzos
#optimizandoamp por @aleyda de @orainti en #SSW18
Optimizando la planificación, implementación
y monitorización de AMP

74. #ampoptimization by @aleyda from @orainti at #ampconf
Es hora de maximizar tus resultados AMP