SlideShare a Scribd company logo
January 20th, 2016
@seanmalseed
Accelerated Mobile Pages
Get AMP’ed for AMP(and other silly puns)
seograil.com
@seanmalseed
Let’s talk about AMP.
What is AMP?
Where did AMP come from?
How does AMP work?
When should I use AMP?
The WP plugin: how to get totally AMP’ed before your
competitors do.
@seanmalseed
What is AMP?
@seanmalseed
No.

Recommended for you

Integrating Accelerated Mobile Pages (AMP) In Drupal Websites
Integrating Accelerated Mobile Pages (AMP) In Drupal WebsitesIntegrating Accelerated Mobile Pages (AMP) In Drupal Websites
Integrating Accelerated Mobile Pages (AMP) In Drupal Websites

Quick Fact: Google gives the higher ranking to the websites that meet the AMP requirement. As it provides better mobile experience to the users.

drupal specialistdedicated drupal developersdrupal websites
Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)

Introduce Google AMP (Accelerated Mobile Pages) and how to implement Topic - Google AMP is? - Benefits - Concern Point - 3 core components - How Convert HTML TO AMP HTML

google ampaccelerated mobile pagesseo
AMP K.S.
AMP K.S.AMP K.S.
AMP K.S.

The document discusses Accelerated Mobile Pages (AMP), an open-source initiative started by Google and Twitter to improve the mobile web experience. It provides an overview of AMP, including its origins, how AMP HTML pages are structured, how site speeds are improved, potential search engine results page impacts, client usage scenarios, supported advertisements, and limitations. A live demo of an AMP page is also included.

@seanmalseed
No.
@seanmalseed
No.
Adenosine monophosphate (AMP)
@seanmalseed
Yes.
@seanmalseed
What is AMP?
AMP, or Accelerated Mobile Pages, is a an open source
project to create a standard which makes certain web pages
load totally way super fast, through the cunning use of…
www.ampproject.org
https://www.ampproject.org/docs/get_started/about-amp.html

Recommended for you

Google AMP - What is it and is it right for your website? SLCSEM, Oct 2016
Google AMP - What is it and is it right for your website? SLCSEM, Oct 2016Google AMP - What is it and is it right for your website? SLCSEM, Oct 2016
Google AMP - What is it and is it right for your website? SLCSEM, Oct 2016

Is it too early to begin thinking about Google AMP outside of the Google news carousel? I’ll take you through the commons pitfalls of AMP and some of the results publishers are seeing.

google newspublishingamp
Google's AMP project for web users
Google's AMP project for web usersGoogle's AMP project for web users
Google's AMP project for web users

A brief guide to how Google's new Accelerated Mobile Pages (aka AMP) are displayed and navigated. Includes details on the fundamental change to how Google AMP pages differ to ‘normal’ search results.

googleseomobile marketing
Amp it UP! Using Google Accelerated Mobile Pages with WordPress - WordCamp An...
Amp it UP! Using Google Accelerated Mobile Pages with WordPress - WordCamp An...Amp it UP! Using Google Accelerated Mobile Pages with WordPress - WordCamp An...
Amp it UP! Using Google Accelerated Mobile Pages with WordPress - WordCamp An...

Google is pushing Accelerated Mobile Pages (AMP) in a big way. AMP pages restrict what you can do all for the sake of performance on mobile devices. In this talk we’ll cover the basics of AMP, how it’s different than mobile-ready and responsive design, and the plugins you’ll need to take advantage of AMP on your WordPress site.

wordpresswordcamp#wca2
@seanmalseed
What is AMP?
Strict subset of HTML
AMP Javascript
AMP CDN
https://www.ampproject.org/docs/get_started/about-amp.html
@seanmalseed
Why is AMP so fast?
Allow only asynchronous scripts
Size all resources statically
Don’t let extension mechanisms block
rendering
Keep all third-party JavaScript out of the
critical path
https://www.ampproject.org/docs/get_started/about-amp.html
All CSS must be inline and size-bound
Font triggering must be efficient
Minimize style recalculations
Only run GPU-accelerated animations
Prioritize resource loading
@seanmalseed
AMP in a nutshell...
AMP is the static web
at it’s fastest and staticiest.
… and it’s coming mid-February.
https://www.ampproject.org/docs/get_started/about-amp.html
@seanmalseed
Where did AMP
come from?

Recommended for you

Accelerated Mobile Pages - WordCamp Kansas City
Accelerated Mobile Pages - WordCamp Kansas CityAccelerated Mobile Pages - WordCamp Kansas City
Accelerated Mobile Pages - WordCamp Kansas City

AMP is an open spec for lightweight, mobile-friendly pages. You can use it as the mobile view on your site, and having it enabled actually allows the AMP version of your page to be used by Google for search previews and in other places on their platform. In addition, many SEO experts recommend adopting AMP as Google is likely to reward those who do in terms of rankings. You will learn why AMP is important, how to easily add it to your WordPress site, and different techniques you can use to customize it to your specific needs.

google ampkansas citygoogle
Amp your site: An intro to accelerated mobile pages
Amp your site: An intro to accelerated mobile pagesAmp your site: An intro to accelerated mobile pages
Amp your site: An intro to accelerated mobile pages

This document introduces Accelerated Mobile Pages (AMP). It discusses how AMP addresses the problems of slow mobile page speeds and inconsistent user experiences by making pages load near-instantly. AMP uses HTML, CSS and JavaScript to simplify pages and optimize resources. The AMP cache hosted by Google further improves speeds by serving validated AMP pages from a global proxy. In summary, AMP aims to make mobile pages fast, easy to implement and embrace open web standards.

performanceamp mobilemobile
Amp Overview #YGLF 2016
Amp Overview #YGLF 2016Amp Overview #YGLF 2016
Amp Overview #YGLF 2016

An overview of Accelerated Mobile Pages Project. See how you can leverage this important open source project today in production and improve your sites' performance and the happiness of your users.

mobile webweb developmentamp
@seanmalseed
@seanmalseed
How does AMP work?
@seanmalseed
AMP HTML
Kinda weird, really restrictive, but by
golly it goes fast.
@seanmalseed
AMP HTML is just HTML with a
whole bunch of restrictions.

Recommended for you

Performance-driven websites with AMP - NeosCon May 2019
Performance-driven websites with AMP - NeosCon May 2019Performance-driven websites with AMP - NeosCon May 2019
Performance-driven websites with AMP - NeosCon May 2019

Principles of AMPhtml within TYPO3 CMS built by an example of b13.com. From NeosCon 2019 on May 11th, 2019 by @bennimack

amphtmltypo3neos
AMP and PWA
AMP and PWAAMP and PWA
AMP and PWA

The document discusses different ways that AMP (Accelerated Mobile Pages) content can be used within progressive web apps. It describes AMP as a progressive web app by itself through the use of features like the service worker registration. It also explores using AMP pages within progressive web apps by rendering AMP content in a shadow DOM to avoid performance issues. The document provides examples of how AMP content could be fetched and displayed within a progressive web app for navigation. It emphasizes that AMP aims to provide ultra-portable, embeddable content units that can enhance progressive web apps.

#pwa#tech
AMPifying your Drupal 8 Site : higher performance and higher engagement - Par...
AMPifying your Drupal 8 Site : higher performance and higher engagement - Par...AMPifying your Drupal 8 Site : higher performance and higher engagement - Par...
AMPifying your Drupal 8 Site : higher performance and higher engagement - Par...

The document discusses Accelerated Mobile Pages (AMP), which is a framework for building mobile-optimized content that loads instantly. It describes the key components of AMP including AMP HTML, AMP JS, and the Google AMP Cache. It also outlines how to integrate AMP into a Drupal 8 site using various AMP modules and libraries. The benefits of AMP include faster load times and improved mobile search rankings, while drawbacks include limited functionality and the need to implement AMP-compatible code.

drupaldrupal8drupal camp mumbai 2018
@seanmalseed
How AMP works ⚡ AMP HTML
<!doctype html>
<html ⚡>
<head>
<meta charset="utf-8">
<link rel="canonical" href="hello-world.html">
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<style>body {opacity: 0}</style><noscript><style>body {opacity: 1}</style></noscript>
<script async src="https://cdn.ampproject.org/v0.js"></script>
</head>
<body>Hello World!</body>
</html> https://www.ampproject.org/docs/get_started/about-amp.html#amp-html
@seanmalseed
How AMP works ⚡ AMP HTML
<!doctype html>
<html ⚡>
<head>
<meta charset="utf-8">
<link rel="canonical" href="hello-world.html">
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<style>body {opacity: 0}</style><noscript><style>body {opacity: 1}</style></noscript>
<script async src="https://cdn.ampproject.org/v0.js"></script>
</head>
<body>Hello World!</body>
</html>
Says that we’re
doing AMP
Super strict
CSSAMP JS on the
AMP CDN
https://www.ampproject.org/docs/get_started/about-amp.html#amp-html
You can also use
<html amp>
@seanmalseed
How AMP works ⚡ AMP HTML restrictions
There’s a ton of stuff AMP HTML limits. Some highlights:
Conditional HTML comments are not allowed
All attributes starting with ‘on’ are not allowed
‘Javascript:’ schema is not allowed
All styles must be inline
Only one style tag in the document head
Style rules must be below 50KB
No input elements or text areas of any kind
...yikes...
https://github.com/ampproject/amphtml/blob/master/spec/amp-html-format.md
@seanmalseed
How AMP works ⚡ AMP HTML changes
AMP HTML also makes a few changes. Some highlights:
<img> is replaced by <amp-img>
<video> is replaced by <amp-video>
<audio> is replaced by <amp-audio>
<iframe> is replaced by <amp-iframe>
https://github.com/ampproject/amphtml/blob/master/spec/amp-html-format.md

Recommended for you

WTF is AMP?
WTF is AMP?WTF is AMP?
WTF is AMP?

Accelerated Mobile Pages (AMP) is a new web standard created by Google that aims to provide faster loading mobile web pages. Websites that comply with AMP standards and create separate AMP versions of their pages may see benefits like higher search rankings and increased conversion rates on mobile searches. However, AMP also tightly restricts the technologies used, requiring special iframes and prohibiting custom JavaScript. While AMP could sincerely aim to improve the mobile web experience, it may also be Google's attempt to respond to competitors and exert more control over web standards. Overall, supporting AMP is recommended given its current importance to mobile search.

web developmentgoogle ampdigital publishing
google amp pages
google amp pagesgoogle amp pages
google amp pages

Creating Google AMP Pages allows websites to load faster on mobile and desktop. AMP (Accelerated Mobile Pages) requires rewriting pages in HTML, CSS, and JavaScript to meet speed requirements. Websites create AMP versions of pages that are validated and cached by Google. When users search on mobile, AMP versions may load up to 10x faster than regular pages. AMP works best for static content like news articles and blogs but may not be needed if pages already load quickly. Websites must maintain original and AMP versions of pages and add metadata to link between them.

google ampamp pages
AMP and the instant web - WebPerformance NYC MeetUp group
AMP and the instant web - WebPerformance NYC MeetUp groupAMP and the instant web - WebPerformance NYC MeetUp group
AMP and the instant web - WebPerformance NYC MeetUp group

This talk was designed to give the developer the basics of the AMP technology. The talk offers the pros and cons of the technology as well as a technical overview of the structure of an AMP pages. The information covers several tools and integration with popular CMS and how to implement AMP in the development testing and build process.

ampjavascriptweb performance
@seanmalseed
Wait wait wait…
Did you just say that AMP lets you have an iFrame?
@seanmalseed
How AMP works ⚡ AMP HTML iframe hax?
Yes, AMP does have an amp-iframe tag that embeds a true-blue real
iframe.
It has a bunch of restrictions, but it does seem like a way to hack in some non-AMP source into
your AMP pages. Like maybe a lead form?
Reading their page about it seems like they might be wise, and considering a change.
https://github.com/ampproject/amphtml/blob/master/extensions/amp-iframe/amp-iframe.md
@seanmalseed
How AMP works ⚡ AMP HTML iframe restrictions?
amp-iframe may not appear close to the top of the document (except for iframes that use placeholder as described below).
They must be either 600px away from the top or not within the first 75% of the viewport when scrolled to the top –
whichever is smaller. NOTE: We are currently looking for feedback as to how well this restriction works in practice.
They are sandboxed by default. Details
They must only request resources via HTTPS or from a data-URI or via the srcdoc attribute.
They must not be in the same origin as the container unless they do not allow allow-same-origin in the sandbox attribute.
See the doc "Iframe origin policy" for further details on allowed origins for iframes.
https://github.com/ampproject/amphtml/blob/master/extensions/amp-iframe/amp-iframe.md
@seanmalseed
AMP JS
It can do the Kessel Run in less than
twelve parsecs.

Recommended for you

AMP in WordPress, the WordPress Way
AMP in WordPress, the WordPress WayAMP in WordPress, the WordPress Way
AMP in WordPress, the WordPress Way

What is AMP? Why should I learn what it offers? And how can I take advantage of it in WordPress? This deck was used to guide a discussion about these topics at the awesome PDX WP Meetup on August 5th, 2019.

ampwordpress
Digital marketing companies
Digital marketing companiesDigital marketing companies
Digital marketing companies

Accelerated mobile pages, aka AMP, is the new buzzword in the industry. Almost everyone is talking about it at one time or another. But if you are one of those who is yet to figure out what AMP is and why all this buzz around it – then you are at the right place, reading the right thing!

digital media marketing
Amp
AmpAmp
Amp

AMP (Accelerated Mobile Pages) is an open-source library that creates web pages that load instantly. It uses HTML with restrictions and AMP-specific components to optimize page performance. The AMP cache delivers cached AMP pages via a CDN. AMP works by asynchronously loading resources, statically sizing elements, prioritizing loads, and only allowing certain animations. It improves user engagement through speed while allowing mobile-friendliness and SEO benefits. AMP has requirements like specific tags and boilerplate but also limitations like disallowing external CSS, JavaScript, and certain elements.

@seanmalseed
How AMP works ⚡ AMP Javascript
AMP JS is a Javascript library that does neat AMP speed tricks.
The library makes all external resources load asynchronously, meaning that
one thing loading doesn’t stop other things from starting to load.
It pre-calculates the layout of every element.
It disables slow CSS selectors.
https://www.ampproject.org/docs/get_started/about-amp.html#amp-js
@seanmalseed
How AMP works ⚡ AMP Javascript
<!doctype html>
<html ⚡>
<head>
<meta charset="utf-8">
<link rel="canonical" href="hello-world.html">
<meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1">
<style>body {opacity: 0}</style><noscript><style>body {opacity: 1}</style></noscript>
<script async src="https://cdn.ampproject.org/v0.js"></script>
</head>
<body>Hello World!</body>
</html>
That’s how you
load AMP JS.
@seanmalseed
AMP CDN
It’s totally optional. Really.
@seanmalseed
How AMP works ⚡ AMP CDN
There were rumors that the AMP CDN was required, and you’d have to
host your AMP pages on Google’s servers.
NOPE.
https://github.com/ampproject/amphtml/blob/master/spec/amp-html-format.md

Recommended for you

AMP with WordPress by Pradeep Sonawane @ Google AMP Roadshow Mumbai 2018
AMP with WordPress by Pradeep Sonawane @ Google AMP Roadshow Mumbai 2018AMP with WordPress by Pradeep Sonawane @ Google AMP Roadshow Mumbai 2018
AMP with WordPress by Pradeep Sonawane @ Google AMP Roadshow Mumbai 2018

AMP WordPress plugin is heading towards v1.0 release. It has many new features, including something called the “Native AMP” mode. Native AMP enables a WordPress site to be served entirely as a valid AMP without any coding efforts. Pradeep Sonawane, VP Engineering @rtCamp covered AMP Native and other aspects of AMP which benefits WordPress users in this talk.

ampwordpressweb
Accelerated Mobile Pages (AMP) in Magento
Accelerated Mobile Pages (AMP) in MagentoAccelerated Mobile Pages (AMP) in Magento
Accelerated Mobile Pages (AMP) in Magento

The document discusses Accelerated Mobile Pages (AMP) capabilities for Magento projects. It covers what AMP is, the benefits of using AMP like faster page speeds and improved SEO, required code elements for AMP pages, common AMP components for Magento like forms and images, and how to add features like analytics and validate AMP pages. It also provides examples of using AMP features in Magento like custom layouts, templates, and dynamic content with AMP Bind.

magentomagento meetup kharkovamp
Setting up & Tracking AMP Pages in Google Analytics
Setting up & Tracking AMP Pages in Google AnalyticsSetting up & Tracking AMP Pages in Google Analytics
Setting up & Tracking AMP Pages in Google Analytics

This document provides guidance on setting up and tracking Accelerated Mobile Pages (AMP) in Google Analytics. It discusses what AMP pages are, how to set them up on a WordPress website using plugins, validate AMP pages, and make them discoverable to Google. It also covers using the amp-analytics tag to track user interactions on AMP pages in Google Analytics. Key steps include installing AMP and related plugins, adding tracking code to plugin template files, validating pages, and monitoring traffic in Google Analytics reports. While AMP works well for publishing sites, it may not be needed for e-commerce sites with complex pages due to restrictions of the AMP format.

@seanmalseed
How AMP works ⚡ AMP CDN
How does the AMP CDN work?
It just kind of does.
@seanmalseed
How AMP works ⚡ AMP CDN
The AMP CDN serves out cached versions of your resources. Just
reference the resource preceded by the CDN:
https://cdn.ampproject.org/c/s/www.yoursite.com/whatever
http://stackoverflow.com/questions/34720444/how-can-i-test-the-cdn-of-googles-amp-project
@seanmalseed
When should I use AMP?
@seanmalseed
When to use AMP ⚡
AMP is made for static pages.
YES:
Articles, blogs, and things that don’t move around a lot.
NO:
Your storefront, a form, hampsterdance.com, anything interactive.

Recommended for you

Get AMP’ed for AMP!
Get AMP’ed for AMP!Get AMP’ed for AMP!
Get AMP’ed for AMP!

Jacob Lial from Greenlane Search Marketing presents on AMP (Accelerated Mobile Pages) - December 2015. Learn about what AMP means to SEO, Google, and mobile site improvements to benefit your users. Visit ampproject.org to learn more about Google's big 2016 focus.

ampgoogleseo
What is Amp (Accelerated Mobile Pages)?
What is Amp (Accelerated Mobile Pages)?What is Amp (Accelerated Mobile Pages)?
What is Amp (Accelerated Mobile Pages)?

It is an open source framework based on HTML, which can be used for creating quick loading web pages for mobile users. Speed is an integral part of designing web pages. Data shows that “about 40% of people will abandon a web page that takes more than 3 seconds to load.”

ampampcacheamphtml
Amped for AMP at Pubcon Las Vegas 2016
Amped for AMP at Pubcon Las Vegas 2016Amped for AMP at Pubcon Las Vegas 2016
Amped for AMP at Pubcon Las Vegas 2016

The document discusses Google's AMP (Accelerated Mobile Pages) project. It provides an overview of what AMP is, including its history and timeline, key components like AMP HTML and the AMP JavaScript library. It also discusses how AMP aims to improve page load speeds and user experience on mobile, as well as tracking conversions on AMP pages and implementing AMP on WordPress sites.

seopubconaccelerated mobile pages
@seanmalseed
How does Google know
about my AMP version?
@seanmalseed
Pointing to your AMP ⚡
Easy peasy. Link rel=”amphtml”
<link rel="amphtml"
href="https://www.whatever.com/page/amp">
@seanmalseed
There’s already a
Wordpress plugin
@seanmalseed
… and it almost doesn’t totally
suck and not work at all.

Recommended for you

Amp your site an intro to accelerated mobile pages
Amp your site  an intro to accelerated mobile pagesAmp your site  an intro to accelerated mobile pages
Amp your site an intro to accelerated mobile pages

Accelerated Mobile Pages (AMP) is a framework for building web pages that are optimized for mobile devices. It addresses issues like slow load times and poor user experiences on mobile by simplifying pages and parallelizing resource loading. AMP pages use HTML, CSS and JavaScript to load quickly. They are cached globally through Google's AMP Cache for fast delivery. Publishers can easily implement AMP pages and monetize them while embracing an open web.

amp mobile
PWA & AMP (PWAMP) - Making the Bot Experience as Good as the User Experience
PWA & AMP (PWAMP) - Making the Bot Experience as Good as the User ExperiencePWA & AMP (PWAMP) - Making the Bot Experience as Good as the User Experience
PWA & AMP (PWAMP) - Making the Bot Experience as Good as the User Experience

How can Progressive Web Apps (PWA) and Accelerated Mobile Pages (AMP) work together to create an optimal user experience, from search to conversion? Find out this and more in our next webinar! Having both frameworks sharing a unique set of URLs makes search engines’ crawling and indexing much easier and straightforward. No need to deal with canonical tags, alternate tags and other signals to establish relationships between similar documents: only one document per piece of content. In this webinar, Max will talk about getting the best out of both worlds: the speed of AMP from the search results and the functionalities of PWA for UX, engagement and conversion. As well as how to integrate AMP with PWA on the same URLs.

pwaampseo
Webwing Technologies - Procedure to Implement AMP in your Website
Webwing Technologies - Procedure to Implement AMP in your WebsiteWebwing Technologies - Procedure to Implement AMP in your Website
Webwing Technologies - Procedure to Implement AMP in your Website

AMP provides a great user experience across many platforms. So let's implement AMP. Walk through below steps to enable AMP for your website.

app developerssearch engine optimizationandroid
@seanmalseed
@seanmalseed
If you really wanna risk it, though:
https://wordpress.org/plugins/amp/
@seanmalseed
Go home and play with some AMP thanks to The Guardian
Regs old Guardian:
http://www.theguardian.com/media/2015/oct/11/google-amp-facebook-
instant-articles-apple-news
AMPlified Guardian:
https://www.theguardian.com/media/2015/oct/11/google-amp-facebook-
instant-articles-apple-news/amp
The Guardian implemented AMP on all their articles, and Google uses them as their example in a
bunch of places. Wonder how much Google had to pay ‘em for that… :D
@seanmalseed
AMP’ed

Recommended for you

Step by-step procedure to implement amp in website
Step by-step procedure to implement amp in websiteStep by-step procedure to implement amp in website
Step by-step procedure to implement amp in website

AMP provides a great user experience across many platforms. So lets implement AMP. Walk through below steps to enable AMP for your website.

mobile marketingmobile application developmentamp
PWA + AMP: The Future of E-Commerce? Max Prin - BrightonSEO - Sept. 2018
PWA + AMP: The Future of E-Commerce? Max Prin - BrightonSEO - Sept. 2018PWA + AMP: The Future of E-Commerce? Max Prin - BrightonSEO - Sept. 2018
PWA + AMP: The Future of E-Commerce? Max Prin - BrightonSEO - Sept. 2018

This document discusses how Progressive Web Apps (PWAs) and Accelerated Mobile Pages (AMPs) could be the future of e-commerce. It notes that most internet usage now occurs on mobile devices, which have limitations like smaller screens and slower connections compared to desktop. AMP and PWAs aim to make mobile web experiences faster, more reliable and more app-like. The document outlines how AMP pages are rendered, and how PWAs can improve engagement for users. It suggests using AMP as an entry point for PWAs to combine the benefits of fast loading, search visibility and an app-like experience for e-commerce sites.

mobileamppwa
AMP - SMX München 2018
AMP - SMX München 2018AMP - SMX München 2018
AMP - SMX München 2018

AMP has benefits for driving discussion on web performance and collaboration, but it also has significant limitations and drawbacks. While AMP pages load faster initially due to Google's pre-rendering, regular websites optimized for performance can also load very quickly and provide a better user experience through proper branding and interactivity. Overall web performance optimization should go beyond just AMP by focusing on fundamentals like optimizing images, CSS, JavaScript, and the critical rendering path to make entire websites fast for users on all devices.

ampaccelerated mobile pages
@seanmalseed
Thanks!
@seanmalseed

More Related Content

What's hot

Great Lakes Area .Net UG: Optimize .Net Azure App Services
Great Lakes Area .Net UG: Optimize .Net Azure App ServicesGreat Lakes Area .Net UG: Optimize .Net Azure App Services
Great Lakes Area .Net UG: Optimize .Net Azure App Services
Brian McKeiver
 
AMP up Your WordPress Site
AMP up Your WordPress SiteAMP up Your WordPress Site
AMP up Your WordPress Site
Prem Tiwari
 
AMP - Accelerated Mobile Pages
AMP - Accelerated Mobile PagesAMP - Accelerated Mobile Pages
AMP - Accelerated Mobile Pages
Ido Green
 
Integrating Accelerated Mobile Pages (AMP) In Drupal Websites
Integrating Accelerated Mobile Pages (AMP) In Drupal WebsitesIntegrating Accelerated Mobile Pages (AMP) In Drupal Websites
Integrating Accelerated Mobile Pages (AMP) In Drupal Websites
Excellent Webworld
 
Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)
Chitpong Wuttanan
 
AMP K.S.
AMP K.S.AMP K.S.
AMP K.S.
Jacob Lial
 
Google AMP - What is it and is it right for your website? SLCSEM, Oct 2016
Google AMP - What is it and is it right for your website? SLCSEM, Oct 2016Google AMP - What is it and is it right for your website? SLCSEM, Oct 2016
Google AMP - What is it and is it right for your website? SLCSEM, Oct 2016
Jesse Semchuck
 
Google's AMP project for web users
Google's AMP project for web usersGoogle's AMP project for web users
Google's AMP project for web users
Peter Knight
 
Amp it UP! Using Google Accelerated Mobile Pages with WordPress - WordCamp An...
Amp it UP! Using Google Accelerated Mobile Pages with WordPress - WordCamp An...Amp it UP! Using Google Accelerated Mobile Pages with WordPress - WordCamp An...
Amp it UP! Using Google Accelerated Mobile Pages with WordPress - WordCamp An...
Mike Hale
 
Accelerated Mobile Pages - WordCamp Kansas City
Accelerated Mobile Pages - WordCamp Kansas CityAccelerated Mobile Pages - WordCamp Kansas City
Accelerated Mobile Pages - WordCamp Kansas City
Jeremy Green
 
Amp your site: An intro to accelerated mobile pages
Amp your site: An intro to accelerated mobile pagesAmp your site: An intro to accelerated mobile pages
Amp your site: An intro to accelerated mobile pages
Robert McFrazier
 
Amp Overview #YGLF 2016
Amp Overview #YGLF 2016Amp Overview #YGLF 2016
Amp Overview #YGLF 2016
Ido Green
 
Performance-driven websites with AMP - NeosCon May 2019
Performance-driven websites with AMP - NeosCon May 2019Performance-driven websites with AMP - NeosCon May 2019
Performance-driven websites with AMP - NeosCon May 2019
Benni Mack
 
AMP and PWA
AMP and PWAAMP and PWA
AMP and PWA
Eun Cho
 
AMPifying your Drupal 8 Site : higher performance and higher engagement - Par...
AMPifying your Drupal 8 Site : higher performance and higher engagement - Par...AMPifying your Drupal 8 Site : higher performance and higher engagement - Par...
AMPifying your Drupal 8 Site : higher performance and higher engagement - Par...
DrupalMumbai
 
WTF is AMP?
WTF is AMP?WTF is AMP?
WTF is AMP?
Carl V. Lewis
 
google amp pages
google amp pagesgoogle amp pages
AMP and the instant web - WebPerformance NYC MeetUp group
AMP and the instant web - WebPerformance NYC MeetUp groupAMP and the instant web - WebPerformance NYC MeetUp group
AMP and the instant web - WebPerformance NYC MeetUp group
Michael Posso
 
AMP in WordPress, the WordPress Way
AMP in WordPress, the WordPress WayAMP in WordPress, the WordPress Way
AMP in WordPress, the WordPress Way
Alberto Medina
 
Digital marketing companies
Digital marketing companiesDigital marketing companies
Digital marketing companies
vohi sharma
 

What's hot (20)

Great Lakes Area .Net UG: Optimize .Net Azure App Services
Great Lakes Area .Net UG: Optimize .Net Azure App ServicesGreat Lakes Area .Net UG: Optimize .Net Azure App Services
Great Lakes Area .Net UG: Optimize .Net Azure App Services
 
AMP up Your WordPress Site
AMP up Your WordPress SiteAMP up Your WordPress Site
AMP up Your WordPress Site
 
AMP - Accelerated Mobile Pages
AMP - Accelerated Mobile PagesAMP - Accelerated Mobile Pages
AMP - Accelerated Mobile Pages
 
Integrating Accelerated Mobile Pages (AMP) In Drupal Websites
Integrating Accelerated Mobile Pages (AMP) In Drupal WebsitesIntegrating Accelerated Mobile Pages (AMP) In Drupal Websites
Integrating Accelerated Mobile Pages (AMP) In Drupal Websites
 
Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)
 
AMP K.S.
AMP K.S.AMP K.S.
AMP K.S.
 
Google AMP - What is it and is it right for your website? SLCSEM, Oct 2016
Google AMP - What is it and is it right for your website? SLCSEM, Oct 2016Google AMP - What is it and is it right for your website? SLCSEM, Oct 2016
Google AMP - What is it and is it right for your website? SLCSEM, Oct 2016
 
Google's AMP project for web users
Google's AMP project for web usersGoogle's AMP project for web users
Google's AMP project for web users
 
Amp it UP! Using Google Accelerated Mobile Pages with WordPress - WordCamp An...
Amp it UP! Using Google Accelerated Mobile Pages with WordPress - WordCamp An...Amp it UP! Using Google Accelerated Mobile Pages with WordPress - WordCamp An...
Amp it UP! Using Google Accelerated Mobile Pages with WordPress - WordCamp An...
 
Accelerated Mobile Pages - WordCamp Kansas City
Accelerated Mobile Pages - WordCamp Kansas CityAccelerated Mobile Pages - WordCamp Kansas City
Accelerated Mobile Pages - WordCamp Kansas City
 
Amp your site: An intro to accelerated mobile pages
Amp your site: An intro to accelerated mobile pagesAmp your site: An intro to accelerated mobile pages
Amp your site: An intro to accelerated mobile pages
 
Amp Overview #YGLF 2016
Amp Overview #YGLF 2016Amp Overview #YGLF 2016
Amp Overview #YGLF 2016
 
Performance-driven websites with AMP - NeosCon May 2019
Performance-driven websites with AMP - NeosCon May 2019Performance-driven websites with AMP - NeosCon May 2019
Performance-driven websites with AMP - NeosCon May 2019
 
AMP and PWA
AMP and PWAAMP and PWA
AMP and PWA
 
AMPifying your Drupal 8 Site : higher performance and higher engagement - Par...
AMPifying your Drupal 8 Site : higher performance and higher engagement - Par...AMPifying your Drupal 8 Site : higher performance and higher engagement - Par...
AMPifying your Drupal 8 Site : higher performance and higher engagement - Par...
 
WTF is AMP?
WTF is AMP?WTF is AMP?
WTF is AMP?
 
google amp pages
google amp pagesgoogle amp pages
google amp pages
 
AMP and the instant web - WebPerformance NYC MeetUp group
AMP and the instant web - WebPerformance NYC MeetUp groupAMP and the instant web - WebPerformance NYC MeetUp group
AMP and the instant web - WebPerformance NYC MeetUp group
 
AMP in WordPress, the WordPress Way
AMP in WordPress, the WordPress WayAMP in WordPress, the WordPress Way
AMP in WordPress, the WordPress Way
 
Digital marketing companies
Digital marketing companiesDigital marketing companies
Digital marketing companies
 

Similar to Get AMP'ed for Accelerated Mobile Pages - SEO Grail Philadelphia 1/20/16

Amp
AmpAmp
AMP with WordPress by Pradeep Sonawane @ Google AMP Roadshow Mumbai 2018
AMP with WordPress by Pradeep Sonawane @ Google AMP Roadshow Mumbai 2018AMP with WordPress by Pradeep Sonawane @ Google AMP Roadshow Mumbai 2018
AMP with WordPress by Pradeep Sonawane @ Google AMP Roadshow Mumbai 2018
rtCamp
 
Accelerated Mobile Pages (AMP) in Magento
Accelerated Mobile Pages (AMP) in MagentoAccelerated Mobile Pages (AMP) in Magento
Accelerated Mobile Pages (AMP) in Magento
Magecom UK Limited
 
Setting up & Tracking AMP Pages in Google Analytics
Setting up & Tracking AMP Pages in Google AnalyticsSetting up & Tracking AMP Pages in Google Analytics
Setting up & Tracking AMP Pages in Google Analytics
Vivek Patel
 
Get AMP’ed for AMP!
Get AMP’ed for AMP!Get AMP’ed for AMP!
Get AMP’ed for AMP!
Greenlane
 
What is Amp (Accelerated Mobile Pages)?
What is Amp (Accelerated Mobile Pages)?What is Amp (Accelerated Mobile Pages)?
What is Amp (Accelerated Mobile Pages)?
KULZUJESHAI
 
Amped for AMP at Pubcon Las Vegas 2016
Amped for AMP at Pubcon Las Vegas 2016Amped for AMP at Pubcon Las Vegas 2016
Amped for AMP at Pubcon Las Vegas 2016
Search Commander, Inc.
 
Amp your site an intro to accelerated mobile pages
Amp your site  an intro to accelerated mobile pagesAmp your site  an intro to accelerated mobile pages
Amp your site an intro to accelerated mobile pages
Robert McFrazier
 
PWA & AMP (PWAMP) - Making the Bot Experience as Good as the User Experience
PWA & AMP (PWAMP) - Making the Bot Experience as Good as the User ExperiencePWA & AMP (PWAMP) - Making the Bot Experience as Good as the User Experience
PWA & AMP (PWAMP) - Making the Bot Experience as Good as the User Experience
Max Prin
 
Webwing Technologies - Procedure to Implement AMP in your Website
Webwing Technologies - Procedure to Implement AMP in your WebsiteWebwing Technologies - Procedure to Implement AMP in your Website
Webwing Technologies - Procedure to Implement AMP in your Website
Webwing Technologies
 
Step by-step procedure to implement amp in website
Step by-step procedure to implement amp in websiteStep by-step procedure to implement amp in website
Step by-step procedure to implement amp in website
Webwing Technologies
 
PWA + AMP: The Future of E-Commerce? Max Prin - BrightonSEO - Sept. 2018
PWA + AMP: The Future of E-Commerce? Max Prin - BrightonSEO - Sept. 2018PWA + AMP: The Future of E-Commerce? Max Prin - BrightonSEO - Sept. 2018
PWA + AMP: The Future of E-Commerce? Max Prin - BrightonSEO - Sept. 2018
Max Prin
 
AMP - SMX München 2018
AMP - SMX München 2018AMP - SMX München 2018
AMP - SMX München 2018
Bastian Grimm
 
Building for, perceiving and measuring performance for mobile web
Building for, perceiving and measuring performance for mobile webBuilding for, perceiving and measuring performance for mobile web
Building for, perceiving and measuring performance for mobile web
Robin Glen
 
AMP Do’s & Don’ts for Superhero Results #SearchCamp
AMP Do’s & Don’ts for Superhero Results #SearchCampAMP Do’s & Don’ts for Superhero Results #SearchCamp
AMP Do’s & Don’ts for Superhero Results #SearchCamp
Aleyda Solís
 
Integration Testing in Python
Integration Testing in PythonIntegration Testing in Python
Integration Testing in Python
Panoptic Development, Inc.
 
A Holistic View of Website Performance
A Holistic View of Website PerformanceA Holistic View of Website Performance
A Holistic View of Website Performance
Rene Churchill
 
AMP
AMPAMP
Performance Tuning Web Apps - The Need For Speed
Performance Tuning Web Apps - The Need For SpeedPerformance Tuning Web Apps - The Need For Speed
Performance Tuning Web Apps - The Need For Speed
Vijay Rayapati
 
Performance as User Experience [AEADC 2018]
Performance as User Experience [AEADC 2018]Performance as User Experience [AEADC 2018]
Performance as User Experience [AEADC 2018]
Aaron Gustafson
 

Similar to Get AMP'ed for Accelerated Mobile Pages - SEO Grail Philadelphia 1/20/16 (20)

Amp
AmpAmp
Amp
 
AMP with WordPress by Pradeep Sonawane @ Google AMP Roadshow Mumbai 2018
AMP with WordPress by Pradeep Sonawane @ Google AMP Roadshow Mumbai 2018AMP with WordPress by Pradeep Sonawane @ Google AMP Roadshow Mumbai 2018
AMP with WordPress by Pradeep Sonawane @ Google AMP Roadshow Mumbai 2018
 
Accelerated Mobile Pages (AMP) in Magento
Accelerated Mobile Pages (AMP) in MagentoAccelerated Mobile Pages (AMP) in Magento
Accelerated Mobile Pages (AMP) in Magento
 
Setting up & Tracking AMP Pages in Google Analytics
Setting up & Tracking AMP Pages in Google AnalyticsSetting up & Tracking AMP Pages in Google Analytics
Setting up & Tracking AMP Pages in Google Analytics
 
Get AMP’ed for AMP!
Get AMP’ed for AMP!Get AMP’ed for AMP!
Get AMP’ed for AMP!
 
What is Amp (Accelerated Mobile Pages)?
What is Amp (Accelerated Mobile Pages)?What is Amp (Accelerated Mobile Pages)?
What is Amp (Accelerated Mobile Pages)?
 
Amped for AMP at Pubcon Las Vegas 2016
Amped for AMP at Pubcon Las Vegas 2016Amped for AMP at Pubcon Las Vegas 2016
Amped for AMP at Pubcon Las Vegas 2016
 
Amp your site an intro to accelerated mobile pages
Amp your site  an intro to accelerated mobile pagesAmp your site  an intro to accelerated mobile pages
Amp your site an intro to accelerated mobile pages
 
PWA & AMP (PWAMP) - Making the Bot Experience as Good as the User Experience
PWA & AMP (PWAMP) - Making the Bot Experience as Good as the User ExperiencePWA & AMP (PWAMP) - Making the Bot Experience as Good as the User Experience
PWA & AMP (PWAMP) - Making the Bot Experience as Good as the User Experience
 
Webwing Technologies - Procedure to Implement AMP in your Website
Webwing Technologies - Procedure to Implement AMP in your WebsiteWebwing Technologies - Procedure to Implement AMP in your Website
Webwing Technologies - Procedure to Implement AMP in your Website
 
Step by-step procedure to implement amp in website
Step by-step procedure to implement amp in websiteStep by-step procedure to implement amp in website
Step by-step procedure to implement amp in website
 
PWA + AMP: The Future of E-Commerce? Max Prin - BrightonSEO - Sept. 2018
PWA + AMP: The Future of E-Commerce? Max Prin - BrightonSEO - Sept. 2018PWA + AMP: The Future of E-Commerce? Max Prin - BrightonSEO - Sept. 2018
PWA + AMP: The Future of E-Commerce? Max Prin - BrightonSEO - Sept. 2018
 
AMP - SMX München 2018
AMP - SMX München 2018AMP - SMX München 2018
AMP - SMX München 2018
 
Building for, perceiving and measuring performance for mobile web
Building for, perceiving and measuring performance for mobile webBuilding for, perceiving and measuring performance for mobile web
Building for, perceiving and measuring performance for mobile web
 
AMP Do’s & Don’ts for Superhero Results #SearchCamp
AMP Do’s & Don’ts for Superhero Results #SearchCampAMP Do’s & Don’ts for Superhero Results #SearchCamp
AMP Do’s & Don’ts for Superhero Results #SearchCamp
 
Integration Testing in Python
Integration Testing in PythonIntegration Testing in Python
Integration Testing in Python
 
A Holistic View of Website Performance
A Holistic View of Website PerformanceA Holistic View of Website Performance
A Holistic View of Website Performance
 
AMP
AMPAMP
AMP
 
Performance Tuning Web Apps - The Need For Speed
Performance Tuning Web Apps - The Need For SpeedPerformance Tuning Web Apps - The Need For Speed
Performance Tuning Web Apps - The Need For Speed
 
Performance as User Experience [AEADC 2018]
Performance as User Experience [AEADC 2018]Performance as User Experience [AEADC 2018]
Performance as User Experience [AEADC 2018]
 

Recently uploaded

Billion Broadcaster's Frame Posters and Horizontal Lift Advertising Screens: ...
Billion Broadcaster's Frame Posters and Horizontal Lift Advertising Screens: ...Billion Broadcaster's Frame Posters and Horizontal Lift Advertising Screens: ...
Billion Broadcaster's Frame Posters and Horizontal Lift Advertising Screens: ...
VikasYadav194549
 
10 Powerful Strategies to Solve Common Payroll Problems in SMEs_.pdf
10 Powerful Strategies to Solve Common Payroll Problems in SMEs_.pdf10 Powerful Strategies to Solve Common Payroll Problems in SMEs_.pdf
10 Powerful Strategies to Solve Common Payroll Problems in SMEs_.pdf
Top Klickz
 
An Odyssey into Composable Digital Solutions - Brian McKeiver
An Odyssey into Composable Digital Solutions - Brian McKeiverAn Odyssey into Composable Digital Solutions - Brian McKeiver
An Odyssey into Composable Digital Solutions - Brian McKeiver
DigiMarCon - Digital Marketing, Media and Advertising Conferences & Exhibitions
 
Content Optimization Master Class - Matt Raven
Content Optimization Master Class - Matt RavenContent Optimization Master Class - Matt Raven
Chandigarh Institute of Internet Marketing
Chandigarh Institute of Internet MarketingChandigarh Institute of Internet Marketing
Chandigarh Institute of Internet Marketing
CIIM
 
How to Get High-Quality Backlinks in 2024
How to Get High-Quality Backlinks in 2024How to Get High-Quality Backlinks in 2024
How to Get High-Quality Backlinks in 2024
Jomer Gregorio
 
CAMPUSEDGE ENETERPRISE RESOURCE MANAGEMENT SOFTWARE
CAMPUSEDGE ENETERPRISE RESOURCE MANAGEMENT SOFTWARECAMPUSEDGE ENETERPRISE RESOURCE MANAGEMENT SOFTWARE
CAMPUSEDGE ENETERPRISE RESOURCE MANAGEMENT SOFTWARE
solitaireshubham
 
Top 10 Cases of Amnesia A Journey through Memory Loss.pptx
Top 10 Cases of Amnesia A Journey through Memory Loss.pptxTop 10 Cases of Amnesia A Journey through Memory Loss.pptx
Top 10 Cases of Amnesia A Journey through Memory Loss.pptx
elizabethella096
 
Powering Up Your Digital Strategy, Amplifying the Potential of Performance-Ba...
Powering Up Your Digital Strategy, Amplifying the Potential of Performance-Ba...Powering Up Your Digital Strategy, Amplifying the Potential of Performance-Ba...
Powering Up Your Digital Strategy, Amplifying the Potential of Performance-Ba...
DigiMarCon - Digital Marketing, Media and Advertising Conferences & Exhibitions
 
ABM, The True Story - Rob Griffin, G5 Futures
ABM, The True Story - Rob Griffin, G5 FuturesABM, The True Story - Rob Griffin, G5 Futures
Know about what is digital marketing.pptx
Know about what is digital marketing.pptxKnow about what is digital marketing.pptx
Know about what is digital marketing.pptx
cricketworld24
 
Digital Marketing Trends, Experts Insights on How to Gain a Competitive Edge ...
Digital Marketing Trends, Experts Insights on How to Gain a Competitive Edge ...Digital Marketing Trends, Experts Insights on How to Gain a Competitive Edge ...
Digital Marketing Trends, Experts Insights on How to Gain a Competitive Edge ...
DigiMarCon - Digital Marketing, Media and Advertising Conferences & Exhibitions
 
Importance of SEO to support holistic marketing strategies and the rise of n...
Importance of SEO to  support holistic marketing strategies and the rise of n...Importance of SEO to  support holistic marketing strategies and the rise of n...
Importance of SEO to support holistic marketing strategies and the rise of n...
JessicaRedman5
 
webs jyoti php training in gurgaon
webs  jyoti  php training   in   gurgaonwebs  jyoti  php training   in   gurgaon
webs jyoti php training in gurgaon
sns434331
 
Social Media Marketing Master Class - Jeff Dwoskin
Social Media Marketing Master Class - Jeff DwoskinSocial Media Marketing Master Class - Jeff Dwoskin
What Does a Social Media Manager‎ ‎ ‎ Do?
What Does a Social Media Manager‎ ‎ ‎  Do?What Does a Social Media Manager‎ ‎ ‎  Do?
What Does a Social Media Manager‎ ‎ ‎ Do?
Jomer Gregorio
 
NIMA2024 | Hoe Danone Trends vertaalt naar Strategie voor het versterken van ...
NIMA2024 | Hoe Danone Trends vertaalt naar Strategie voor het versterken van ...NIMA2024 | Hoe Danone Trends vertaalt naar Strategie voor het versterken van ...
NIMA2024 | Hoe Danone Trends vertaalt naar Strategie voor het versterken van ...
BBPMedia1
 
The Intersection Between AI & Paid Media Management - Curtiss Gulash
The Intersection Between AI & Paid Media Management - Curtiss GulashThe Intersection Between AI & Paid Media Management - Curtiss Gulash
The Intersection Between AI & Paid Media Management - Curtiss Gulash
DigiMarCon - Digital Marketing, Media and Advertising Conferences & Exhibitions
 
Tools, Systems, & Websites to Grow a Profitable Business on Social Media - Ta...
Tools, Systems, & Websites to Grow a Profitable Business on Social Media - Ta...Tools, Systems, & Websites to Grow a Profitable Business on Social Media - Ta...
Tools, Systems, & Websites to Grow a Profitable Business on Social Media - Ta...
DigiMarCon - Digital Marketing, Media and Advertising Conferences & Exhibitions
 
Go To Market Strategy - Zig When Others Zag
Go To Market Strategy - Zig When Others ZagGo To Market Strategy - Zig When Others Zag
Go To Market Strategy - Zig When Others Zag
Rajesh Math
 

Recently uploaded (20)

Billion Broadcaster's Frame Posters and Horizontal Lift Advertising Screens: ...
Billion Broadcaster's Frame Posters and Horizontal Lift Advertising Screens: ...Billion Broadcaster's Frame Posters and Horizontal Lift Advertising Screens: ...
Billion Broadcaster's Frame Posters and Horizontal Lift Advertising Screens: ...
 
10 Powerful Strategies to Solve Common Payroll Problems in SMEs_.pdf
10 Powerful Strategies to Solve Common Payroll Problems in SMEs_.pdf10 Powerful Strategies to Solve Common Payroll Problems in SMEs_.pdf
10 Powerful Strategies to Solve Common Payroll Problems in SMEs_.pdf
 
An Odyssey into Composable Digital Solutions - Brian McKeiver
An Odyssey into Composable Digital Solutions - Brian McKeiverAn Odyssey into Composable Digital Solutions - Brian McKeiver
An Odyssey into Composable Digital Solutions - Brian McKeiver
 
Content Optimization Master Class - Matt Raven
Content Optimization Master Class - Matt RavenContent Optimization Master Class - Matt Raven
Content Optimization Master Class - Matt Raven
 
Chandigarh Institute of Internet Marketing
Chandigarh Institute of Internet MarketingChandigarh Institute of Internet Marketing
Chandigarh Institute of Internet Marketing
 
How to Get High-Quality Backlinks in 2024
How to Get High-Quality Backlinks in 2024How to Get High-Quality Backlinks in 2024
How to Get High-Quality Backlinks in 2024
 
CAMPUSEDGE ENETERPRISE RESOURCE MANAGEMENT SOFTWARE
CAMPUSEDGE ENETERPRISE RESOURCE MANAGEMENT SOFTWARECAMPUSEDGE ENETERPRISE RESOURCE MANAGEMENT SOFTWARE
CAMPUSEDGE ENETERPRISE RESOURCE MANAGEMENT SOFTWARE
 
Top 10 Cases of Amnesia A Journey through Memory Loss.pptx
Top 10 Cases of Amnesia A Journey through Memory Loss.pptxTop 10 Cases of Amnesia A Journey through Memory Loss.pptx
Top 10 Cases of Amnesia A Journey through Memory Loss.pptx
 
Powering Up Your Digital Strategy, Amplifying the Potential of Performance-Ba...
Powering Up Your Digital Strategy, Amplifying the Potential of Performance-Ba...Powering Up Your Digital Strategy, Amplifying the Potential of Performance-Ba...
Powering Up Your Digital Strategy, Amplifying the Potential of Performance-Ba...
 
ABM, The True Story - Rob Griffin, G5 Futures
ABM, The True Story - Rob Griffin, G5 FuturesABM, The True Story - Rob Griffin, G5 Futures
ABM, The True Story - Rob Griffin, G5 Futures
 
Know about what is digital marketing.pptx
Know about what is digital marketing.pptxKnow about what is digital marketing.pptx
Know about what is digital marketing.pptx
 
Digital Marketing Trends, Experts Insights on How to Gain a Competitive Edge ...
Digital Marketing Trends, Experts Insights on How to Gain a Competitive Edge ...Digital Marketing Trends, Experts Insights on How to Gain a Competitive Edge ...
Digital Marketing Trends, Experts Insights on How to Gain a Competitive Edge ...
 
Importance of SEO to support holistic marketing strategies and the rise of n...
Importance of SEO to  support holistic marketing strategies and the rise of n...Importance of SEO to  support holistic marketing strategies and the rise of n...
Importance of SEO to support holistic marketing strategies and the rise of n...
 
webs jyoti php training in gurgaon
webs  jyoti  php training   in   gurgaonwebs  jyoti  php training   in   gurgaon
webs jyoti php training in gurgaon
 
Social Media Marketing Master Class - Jeff Dwoskin
Social Media Marketing Master Class - Jeff DwoskinSocial Media Marketing Master Class - Jeff Dwoskin
Social Media Marketing Master Class - Jeff Dwoskin
 
What Does a Social Media Manager‎ ‎ ‎ Do?
What Does a Social Media Manager‎ ‎ ‎  Do?What Does a Social Media Manager‎ ‎ ‎  Do?
What Does a Social Media Manager‎ ‎ ‎ Do?
 
NIMA2024 | Hoe Danone Trends vertaalt naar Strategie voor het versterken van ...
NIMA2024 | Hoe Danone Trends vertaalt naar Strategie voor het versterken van ...NIMA2024 | Hoe Danone Trends vertaalt naar Strategie voor het versterken van ...
NIMA2024 | Hoe Danone Trends vertaalt naar Strategie voor het versterken van ...
 
The Intersection Between AI & Paid Media Management - Curtiss Gulash
The Intersection Between AI & Paid Media Management - Curtiss GulashThe Intersection Between AI & Paid Media Management - Curtiss Gulash
The Intersection Between AI & Paid Media Management - Curtiss Gulash
 
Tools, Systems, & Websites to Grow a Profitable Business on Social Media - Ta...
Tools, Systems, & Websites to Grow a Profitable Business on Social Media - Ta...Tools, Systems, & Websites to Grow a Profitable Business on Social Media - Ta...
Tools, Systems, & Websites to Grow a Profitable Business on Social Media - Ta...
 
Go To Market Strategy - Zig When Others Zag
Go To Market Strategy - Zig When Others ZagGo To Market Strategy - Zig When Others Zag
Go To Market Strategy - Zig When Others Zag
 

Get AMP'ed for Accelerated Mobile Pages - SEO Grail Philadelphia 1/20/16

  • 1. January 20th, 2016 @seanmalseed Accelerated Mobile Pages Get AMP’ed for AMP(and other silly puns) seograil.com
  • 2. @seanmalseed Let’s talk about AMP. What is AMP? Where did AMP come from? How does AMP work? When should I use AMP? The WP plugin: how to get totally AMP’ed before your competitors do.
  • 8. @seanmalseed What is AMP? AMP, or Accelerated Mobile Pages, is a an open source project to create a standard which makes certain web pages load totally way super fast, through the cunning use of… www.ampproject.org https://www.ampproject.org/docs/get_started/about-amp.html
  • 9. @seanmalseed What is AMP? Strict subset of HTML AMP Javascript AMP CDN https://www.ampproject.org/docs/get_started/about-amp.html
  • 10. @seanmalseed Why is AMP so fast? Allow only asynchronous scripts Size all resources statically Don’t let extension mechanisms block rendering Keep all third-party JavaScript out of the critical path https://www.ampproject.org/docs/get_started/about-amp.html All CSS must be inline and size-bound Font triggering must be efficient Minimize style recalculations Only run GPU-accelerated animations Prioritize resource loading
  • 11. @seanmalseed AMP in a nutshell... AMP is the static web at it’s fastest and staticiest. … and it’s coming mid-February. https://www.ampproject.org/docs/get_started/about-amp.html
  • 15. @seanmalseed AMP HTML Kinda weird, really restrictive, but by golly it goes fast.
  • 16. @seanmalseed AMP HTML is just HTML with a whole bunch of restrictions.
  • 17. @seanmalseed How AMP works ⚡ AMP HTML <!doctype html> <html ⚡> <head> <meta charset="utf-8"> <link rel="canonical" href="hello-world.html"> <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1"> <style>body {opacity: 0}</style><noscript><style>body {opacity: 1}</style></noscript> <script async src="https://cdn.ampproject.org/v0.js"></script> </head> <body>Hello World!</body> </html> https://www.ampproject.org/docs/get_started/about-amp.html#amp-html
  • 18. @seanmalseed How AMP works ⚡ AMP HTML <!doctype html> <html ⚡> <head> <meta charset="utf-8"> <link rel="canonical" href="hello-world.html"> <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1"> <style>body {opacity: 0}</style><noscript><style>body {opacity: 1}</style></noscript> <script async src="https://cdn.ampproject.org/v0.js"></script> </head> <body>Hello World!</body> </html> Says that we’re doing AMP Super strict CSSAMP JS on the AMP CDN https://www.ampproject.org/docs/get_started/about-amp.html#amp-html You can also use <html amp>
  • 19. @seanmalseed How AMP works ⚡ AMP HTML restrictions There’s a ton of stuff AMP HTML limits. Some highlights: Conditional HTML comments are not allowed All attributes starting with ‘on’ are not allowed ‘Javascript:’ schema is not allowed All styles must be inline Only one style tag in the document head Style rules must be below 50KB No input elements or text areas of any kind ...yikes... https://github.com/ampproject/amphtml/blob/master/spec/amp-html-format.md
  • 20. @seanmalseed How AMP works ⚡ AMP HTML changes AMP HTML also makes a few changes. Some highlights: <img> is replaced by <amp-img> <video> is replaced by <amp-video> <audio> is replaced by <amp-audio> <iframe> is replaced by <amp-iframe> https://github.com/ampproject/amphtml/blob/master/spec/amp-html-format.md
  • 21. @seanmalseed Wait wait wait… Did you just say that AMP lets you have an iFrame?
  • 22. @seanmalseed How AMP works ⚡ AMP HTML iframe hax? Yes, AMP does have an amp-iframe tag that embeds a true-blue real iframe. It has a bunch of restrictions, but it does seem like a way to hack in some non-AMP source into your AMP pages. Like maybe a lead form? Reading their page about it seems like they might be wise, and considering a change. https://github.com/ampproject/amphtml/blob/master/extensions/amp-iframe/amp-iframe.md
  • 23. @seanmalseed How AMP works ⚡ AMP HTML iframe restrictions? amp-iframe may not appear close to the top of the document (except for iframes that use placeholder as described below). They must be either 600px away from the top or not within the first 75% of the viewport when scrolled to the top – whichever is smaller. NOTE: We are currently looking for feedback as to how well this restriction works in practice. They are sandboxed by default. Details They must only request resources via HTTPS or from a data-URI or via the srcdoc attribute. They must not be in the same origin as the container unless they do not allow allow-same-origin in the sandbox attribute. See the doc "Iframe origin policy" for further details on allowed origins for iframes. https://github.com/ampproject/amphtml/blob/master/extensions/amp-iframe/amp-iframe.md
  • 24. @seanmalseed AMP JS It can do the Kessel Run in less than twelve parsecs.
  • 25. @seanmalseed How AMP works ⚡ AMP Javascript AMP JS is a Javascript library that does neat AMP speed tricks. The library makes all external resources load asynchronously, meaning that one thing loading doesn’t stop other things from starting to load. It pre-calculates the layout of every element. It disables slow CSS selectors. https://www.ampproject.org/docs/get_started/about-amp.html#amp-js
  • 26. @seanmalseed How AMP works ⚡ AMP Javascript <!doctype html> <html ⚡> <head> <meta charset="utf-8"> <link rel="canonical" href="hello-world.html"> <meta name="viewport" content="width=device-width,minimum-scale=1,initial-scale=1"> <style>body {opacity: 0}</style><noscript><style>body {opacity: 1}</style></noscript> <script async src="https://cdn.ampproject.org/v0.js"></script> </head> <body>Hello World!</body> </html> That’s how you load AMP JS.
  • 28. @seanmalseed How AMP works ⚡ AMP CDN There were rumors that the AMP CDN was required, and you’d have to host your AMP pages on Google’s servers. NOPE. https://github.com/ampproject/amphtml/blob/master/spec/amp-html-format.md
  • 29. @seanmalseed How AMP works ⚡ AMP CDN How does the AMP CDN work? It just kind of does.
  • 30. @seanmalseed How AMP works ⚡ AMP CDN The AMP CDN serves out cached versions of your resources. Just reference the resource preceded by the CDN: https://cdn.ampproject.org/c/s/www.yoursite.com/whatever http://stackoverflow.com/questions/34720444/how-can-i-test-the-cdn-of-googles-amp-project
  • 32. @seanmalseed When to use AMP ⚡ AMP is made for static pages. YES: Articles, blogs, and things that don’t move around a lot. NO: Your storefront, a form, hampsterdance.com, anything interactive.
  • 33. @seanmalseed How does Google know about my AMP version?
  • 34. @seanmalseed Pointing to your AMP ⚡ Easy peasy. Link rel=”amphtml” <link rel="amphtml" href="https://www.whatever.com/page/amp">
  • 36. @seanmalseed … and it almost doesn’t totally suck and not work at all.
  • 38. @seanmalseed If you really wanna risk it, though: https://wordpress.org/plugins/amp/
  • 39. @seanmalseed Go home and play with some AMP thanks to The Guardian Regs old Guardian: http://www.theguardian.com/media/2015/oct/11/google-amp-facebook- instant-articles-apple-news AMPlified Guardian: https://www.theguardian.com/media/2015/oct/11/google-amp-facebook- instant-articles-apple-news/amp The Guardian implemented AMP on all their articles, and Google uses them as their example in a bunch of places. Wonder how much Google had to pay ‘em for that… :D