This document discusses implementing Accelerated Mobile Pages (AMP) to improve mobile search visibility and user experience. It recommends verifying content compatibility, creating valid AMP HTML, customizing styling and components, testing pages, tracking analytics, and monitoring for errors. Implementing AMP is suggested for media sites, blogs, and sites with slow mobile pages, as long as a consistent mobile experience can be provided without an independent mobile site version.
4. I Blog I Speak I’m Featured
I’m Aleyda Solis
#ampsuccess at #digitalolympus by @aleyda from @orainti
5. Why & When To Implement AMP?
#ampsuccess at #digitalolympus by @aleyda from @orainti
6. AMP went live almost a year ago already…
#ampsuccess at #digitalolympus by @aleyda from @orainti
http://searchengineland.com/amp-top-
stories-now-live-243314
7. A “simpler” HTML & CSS, using optimized JS &
Google AMP Cache to serve your mobile pages
#ampsuccess at #digitalolympus by @aleyda from @orainti
8. #ampsuccess at #digitalolympus by @aleyda from @orainti
Mobile Responsive Non-AMP Mobile AMP
To deliver a faster & safer Mobile Web experience
9. Initially released for publishers is now a
requirement to be included in the News Carousel
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://www.seroundtable.com/google-
amp-only-news-carousel-21717.html
10. Although is not a ranking factor (yet)…
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://www.seroundtable.com/google-
amp-canonical-ranking-23308.html
11. “AMP optimized news articles appearing within
Google's Top Stories on mobile have skyrocketed”
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://www.rankranger.com/blog/amp-
google-news-results-spikes
12. And not only in the News Carousels
#ampsuccess at #digitalolympus by @aleyda from @orainti
AMP article rich results
Can be free-standing in the results
page, or embedded in a carousel of
similar result types. All AMP article
rich results are also rich results.
AMP non-rich results
A basic, non-graphical search result
pointing to the AMP page.
13. They are given preference over App deep links
#ampsuccess at #digitalolympus by @aleyda from @orainti
http://searchengineland.com/google-will-show-
amp-urls-app-deep-link-urls-mobile-results-259204
14. And are being expanded, now also for image results
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://www.seroundtable.com/google-
amp-canonical-ranking-23308.html
15. CDNs have started to support it too
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://www.cloudflare.com/website-
optimization/accelerated-mobile-links/
16. As well as Ad networks
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://amphtml.wordpress.com/2017/01/30/ads-
on-the-web-will-get-better-with-amp-heres-how/
17. And although more complex functionality
support for e-commerce is still in progress
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://www.ampproject.org/es/roadmap/
18. e-commerce sites have started to test them too
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://amphtml.wordpress.com/2016/08/22/
getting-started-with-amp-for-e-commerce/
https://amphtml.wordpress.com/2016/06/30/
browse-ebay-with-style-and-speed/
19. The additional organic search visibility
& traffic can be impressive
#ampsuccess at #digitalolympus by @aleyda from @orainti
20. But there are some already well-known cons
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://80x24.net/post/the-problem-with-amp/
21. Not showing your own URLs in the browser
#ampsuccess at #digitalolympus by @aleyda from @orainti
22. This is known by the AMP team
and meant to be fixed
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://amphtml.wordpress.com/
2017/01/13/why-amp-caches-exist/
http://www.thesempost.com/google-
easier-link-share-url-amp/
23. Providing what can be a over-simplified
mobile AMP experience when using plugins
#ampsuccess at #digitalolympus by @aleyda from @orainti
Mobile Responsive Non-AMP Mobile AMP
<>
24. That can end-up causing this
#ampsuccess at #digitalolympus by @aleyda from @orainti
25. As well as generating too many pages to handle if
you have an independent mobile version
#ampsuccess at #digitalolympus by @aleyda from @orainti
Desktop Non-AMP Mobile AMPIndependent Mobile Non-AMP
https://m.yourname.com/post-a/?amp=1
https://m.yourname.com/post-a/
https://www.yourname.com/post-a/
26. #ampsuccess at #digitalolympus by @aleyda from @orainti
When does it makes sense to implement AMP
at the moment then?
You’re in the
media, news
industry or have a
blog
Your current
mobile page speed
sucks
You can
personalize
AMP to have a
similar UX &
functionality than
your current
site
You ideally don’t
have an
independent
mobile version
28. First verify that your content type &
functionality are AMP supported
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://www.ampproject.org/
docs/reference/components
https://www.ampproject.org/
es/roadmap/
29. Create your AMP HTMLs based on specifications,
including the relevant structured data
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://www.ampproject.org/
docs/get_started/create
30. Replace components & tags to be included
with the relevant AMP markup, such as images
#ampsuccess at #digitalolympus by @aleyda from @orainti
31. Embed your AMP custom CSS inline,
only one stylesheet per page
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://www.ampproject.org/docs/guides/
responsive/style_pages
32. You can see directly AMP implementation
examples & demos for the desired functionality
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://ampbyexample.com/
33. As well as edit & test it in the AMP Playground
to check if it would pass the validation
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://ampbyexample.com/playground/
34. Pair your “canonical” pages with your AMP ones
#ampsuccess at #digitalolympus by @aleyda from @orainti
Non-AMP AMP
35. If for some reason you’re only using AMP pages,
they should be tagged as your canonical ones
#ampsuccess at #digitalolympus by @aleyda from @orainti
Canonical AMP
36. If you have a Wordpress based site
you can use the official free AMP Plugin
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://wordpress.org/plugins-wp/amp/
37. Yoast Glue for AMP facilitates the implementation
of the required markup & customization too
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://wordpress.org/plugins-wp/glue-for-yoast-seo-amp/
38. As well as the PageFrog plugin
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://wordpress.org/plugins-wp/pagefrog/
39. The goal is to provide the most consistent user
experience through your “extended” AMP pages
#ampsuccess at #digitalolympus by @aleyda from @orainti
Mobile Non-AMP Mobile AMP
=
40. If at some point you disable them, remember
these need to be 301-redirected to avoid errors
#ampsuccess at #digitalolympus by @aleyda from @orainti
41. #ampsuccess at #digitalolympus by @aleyda from @orainti
https://medium.com/relay-media/whats-going-on-
with-amp-analytics-5595af2dcc71#.2it72dhgb
It’s also critical to track them,
thinking on their “cross-domain” design
42. Google Analytics supports AMP through
the amp-analytics component
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://developers.google.com/analytics/
devguides/collection/amp-analytics/
43. You can implement it via GTM too
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://www.simoahava.com/analytics/accelerated-
mobile-pages-via-google-tag-manager/
44. Once you finish, verify your implementation
using The OnPage AMP Checklist
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://en.onpage.org/knowledge-
base/tutorials/amp/
45. You can additionally validate your AMP pages
with the AMP Project Validator
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://validator.ampproject.org/
46. Using Chrome DevTools
#ampsuccess at #digitalolympus by @aleyda from @orainti
http://searchengineland.com/chromes-devtools-
seo-10-ways-use-seo-audits-266433
47. The crawlers that already support AMP
validation, like SEMrush Site Audit
#ampsuccess at #digitalolympus by @aleyda from @orainti
48. Or by configuring Screaming Frog using
custom extraction
#ampsuccess at #digitalolympus by @aleyda from @orainti
49. Monitor potential remaining errors in
the Google Search Console AMP Report
#ampsuccess at #digitalolympus by @aleyda from @orainti
50. Prioritize to fix “critical” issues affecting
most & more important pages
#ampsuccess at #digitalolympus by @aleyda from @orainti
51. Besides invalid code usage in AMP pages,
the most common issue is “content mismatch”
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://support.google.com/
webmasters/answer/6328309
52. As well as errors in structured data,
although this is not critical
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://search.google.com/
structured-data/testing-tool
53. You can directly see in the GSC report the pages
affected & details regarding each issue
#ampsuccess at #digitalolympus by @aleyda from @orainti
54. And select to validate them there directly
to verify in which line the problem is to fix
#ampsuccess at #digitalolympus by @aleyda from @orainti
https://search.google.com/
search-console/amp
55. It can be a rollercoaster, although one with a
positive trend if critical errors are handled
#ampsuccess at #digitalolympus by @aleyda from @orainti
56. Maximizing your mobile search visibility
#ampsuccess at #digitalolympus by @aleyda from @orainti
57. While providing the most possibly
consistent mobile user experience
#ampsuccess at #digitalolympus by @aleyda from @orainti