Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

AMP Do’s & Don’ts for Superhero Results #SearchCamp

3,307 views

Published on

How to make the most out of AMP? Check out best practices, criteria and rules to follow during an AMP implementation and optimisation process.

Published in: Mobile
  • Be the first to comment

AMP Do’s & Don’ts for Superhero Results #SearchCamp

  1. 1. #ampsuccess by @aleyda from @orainti at #searchcamp AMP Do’s & Don’ts for Superhero Results
  2. 2. #ampsuccess by @aleyda from @orainti at #searchcamp I’m Aleyda Solis
  3. 3. #ampsuccess by @aleyda from @orainti at #searchcamp I help companies to connect with them through organic search results #ampsuccess by @aleyda from @orainti at #searchcamp
  4. 4. #ampsuccess by @aleyda from @orainti at #searchcamp Some are brands you likely know #ampsuccess by @aleyda from @orainti at #searchcamp
  5. 5. #ampsuccess by @aleyda from @orainti at #searchcamp Having a fast mobile Website is one of the fundamental aspects to achieve this goal
  6. 6. #ampsuccess by @aleyda from @orainti at #searchcamp Which will be even more critical with 
 Google’s upcoming mobile first index too
  7. 7. #ampsuccess by @aleyda from @orainti at #searchcamp Users have minimum speed expectations
  8. 8. #ampsuccess by @aleyda from @orainti at #searchcamp Probably because of this
  9. 9. #ampsuccess by @aleyda from @orainti at #searchcamp But this is our speed reality https://www.thinkwithgoogle.com/marketing-resources/data-measurement/mobile-page-speed-new-industry-benchmarks/
  10. 10. #ampsuccess by @aleyda from @orainti at #searchcamp Let’s see: How much time the BBC 
 mobile home page takes to load?
  11. 11. #ampsuccess by @aleyda from @orainti at #searchcamp Ouch https://testmysite.thinkwithgoogle.com
  12. 12. #ampsuccess by @aleyda from @orainti at #searchcamp And the Asos one?
  13. 13. #ampsuccess by @aleyda from @orainti at #searchcamp Yup
  14. 14. #ampsuccess by @aleyda from @orainti at #searchcamp And the House of Fraser?
  15. 15. #ampsuccess by @aleyda from @orainti at #searchcamp I think I’ve made my point
  16. 16. #ampsuccess by @aleyda from @orainti at #searchcamp The solution is to implement WPO principles 
 to make Mobile sites to load fast https://developers.google.com/speed/docs/insights/rules
  17. 17. #ampsuccess by @aleyda from @orainti at #searchcamp But big sites have restrictive legacy platforms 
 & small ones little resources to improve them
  18. 18. #ampsuccess by @aleyda from @orainti at #searchcamp This is why Google launched AMP
  19. 19. #ampsuccess by @aleyda from @orainti at #searchcamp It uses a “simplified” HTML version with optimised resources & cache to serve faster in Mobile SERPs https://www.ampproject.org/learn/overview/
  20. 20. #ampsuccess by @aleyda from @orainti at #searchcamp AMP is published “parallely” and canonicalized 
 to your current (slower) Mobile Web pages 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/ Canonical URL AMP URL
  21. 21. #ampsuccess by @aleyda from @orainti at #searchcamp It’s also cached and pre-rendered 
 by Google when shown in Mobile SERPs Google AMP Viewer URL
 that is pre- rendered Canonical URL of the Page Content served from AMP Cache URL
  22. 22. #ampsuccess by @aleyda from @orainti at #searchcamp Canonical URL AMP URL Making it certainly much faster 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/
  23. 23. #ampsuccess by @aleyda from @orainti at #searchcamp AMP usage is not a ranking factor though
  24. 24. #ampsuccess by @aleyda from @orainti at #searchcamp But Google made it a requirement to be included in the News Carrousel
  25. 25. #ampsuccess by @aleyda from @orainti at #searchcamp as well as shown in organic results 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.
  26. 26. #ampsuccess by @aleyda from @orainti at #searchcamp Which has given it an impressive SERP visibility https://www.rankranger.com/amp-on-google-serp
  27. 27. #ampsuccess by @aleyda from @orainti at #searchcamp As well as traffic to the sites using it AMP Rich Results AMP Non-Rich Results Non-AMP Results More Mobile organic visibility and traffic from AMP than non-AMP results
  28. 28. #ampsuccess by @aleyda from @orainti at #searchcamp Especially media sites 
 that were the first to adopt it Data by Sistrix
  29. 29. #ampsuccess by @aleyda from @orainti at #searchcamp More transactional sites use now AMP though thanks to added functionality, like dynamic content https://www.ampproject.org/learn/showcases/
  30. 30. #ampsuccess by @aleyda from @orainti at #searchcamp However, AMP is not a replacement 
 of your Mobile site
  31. 31. #ampsuccess by @aleyda from @orainti at #searchcamp AMP is a fast “add-on” to your already existing 
 (but still slow) mobile Website Just what happens with Batman as a super hero #ampsuccess by @aleyda from @orainti at #searchcamp
  32. 32. #ampsuccess by @aleyda from @orainti at #searchcamp No real super-power, just added gadgets that improve him Non-Canonical AMP A fast Mobile site Natural superpowers, he doesn’t need add-ons 
 to be improved #ampsuccess by @aleyda from @orainti at #searchcamp AMP is to a fast Mobile site 
 what Batman is to Superman
  33. 33. #ampsuccess by @aleyda from @orainti at #searchcamp Google representatives agree that is not 
 a “bullet-proof” solution for all sites “It wouldn’t be reasonable for us to expect that a group of limited functionalities replace all what you can do at the moment in the mobile environment… AMP its meant to serve in certain use cases” https://www.youtube.com/watch?v=wtOjUwGnrVY
  34. 34. #ampsuccess by @aleyda from @orainti at #searchcamp But due to the way it is presented and 
 its expansion efforts it might look like it
  35. 35. #ampsuccess by @aleyda from @orainti at #searchcamp That’s why there are reservations about it: “AMP 
 has a good intentions… but sacrifice the open Web”
  36. 36. #ampsuccess by @aleyda from @orainti at #searchcamp Which has been also addressed 
 in the past by Google https://medium.com/@pbakaus/why-amp-caches-exist-cd7938da2456
  37. 37. #ampsuccess by @aleyda from @orainti at #searchcamp As well as clarified over time
  38. 38. #ampsuccess by @aleyda from @orainti at #searchcamp The reality is that it does solve a huge 
 Web speed problem https://www.alexkras.com/google-amp-is-winning/
  39. 39. #ampsuccess by @aleyda from @orainti at #searchcamp Although the best to avoid these concerns would be to give fast Mobile pages the same AMP treatment
  40. 40. #ampsuccess by @aleyda from @orainti at #searchcamp Realistically, users don’t even know about AMP https://dejanseo.com.au/amp/
  41. 41. #ampsuccess by @aleyda from @orainti at #searchcamp You shouldn’t then use AMP as a silver bullet Mobile speed solution but a resource in certain scenarios… Thanks Alfred :) #ampsuccess by @aleyda from @orainti at #searchcamp
  42. 42. #ampsuccess by @aleyda from @orainti at #searchcamp To avoid situations like this
  43. 43. #ampsuccess by @aleyda from @orainti at #searchcamp Use AMP when your Mobile site is too slow + can’t be improved and /or you need carrousel inclusion and/or Too slow and can’t be improved Needs to be included in carrousel
  44. 44. #ampsuccess by @aleyda from @orainti at #searchcamp It’s better to avoid AMP with independent mobile sites, move to Responsive/Dynamic serving first Desktop Web Parallel Mobile Web Version with M subdomain AMP version under the M subdomain Google AMP Viewer URL Canonicalize to Generates Why maintaining many non-canonical URLs versions?
  45. 45. #ampsuccess by @aleyda from @orainti at #searchcamp Verify if you can Implement your Mobile Web UI, functionality & all existing content with AMP #ampsuccess by @aleyda from @orainti at #searchcamp
  46. 46. #ampsuccess by @aleyda from @orainti at #searchcamp Your AMP URLs should replicate your own Mobile Web UI, content & functionality, instead of this ORIGINAL MOBILE PAGE AMP VERSION
  47. 47. #ampsuccess by @aleyda from @orainti at #searchcamp From Feb 2018 Google will require that AMP URLs also show the same content than canonical ones https://webmasters.googleblog.com/2017/11/engaging-users-through-high-quality-amp.html
  48. 48. #ampsuccess by @aleyda from @orainti at #searchcamp This means that we cannot use AMP to just show content “previews” and refer to your Mobile site
  49. 49. #ampsuccess by @aleyda from @orainti at #searchcamp If you’re using hreflang annotations, you should 
 also include them in your AMP URLs too https://ampbyexample.com/introduction/internationalization/
  50. 50. #ampsuccess by @aleyda from @orainti at #searchcamp Which would look like this if you use AMP 
 along an independent Mobile Web version Another reason to avoid having an independent Mobile site along AMP
  51. 51. #ampsuccess by @aleyda from @orainti at #searchcamp Validate that your mobile Web functionality 
 can be replicated by using AMP components https://www.ampproject.org/docs/reference/components
  52. 52. #ampsuccess by @aleyda from @orainti at #searchcamp Check with your development team if you 
 have the capacity and flexibility to use them https://ampbyexample.com/
  53. 53. #ampsuccess by @aleyda from @orainti at #searchcamp Plan ahead using the roadmap with a 
 reference of the functionalities to come https://www.ampproject.org/roadmap/
  54. 54. #ampsuccess by @aleyda from @orainti at #searchcamp You can even test while validating your 
 code directly in the AMP Playground editor https://ampbyexample.com/playground/
  55. 55. #ampsuccess by @aleyda from @orainti at #searchcamp As well as to use the templates and pre-built, 
 reusable components offered by AMP Start https://ampstart.com/
  56. 56. #ampsuccess by @aleyda from @orainti at #searchcamp There are also free Wordpress plugins 
 that highly facilitate the implementation
  57. 57. #ampsuccess by @aleyda from @orainti at #searchcamp You can also use freemium and paid 
 WP plugins like AMP for WP and weeblrAMP
  58. 58. #ampsuccess by @aleyda from @orainti at #searchcamp They will allow you to personalise more, but 
 you’ll likely need further development support
  59. 59. #ampsuccess by @aleyda from @orainti at #searchcamp There isn’t an “out of the box” solution, 
 you still will need design personalisation <>ORIGINAL MOBILE PAGE AMP VERSION
  60. 60. #ampsuccess by @aleyda from @orainti at #searchcamp The goal should be to replicate the UI, functionality and content ORIGINAL MOBILE PAGE = AMP VERSION
  61. 61. #ampsuccess by @aleyda from @orainti at #searchcamp Check your AMP visibility potential to prioritise your implementation accordingly #ampsuccess by @aleyda from @orainti at #searchcamp
  62. 62. #ampsuccess by @aleyda from @orainti at #searchcamp Verify the share and type of queries for 
 which AMP results are shown in your industry https://www.sistrix.com/
  63. 63. #ampsuccess by @aleyda from @orainti at #searchcamp Identify which of them are shown along SERP features to prioritise and format your content
  64. 64. #ampsuccess by @aleyda from @orainti at #searchcamp Like this
  65. 65. #ampsuccess by @aleyda from @orainti at #searchcamp Avoid linking to your AMP URLs unless you’re using them as your canonical mobile Web pages #ampsuccess by @aleyda from @orainti at #searchcamp
  66. 66. #ampsuccess by @aleyda from @orainti at #searchcamp There’s an inconsistent mobile user experience 
 when accessing to AMP pages from SERPs
  67. 67. #ampsuccess by @aleyda from @orainti at #searchcamp Which ends-up causing that users link and share 
 the non-canonical Google AMP Viewer URLs
  68. 68. #ampsuccess by @aleyda from @orainti at #searchcamp Start avoiding these by making sure to only 
 link internally to your canonical URLs from AMP
  69. 69. #ampsuccess by @aleyda from @orainti at #searchcamp Remember to redirect based on the user agent to avoid showing AMP URLs to non-mobile visitors DON’T DO THIS DO THIS
  70. 70. #ampsuccess by @aleyda from @orainti at #searchcamp Validate your AMP implementation before and after launch with SEO crawlers to minimise issues #ampsuccess by @aleyda from @orainti at #searchcamp
  71. 71. #ampsuccess by @aleyda from @orainti at #searchcamp +70% of top publishers with AMP across 8 countries (including the UK) have implementation errors https://www.semrush.com/blog/amp-mistakes-semrush-study/
  72. 72. #ampsuccess by @aleyda from @orainti at #searchcamp Most common AMP mistakes are related to usage 
 of disallowed and invalid attributes & tags
  73. 73. #ampsuccess by @aleyda from @orainti at #searchcamp As well as even more fundamental ones THIS IS NOT THE AMP VERSION OF THE ABOVE ARTICLE
  74. 74. #ampsuccess by @aleyda from @orainti at #searchcamp Use the AMP validation errors specification as a reference (to avoid) during implementation https://www.ampproject.org/docs/reference/validation_errors
  75. 75. #ampsuccess by @aleyda from @orainti at #searchcamp Go through your main pages to spot issues 
 by using the AMP Chrome validator extension https://chrome.google.com/webstore/detail/amp-validator/nmoffdblmcmgeicmolmhobpoocbbmknc
  76. 76. #ampsuccess by @aleyda from @orainti at #searchcamp Crawl all of your site pages to validate AMP implementation issues before and after launching https://sitebulb.com/
  77. 77. #ampsuccess by @aleyda from @orainti at #searchcamp SEO crawlers like Sitebulb, Deepcrawl & SEMrush
 already include AMP configuration problems deepcrawl.com
  78. 78. #ampsuccess by @aleyda from @orainti at #searchcamp You’ll be able to obtain and fix quickly those that would generate critical issues in the Search Console
  79. 79. #ampsuccess by @aleyda from @orainti at #searchcamp Monitor AMP implementation errors with GSC AMP report, where you should focus on fixing critical issues first #ampsuccess by @aleyda from @orainti at #searchcamp
  80. 80. #ampsuccess by @aleyda from @orainti at #searchcamp It’s usual to be overwhelmed by the increase of AMP issues when launching or updating SIGH
  81. 81. #ampsuccess by @aleyda from @orainti at #searchcamp Prioritise to fix critical issues first, which will 
 be the ones preventing to be shown in SERPs THIS
  82. 82. #ampsuccess by @aleyda from @orainti at #searchcamp Start with those affecting the highest number 
 of pages and check them directly there
  83. 83. #ampsuccess by @aleyda from @orainti at #searchcamp Focus on identifying how the non-supported code 
 is included to establish a pattern and remove it
  84. 84. #ampsuccess by @aleyda from @orainti at #searchcamp YES Rinse and repeat until you minimise critical errors
  85. 85. #ampsuccess by @aleyda from @orainti at #searchcamp Monitor your AMP visibility impact to prioritise your efforts along the on- going content development and optimisation process #ampsuccess by @aleyda from @orainti at #searchcamp
  86. 86. #ampsuccess by @aleyda from @orainti at #searchcamp Opt-in for Google Analytics AMP Client ID API 
 to correctly track AMP on Cache https://support.google.com/analytics/answer/7486764
  87. 87. #ampsuccess by @aleyda from @orainti at #searchcamp This will allow you to correctly track AMP with GA 
 in *almost* all scenarios. Check Christian’s preso! https://www.slideshare.net/christianoliveira/why-your-analytics-tool-may-be-lying-to-you-about-amp-searchmetrics-summit-2017
  88. 88. #ampsuccess by @aleyda from @orainti at #searchcamp Beyond the AMP vs. Non-AMP traffic trend, 
 what’s the impact of AMP on users behaviour?
  89. 89. #ampsuccess by @aleyda from @orainti at #searchcamp Follow-up w/ your own AMP results 
 via the Google Search Console too
  90. 90. #ampsuccess by @aleyda from @orainti at #searchcamp Verify the top queries per AMP URL to identify further AMP content opportunities
  91. 91. #ampsuccess by @aleyda from @orainti at #searchcamp Use SEOmonitor to track AMP for your targeted (ranked or unranked) keywords https://www.seomonitor.com/
  92. 92. #ampsuccess by @aleyda from @orainti at #searchcamp You can also spot AMP opportunities vs. your competitors with SEMrush rank tracking https://www.semrush.com
  93. 93. #ampsuccess by @aleyda from @orainti at #searchcamp Do the same with your News Carrousel 
 AMP rankings by using RankRanger rankranger.com
  94. 94. #ampsuccess by @aleyda from @orainti at #searchcamp Sometimes you will find “a bit” of repetition 
 there too! How much content can you produce? 12 21
  95. 95. #ampsuccess by @aleyda from @orainti at #searchcamp Last but not least, if at some point things are not going as expected and you want to disable AMP, follow SEO best practices to avoid losing that traffic #ampsuccess by @aleyda from @orainti at #searchcamp
  96. 96. #ampsuccess by @aleyda from @orainti at #searchcamp Remove the rel=”amphtml” link tag and 
 301-redirect AMP URLs to your canonical ones HANDY WORDPRESS PLUGIN https://developers.google.com/search/docs/guides/remove-amp
  97. 97. #ampsuccess by @aleyda from @orainti at #searchcamp However, it’s unlikely that AMP will disappear in 
 the near future, at least not until our sites are fast
  98. 98. #ampsuccess by @aleyda from @orainti at #searchcamp Here’s a list with all of these do’s and dont’s, 
 so you don’t forget Verify if you can Implement your current Mobile Web UI, content & functionality with AMP Check your AMP visibility potential to prioritise your implementation accordingly Monitor AMP implementation errors with GSC AMP report, where you should focus on fixing critical issues first Avoid linking to your AMP URLs unless you’re using them as your canonical mobile Web pages Validate your AMP implementation before and after launch with SEO crawlers to minimise issues Monitor your AMP visibility impact to prioritize your efforts along the on-going content development and optimization process If you want to disable AMP, don’t forget SEO best practices, removing tag to AMP and redirecting to your mobile pages
  99. 99. #ampsuccess by @aleyda from @orainti at #searchcamp Now is your turn #ampsuccess by @aleyda from @orainti at #searchcamp

×