A presentation I gave at the Fort Collins WordPress meetup about the benefits of adding AMP to your WordPress site.

1. ACCELERATED MOBILE PAGES
AN OPEN SOURCE INITIATIVE

2. WHAT IS AMP?

3. ‣A way to build web pages for static content that
render fast
‣An open source initiative that aims to provide
mobile optimized content
‣Can load instantly, anywhere

4. WHY AMP?

5. ‣Speed!
‣Faster browsing on mobile
‣Better user experience

6. 3 PIECES OF AMP

7. 1. AMP HTML

8. ‣HTML with some restrictions for reliable performance
‣Extensions for building rich content beyond basic HTML

9. ‣Custom elements are called AMP HTML components
‣make common practices easy to implement in a performa
‣<amp-img>: provides responsive image support for brow
that don’t

10. 2. AMP JS

11. ‣Ensures fast rendering of AMP HTML pages
‣Manages resource loading
‣Implements all of AMP’s best performance practices

12. 3. GOOGLE AMP
CACHE

13. ‣Optional
‣Delivers the AMP HTML pages
‣Cached in the cloud to reduce the time content
takes to get a mobile device
‣Lives on Google’s CDN for free

14. GETTING STARTED

15. ‣Install AMP WordPress plugin https://
wordpress.org/plugins/amp/
‣All posts will have dynamically generated AMP-
compatible versions
‣Appends /amp/ to the end of Post URLs
‣* Pages and archives are not currently supported

16. VALIDATE

17. ‣In Chrome, go to URL and add #development=1 to
the end
‣Open Chrome Dev Tools
‣Check console for validation errors or messages

18. STYLING

19. ‣Install Glue for Yoast SEO & AMP https://
wordpress.org/plugins/glue-for-yoast-seo-amp/
‣Can enable AMP for pages and custom post types
‣Adds basic styling controls
‣Add google analytics tracking code

20. WORTH IT?

23. RESOURCES

24. ‣ https://www.ampproject.org/
‣ https://timkadlec.com/2015/10/amp-and-incentives/
‣ http://www.wpwatercooler.com/video/ep179-implementing-google-amp-facebook-instan
pages-on-wordpress/
‣ https://deliciousbrains.com/amp-wordpress-google-accelerated-mobile-pages/
‣ https://www.valet.io/amp-for-wordpress/
‣ http://torquemag.io/2016/03/making-amp-wordpress/

25. QUESTIONS?

26. THANKS!
@greenhornet79
endocreative.com