Optimising AMP (Accelerated Mobile Pages) #SMXLondon
1. #optimisingamp at #smxlondon by @aleyda from @orainti
OPTIMISING AMP
A RESULTS ORIENTED AMP
IMPLEMENTATION PROCESS
#optimisingamp at #smxlondon by @aleyda from @orainti
2. #optimisingamp at #smxlondon by @aleyda from @orainti#optimisingamp at #smxlondon by @aleyda from @orainti
Welcome to Westworld AMPworld
3. #optimisingamp at #smxlondon by @aleyda from @orainti#optimisingamp at #smxlondon by @aleyda from @orainti
“Can you please give input
and optimisation support
for AMP?”
-An SEO client
4. #optimisingamp at #smxlondon by @aleyda from @orainti
The goal of your AMP optimisation process should be
then to maximise your AMP results…
5. #optimisingamp at #smxlondon by @aleyda from @oraintihttps://www.semrush.com/blog/amp-mistakes-semrush-study/
Avoiding common implementation errors that won’t allow
you to serve your AMP pages in Mobile SERPs
6. #optimisingamp at #smxlondon by @aleyda from @oraintihttps://kinsta.com/blog/disable-google-amp/
While implementing it in relevant scenarios where it is
feasible to achieve results aligned with the Website goals
7. #optimisingamp at #smxlondon by @aleyda from @orainti
* SEO Consultant & Founder at Orainti
* SEO Speaker at +100 Events in +20 countries
* Author “SEO. Las Claves Esenciales.”
* Blogger in Search Engine Land & Search Engine Journal
* Featured in Forbes, Entrepreneur, Huffington Post
* European Search Personality of the Year - 2018
I’m Aleyda Solis and I’ll show you how today
8. #optimisingamp at #smxlondon by @aleyda from @orainti
Start by assessing if
AMP is relevant for
your site…
#optimisingamp at #smxlondon by @aleyda from @orainti
9. #optimisingamp at #smxlondon by @aleyda from @oraintihttps://www.seroundtable.com/google-amp-canonical-ranking-23308.html
Don’t use AMP expecting it
to be an organic search ranking factor
10. #optimisingamp at #smxlondon by @aleyda from @orainti
Or to become a replacement of your own
mobile site in case you don’t have one
11. #optimisingamp at #smxlondon by @aleyda from @orainti
AMP will be usually relevant in these 3 scenarios
You’re building a new
site and AMP offers the
best way to implement
your desired
functionality so you will
use it as a canonical
version for it
Your own mobile site
speed issues can’t and
won’t be fixed in the
mid-long term
You need to be
included in Google’s
Top Stories Carousel
ASAP and can’t wait
any longer*
You can replicate your
original mobile Website
look and feel,
functionality and
content with AMP
Ok, use AMP
* https://amphtml.wordpress.com/2018/01/09/improving-urls-for-amp-pages/amp/
12. #optimisingamp at #smxlondon by @aleyda from @orainti
Is this your case? If so, then here’s how to
maximise your AMP results…
#optimisingamp at #smxlondon by @aleyda from @orainti
13. #optimisingamp at #smxlondon by @aleyda from @orainti#optimisingamp at #smxlondon by @aleyda from @orainti
Plan and specify the AMP implementation
based on your original site’s functionalities
14. #optimisingamp at #smxlondon by @aleyda from @orainti
Verify if your required Web functionalities can be
developed w/ AMP by revising its specification
https://www.ampproject.org/docs/reference/components
15. #optimisingamp at #smxlondon by @aleyda from @orainti
There might be components that is better to pass or use only
for non-sensible content until there’s a clear search support
https://amphtml.wordpress.com/2018/05/03/dynamic-geo-personalization/
16. #optimisingamp at #smxlondon by @aleyda from @oraintihttps://www.sistrix.com/
See what your competitors and industry leaders are ranking
for with AMP already, to prioritise those content areas
17. #optimisingamp at #smxlondon by @aleyda from @orainti
Desktop Web
Independent Mobile Web Version
AMP version
Canonicalize to
Independent Mobile Web in AMP
Canonicalizes to
Desktop Web
vs
Identify the best way to include AMP in your site,
especially if you have an independent Mobile one already
18. #optimisingamp at #smxlondon by @aleyda from @orainti
Reusing your independent mobile site structure as your
AMP version might be a good way to simplify it
19. #optimisingamp at #smxlondon by @aleyda from @orainti
It’s fundamental to redirect desktop visitors to the relevant
version too, as it is done with independent mobile URLs
20. #optimisingamp at #smxlondon by @aleyda from @orainti
Ideally your AMP pages should use a responsive Web
design so they also look good on desktop too
Better than this
21. #optimisingamp at #smxlondon by @aleyda from @orainti
If you’re using hreflang annotations for international sites
they should be also included in your AMP versions
https://ampbyexample.com/introduction/internationalization/
22. #optimisingamp at #smxlondon by @aleyda from @orainti
Like this
https://ampbyexample.com/introduction/internationalization/
23. #optimisingamp at #smxlondon by @aleyda from @orainti
Google also requires AMP URLs to include the same
content than canonical ones to be shown in SERPs
https://webmasters.googleblog.com/2017/11/engaging-users-through-high-quality-amp.html
To avoid this
24. #optimisingamp at #smxlondon by @aleyda from @orainti
But you should also avoid an inconsistent UI between the
two that will have a negative impact on user engagement
<>ORIGINAL MOBILE PAGE AMP VERSION
25. #optimisingamp at #smxlondon by @aleyda from @orainti
It’s fundamental but most AMP versions have this issue
<>ORIGINAL MOBILE PAGE AMP VERSION
26. #optimisingamp at #smxlondon by @aleyda from @orainti
For real. How the user behaviour can be the same in both?
<>ORIGINAL MOBILE PAGE AMP VERSION
27. #optimisingamp at #smxlondon by @aleyda from @orainti
If you do this it’s then reasonable to end-up
having this engagement gap
28. #optimisingamp at #smxlondon by @aleyda from @orainti
The goal is to keep the UI, content and functionality
consistent when using non-canonical AMP
=ORIGINAL MOBILE PAGE AMP VERSION
29. #optimisingamp at #smxlondon by @aleyda from @orainti
Which can be made easier if your independent mobile site
is used directly as an AMP version too
30. #optimisingamp at #smxlondon by @aleyda from @orainti
Minimise errors by
validating the AMP
implementation
through the
development process
#optimisingamp at #smxlondon by @aleyda from @orainti
31. #optimisingamp at #smxlondon by @aleyda from @orainti
Most of AMP errors are caused by using tags,
attributes and values that are not allowed in it
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/
34. #optimisingamp at #smxlondon by @aleyda from @orainti
Avoid them by sharing not only the required AMP markup
but also the validation errors when starting the development
+
https://www.ampproject.org/docs/reference/validation_errors
35. #optimisingamp at #smxlondon by @aleyda from @orainti
And don’t forget to opt-in for Google Analytics AMP
Client ID API to correctly track AMP on Cache
https://support.google.com/analytics/answer/7486764
36. #optimisingamp at #smxlondon by @aleyda from @orainti
Actively check your top AMP pages templates compliance as
soon as they are released for testing with the AMP validator
https://validator.ampproject.org/
37. #optimisingamp at #smxlondon by @aleyda from @orainti
Crawl the whole site before launching it, simulating the
mobile googlebot to look for remaining issues
https://www.deepcrawl.com/
38. #optimisingamp at #smxlondon by @aleyda from @orainti
Prioritise to fix the critical issues before launch,
to be able to show AMP in Mobile SERPs
https://sitebulb.com/
39. #optimisingamp at #smxlondon by @aleyda from @orainti
Monitor AMP impact
after launch to fix any
remaining issues and
identify opportunities
#optimisingamp at #smxlondon by @aleyda from @orainti
40. #optimisingamp at #smxlondon by @aleyda from @orainti
After releasing AMP look for the remaining errors
in the new Google Search Console AMP report
41. #optimisingamp at #smxlondon by @aleyda from @orainti
Select the errors in the report and start
checking those affecting more pages
42. #optimisingamp at #smxlondon by @aleyda from @orainti
This is now made easier by the new search console, that
allows to revise the code, linking to the live validation
43. #optimisingamp at #smxlondon by @aleyda from @orainti
If the errors still exist you can share directly the report
with the development team so they can revise them
#ampoptimization by @aleyda from @orainti at #ampconf
44. #optimisingamp at #smxlondon by @aleyda from @orainti
Anyone with the link will be able to have a limited
public view of the specific shared report
#ampoptimization by @aleyda from @orainti at #ampconf
45. #optimisingamp at #smxlondon by @aleyda from @orainti
Once errors are fixed you can verify again and if valid, you
can inform about the change w/ the “validate fix” option
46. #optimisingamp at #smxlondon by @aleyda from @orainti
This new Google Search Console option will submit the fixes
to be updated, which will be usually done in 2 or 3 days
47. #optimisingamp at #smxlondon by @aleyda from @orainti
You’ll be able to see the validation progress
in the overall view from the AMP report
48. #optimisingamp at #smxlondon by @aleyda from @orainti
As well as the AMP impressions increase
while the errors decrease…
50. #optimisingamp at #smxlondon by @aleyda from @orainti
Monitor your top AMP pages and the queries giving visibility
to each to optimise further or expand your content
51. #optimisingamp at #smxlondon by @aleyda from @orainti
Use rank trackers to monitor AMP impact on rankings &
traffic of targeted queries & identify more opportunities
https://www.seomonitor.com/
52. #optimisingamp at #smxlondon by @aleyda from @orainti
Do the same with your competitors to see which relevant
queries they’re already targeting w/ AMP that you’re not yet
https://www.seomonitor.com/
53. #optimisingamp at #smxlondon by @aleyda from @orainti
This will allow to improve your AMP content visibility
and to continuously expand it in a cost-effective way
54. #optimisingamp at #smxlondon by @aleyda from @orainti
But what will
happen if at some
point you don’t
want to continue
and decide to
disable AMP?
#optimisingamp at #smxlondon by @aleyda from @orainti
55. #optimisingamp at #smxlondon by @aleyda from @orainti
Just eliminate the amphtml tags, update the cache &
301-redirect each AMP page to their canonical URLs
https://developers.google.com/search/docs/guides/remove-amp
56. #optimisingamp at #smxlondon by @aleyda from @orainti
You now have what you need to maximise
with your AMP results… It’s time to win!
#optimisingamp at #smxlondon by @aleyda from @orainti