SlideShare a Scribd company logo
AMP
@greenido
ido-green.appspot.com
With the shift to mobile, the way we
consume content has changed
9:34 AM
contentbazaar.co/20160314/pi-way
9:34 AM
contentbazaar.co/20160314/pi-way
Lorem ipsum dolor sit amet,
consectetur adipiscing elit, sed do
eiusmod tempor incididunt ut
labore et dolore magna aliqua. Ut
enim ad minim veniam, quis
nostrud exercitation ullamco
9:34 AM
contentbazaar.co/20160314/pi-way
Slow
Loading
Non-Responsive
Content
Content
Shifting

Recommended for you

Mobile Site For Mobile World
Mobile Site For Mobile WorldMobile Site For Mobile World
Mobile Site For Mobile World

It's a mobile world out there. You wish your site (and apps) to be 'mobile first' and make sure they are using the best practices for mobile. It's important to remember that E-commerce occurs across apps and web, but consumers rely disproportionately on mobile web for commercial tasks. In these slides we will show you how to improve your sites/app for the new world. Good luck!

web designfront end developmentmobile
E-commerce Berlin Expo 2018 - From AMP to PWA: A Modern Web User Journey
E-commerce Berlin Expo 2018 - From AMP to PWA: A Modern Web User JourneyE-commerce Berlin Expo 2018 - From AMP to PWA: A Modern Web User Journey
E-commerce Berlin Expo 2018 - From AMP to PWA: A Modern Web User Journey

Rowan Merewood Developer Advocate Google Accelerated Mobile Pages (AMP) HTML delivers outstanding page-load performance for users browsing content on the mobile web, which is hugely important on limited or flaky networks. Progressive Web Apps deliver reliable performance for re-visits to sites thanks to Service Workers and allows unprecedented engagement via push notifications and Add To Homescreen. AMP gets content in front of users fast – PWAs enable rich experiences and engagement. What if I told you there’s a way to utilize the unique power of both? To build a web experience that loads in an instant and upgrades you to maximum interactivity and engagement? We’re making it happen. Come to learn how.

ampaccelerated mobile pagespwa
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
It sometimes seems like
we’ve just given in.
Data from: Reuters Institute - Digital News Report
http://www.digitalnewsreport.org/survey/2015/executive-summary-and-key-findings-2015/
2015
2014
2013
2012
Smartphone news use
60%
40%
20%
0%
GermanyJapan France UK US Denmark
NA
State of the News Media 2015, Pew Research Center
http://www.journalism.org/2015/04/29/state-of-the-news-media-2015/
78% of top news
sites and apps
(2015)
Mobile > Desktop
Visitors
20% of top news
sites and apps
(2015)
Mobile > Desktop
Time Spent Per Visit
State of the News Media 2015, Pew Research Center
http://www.journalism.org/2015/04/29/state-of-the-news-media-2015/

Recommended for you

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
WordPress & Front-end performance
WordPress & Front-end performanceWordPress & Front-end performance
WordPress & Front-end performance

In this presentation I’ll show how WordPress themes (and sites) can be built to achieve 100/100 Google pagespeed. You’ll learn about my process of using Gulp to concatenate and minify resources, along with intentional enqueues and dequeues. Bonus: some ways to configure cache plugins to achieve a similar effect. Take aways: How front-end performance effects mobile users on slower speeds. Tips on improving front-end performance. Gulp basics and how to use with WordPress.

wordpressperformancewordcamp
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
http://observer.com/2015/09/the-homepage-is-officially-dead
http://www.theatlantic.com/business/archive/2014/05/what-the-death-the-homepage-means-for-news/370997
http://www.forbes.com/sites/sachinkamdar/2015/12/27/is-the-homepage-dead/#5267c9e35bf8
40% of people abandon
a website that takes
more than 3
seconds to load
https://blog.kissmetrics.com/loading-time
● How to build experiences that will be fast
and engaging while monetizing well?
● How to operate in a world where the
discovery of content is increasingly
happening off-site?
Accelerated Mobile Pages Project
Introducing ...

Recommended for you

Progressive Web Apps 1. keynote
Progressive Web Apps 1. keynoteProgressive Web Apps 1. keynote
Progressive Web Apps 1. keynote

Introduction to Progressive Web Apps, why is it important, and how to get started. A step by step guidance towards a better user experience.

progressivewebappspwaweb
Accelerated mobile pages - AuroIN
Accelerated mobile pages - AuroINAccelerated mobile pages - AuroIN
Accelerated mobile pages - AuroIN

Accelerated Mobile Pages (AMP) were introduced by Google in 2015 in partnership with dozens of media from around the world. The goal is to make mobile web surfing more mobile by significantly accelerating the loading speed of the pages. If you use the browser to surf the web from your mobile device, you have already encountered this new mobile web page format.

digital marketing servicesconversion rate optimizationemail marketing
Meet.js Summit 2019 - PWA in practice
Meet.js Summit 2019 - PWA in practiceMeet.js Summit 2019 - PWA in practice
Meet.js Summit 2019 - PWA in practice

Progressive Web Apps aim to provide an app-like user experience through features like push notifications, offline support, and installation prompts while maintaining the key web-based advantages of universality, security, and lack of dependence on app stores. They work across browsers using progressive enhancement and rely on modern web APIs like service workers and the web app manifest to provide app-like functionality, falling back to support core content on all platforms through techniques like polyfilling and graceful degradation. While browser support for some features like service workers is still evolving, Progressive Web Apps aim to make high-quality web apps available to all.

meet.jspwajavascript
Demo: AMP on Google Search driving content discovery
In late February, Google launched AMP articles in “Top stories” in Google Search
Try it now on
google.com
(in your phone’s browser)
Amp Overview #YGLF 2016
Goals for the AMP Project
Make
pages fast
Be easy to
implement
Embrace the
open web
Enable
monetization
Amp Overview #YGLF 2016

Recommended for you

Progressive web apps
Progressive web appsProgressive web apps
Progressive web apps

Slides from my recent presentation on Progressive web apps. I showed what they are and how I believe they are the future of web/app development. I also demonstrated how to use de F12 tools in Chrome to debug the Service Worker and the Manifest.json file. I also demonstrated how, by adding and changing a few lines, a Node.js app is converted to a progressive web app.

mobilewindowsmsedge
The Case for Progressive Web Apps
The Case for Progressive Web AppsThe Case for Progressive Web Apps
The Case for Progressive Web Apps

Is the buzz around Progressive Web Apps real or are they simply the latest fad? In this talk, you’ll learn exactly what Progressive Web Apps are, what problems they solve, and what new design challenges they present. Jason will show how organizations are using Progressive Web Apps to provide better and faster user experiences.

pwaresponsive web designamp
Progressive Web App Challenges
Progressive Web App ChallengesProgressive Web App Challenges
Progressive Web App Challenges

The document discusses progressive web apps (PWAs) and outlines key considerations for creating a PWA. It addresses questions around what a PWA is, how to make a website feel like an app, offline functionality, push notifications, and creating a roadmap. Examples from companies that implemented PWAs successfully are provided. The conclusion recommends developing a progressive roadmap that starts with baseline PWA features and builds out functionality over time based on priorities and initiatives.

progressivewebapp
Amp Overview #YGLF 2016
AMP pages = web pages:
● AMP-HTML + CSS
● No one-off JavaScript
● Instead: custom elements
● Sandboxed amp-iframes can
contain anything
AMP open-source JS library:
● Same everywhere ⇒ highly cacheable
● Defines behaviors for
custom elements
● Manages rendering and resource
loading to optimize performance
AMP pages = web pages:
● AMP-HTML + CSS
● No one-off JavaScript
● Instead: custom elements
● Sandboxed amp-iframes can
contain anything
AMP open-source JS library:
● Same everywhere ⇒ highly cacheable
● Defines behaviors for
custom elements
● Manages rendering and resource
loading to optimize performance
“AMP”
What is AMP?
HTML5
(AMP-HTML)
JavaScript
(AMP JS Library)
CSS3
(Custom styling)
Caching
(AMP Cache)

Recommended for you

Progressive Web Apps
Progressive Web AppsProgressive Web Apps
Progressive Web Apps

A Progressive Web App uses modern web capabilities to deliver an app-like user experience. Progressive Web Apps bring features we expect from native apps to the mobile browser experience in a way that uses standards-based technologies and run in a secure container accessible to anyone on the web.

progressive web appsjavascriptpwa
February 2018: Sustainable UX Conference
February 2018: Sustainable UX ConferenceFebruary 2018: Sustainable UX Conference
February 2018: Sustainable UX Conference

The document is a slide presentation about AMP (Accelerated Mobile Pages) that discusses: - Mobile web challenges like slow devices and networks where JavaScript does heavy lifting. - How AMP addresses these with techniques like inlined CSS, prioritized resource loading, and async JavaScript to make pages load instantly. - Examples of companies that use AMP and the types of content it works for. - How AMP can be used as an entry point or data source to build progressive web apps with features like service workers for offline use.

amp
Nodevember 2017: AMP Primer
Nodevember 2017: AMP PrimerNodevember 2017: AMP Primer
Nodevember 2017: AMP Primer

In 2016, mobile internet usage exceeded desktop for the first time! With over 50% of users on mobile, is your web app optimized for them? Let’s learn about Accelerated Mobile Pages, how AMP address mobile user challenges and build a valid AMP app together! http://nodevember.org/speaker/Lisa%20Huang

mobileweb developmentamp
What is AMP?
HTML5
(AMP-HTML)
JavaScript
(AMP JS Library)
CSS3
(Custom styling)
Caching
(AMP Cache)
Validation (AMP Validator)
AMP Publishing Flow
AMP-HTML
HTML
AMP Cache
CMS
Ad revenue and analytics
Publishers depicted are
examples for illustrative
purposes Platforms depicted
are examples for
illustrative purposes
Link Tags
Three Sources of Speed
AMP-HTML
HTML
AMP Cache
CMS
Ad revenue and analytics
CachingAMP-HTML Format Prerendering
Link Tags
S P E E D S O U R C E # 1
AMP-HTML Format

Recommended for you

De l'application mobile à l'application web progressive
De l'application mobile à l'application web progressiveDe l'application mobile à l'application web progressive
De l'application mobile à l'application web progressive

Avec l’avénement des téléphones intelligents, l’application mobile est devenu incontournable et indispensable à tous business. Nous verrons en quelques chiffres l’envers du décors de cette ruée vers l’or. Publier une application mobile pour le Play Store, pour l’App Store d’Apple, pour le Windows Phone Store, etc. heureusement, il existe des solutions de développement mobile selon le type d’application souhaitée et les contraintes du projet. De l’application native à l’application multiplateforme, nous ferrons un tour d’horizon des technologies. Nous nous attarderons sur l’application multiplateforme de type WebView avant d’envisager l’application web progressive. Un exemple concret d’implémentation sera mis en lumière (Application shell, Service workers, Manifest). Avec une telle facilité de mise en oeuvre, quel est l’avenir du développement mobile ?

multiplateformepwamobile application development
Progressive Web Apps and the Windows Ecosystem [Build 2017]
Progressive Web Apps and the Windows Ecosystem [Build 2017]Progressive Web Apps and the Windows Ecosystem [Build 2017]
Progressive Web Apps and the Windows Ecosystem [Build 2017]

Whether at home or at work, the web plays an increasingly critical role in our daily lives. As we have become more dependent on accessing the tools it powers, we’ve also struggled to overcome some of its limitations—network connectivity, for instance. At Microsoft, we’ve long been interested in the power of the web for software development and we are even more excited for the future possibilities offered by progressive web apps (PWAs). In this session, we discuss what PWAs are, how they can be integrated into the development process of modern websites, the advantages and disadvantages of PWAs vs. native development, and what opportunities they present when installed alongside native apps in Windows.

appsmicrosoft edgewindows
Accelerated Mobile Pages (AMP) & How it will Impact your Business
Accelerated Mobile Pages (AMP) & How it will Impact your BusinessAccelerated Mobile Pages (AMP) & How it will Impact your Business
Accelerated Mobile Pages (AMP) & How it will Impact your Business

Accelerated Mobile Pages (AMP) & How it will Impact your Business - SEO, Traffic, Visibility, Ad Revenue & others

ampseoaccelerated mobile pages
Average Mobile Site
Image: https://en.wikipedia.org/wiki/Auto_racing#/media/File:Three-wide_multiple_row_back.JPG
Hand-Tuned Site
Average Mobile Site
Image: https://en.wikipedia.org/wiki/Auto_racing#/media/File:Three-wide_multiple_row_back.JPG
Hand-Tuned Site
Average Mobile Site
Image: https://en.wikipedia.org/wiki/Auto_racing#/media/File:Three-wide_multiple_row_back.JPG
AMP
Hand-Tuned Site
Average Mobile Site
Image: https://en.wikipedia.org/wiki/Auto_racing#/media/File:Three-wide_multiple_row_back.JPG
All AMPs

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
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.

Going All-In On AMP
Going All-In On AMPGoing All-In On AMP
Going All-In On AMP

AMP — Accelerated Mobile Pages — is no longer an up-and-coming experimental project. It’s now integrated into Google’s regular results and its use has expanded far beyond publishers; it is now being deployed by retailers and others. Whether you’re just getting started with AMP or are looking to get more from your existing AMP efforts, this session explores the latest developments and what you should do to take advantage of them.

smx west 2018
● Smart content prioritization
✓ Prefetching the elements
✓ No relayout
✓ Asynchronous load
● Responsive design baked in
✓ Always get the best image for your screen (full srcset support)
● Limited by design
✓ No custom JavaScript except in amp-iframe
✓ No scrolling elements on the page
✓ Max 50KB inline stylesheet
AMP Format: Elevated Performance Baseline for All
Image: https://en.wikipedia.org/wiki/Auto_racing#/media/File:Three-wide_multiple_row_back.JPG
10x4x
Less DataFaster
Data furnished by Google.
0101010110010011
1001010010100110
AMP Format: Elevated Performance Baseline for All
S P E E D S O U R C E # 2
Caching
Local copy of assets
Without an AMP cache With an AMP cache
Web server Web server
Edge server
Edge server
Edge server
Edge server
Edge server
Edge server
Edge server
Caching Brings Content Physically Closer to Users

Recommended for you

Accelerated Mobile Pages (AMP)
Accelerated Mobile Pages (AMP)Accelerated Mobile Pages (AMP)
Accelerated Mobile Pages (AMP)

Scope of this paper is to focus on Accelerated Mobile Pages a project brought by Google and its infinite possible use cases in this mobile-first era. In my paper, I have given emphasis on areas such as publishing articles, implementing news broadcast in storytelling format and Direct Email engagement via Accelerated Mobile Pages. As Accelerated Mobile Pages is an open source technology and it works on the browser it can be used by anyone on any device regardless of hardware and OS compatibilities. Date Ganesh Revji | Darvesh Raviraj Narsing | Mayuri Dendge"Accelerated Mobile Pages (AMP)" Published in International Journal of Trend in Scientific Research and Development (ijtsrd), ISSN: 2456-6470, Volume-2 | Issue-5 , August 2018, URL: http://www.ijtsrd.com/papers/ijtsrd15821.pdf http://www.ijtsrd.com/computer-science/world-wide-web/15821/accelerated-mobile-pages-amp/date-ganesh-revji

accelerated mobile pagesamp emailamp for word press
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: 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
S P E E D S O U R C E # 3
Prerendering
Header Logo
Responsive hero image
Headline
Article text
Image
in article
Some more text
Ad
Optimizations include:
● Only the first viewport is
prerendered — because AMP
knows where each page
element is positioned
● No 3rd party JavaScript is
executed at this stage
“Above the Fold”
Prerendered
“Below the Fold”
Not Prerendered
Prerendering by Platforms Can Make Loading Instant
Three Sources of Speed
AMP-HTML
HTML
AMP Cache
CMS
Ad revenue and analytics
Caching Prerendering
Link Tags
AMP-HTML Format
20 Minutes
20 Minutos
ABC
AS
BBC
Abendzeitung
ANSA
Bento
Berliner Morgenpost
BILD
Blasting News
Blogo.it
CCM Benchmark
Charente Libre.fr
Conde Nast
Corriere della Sera
DailyMail.com / MailOnline
Daily Star
The Week
El Confidencial
El Español
El Mundo
El Mundo Deportivo
EL PAÍS
El Periódico
El Economista
Europa Press
Evening Standard
Expansión
Daily Express
Frankfurter Allgemeine Zeitung
FOCUS Online
France 24
Francetvinfo
Golem.de
Gruner + Jahr
Guardian News & Media
HNA.de
IBT UK
Il Fatto Quotidiano
IlSole24Ore
IlSussidiario.net
Ippen Digital Plattform
kicker
La République des Pyrénées
La Stampa
La Vanguardia
Lagardère Active
Le Parisien
Les Echos
L'Express
Mail.Ru Group
Marca
Meduza
merkur.de
Metro UK
Metronews
OK!
Ouest France
Promiflash
Público
Repubblica
RP Online
RT
RTL
Russmedia Digital
Sorrisi e Canzoni
SPIEGEL ONLINE
Sport
SPORT1
Stuttgarter Zeitung
Süddeutsche Zeitung
SudOuest.fr
t-online.de
tagesschau
TF1
The Financial Times
The Independent
Trinity Mirror
tz.de
Vocento
Welt.de
ZEIT ONLINE
Вести.Ru
Информационное агентство
России ТАСС
Лента.ру
Московский Комсомолец
Телекомпания НТВ
Europe
Asia
Ameba.com
Asahi Shimbun
Bintang.com
BLOGOS
Bloter
Bola.com
Oneindia
Business Standard
CINEMATODAY
Digital Chosun
Eiga.com
FirstPost
Hankyung.com
Indiatoday.in
JoongAng Ilbo
KapanLagi Network
KASKUS
Kompas.com
Liputan6.com
Maekyung.com
Mainichi Shimbun
Mynavi News
NDTV
Newstapa
Nikkan Sports
Republika.co.id
Response
Sankei News
SANSPO
Slow News
THE PAGE
Tempo.co
Economic Times
Uzone.id
Yonhap News
ZAKZAK
North America
ABC News
The Atlantic
Business Insider
Buzzfeed
CNN
Digital Trends
E! News
Entrepreneur
Forbes
Fusion
Hearst
Heavy
The Huffington Post
IBT Media
The Inquisitr News
Los Angeles Times
MarketWatch
Mic
MSNBC
New York Daily News
The Next Web
The New York Post
The New York Times
POPSUGAR.
SB Nation
theScore
Time Inc.
Tribune Media
USA Today
The Verge
Vox
Wall Street Journal
Washington Post
Latin America
Agência Brasil
Basket4us.com
Cybercook
Diário 24 Horas
EBC
Economiahoy.mx
El Universal
Época
ESPN Brasil
Estadão
Exame.com
Excelsior
Folha de S. Paulo
Galileu
Globo
Grupo Expansion
Grupo Imagen
Grupo Medios
Grupo RBS
Jornal Extra
M de Mulher
MaisEquilibrio
O Globo
Portal Catraca Livre
R7.com
Radioagência Nacional
Tecmundo
Televisa
Terra
Terra Mexico
TV Azteca
UOL
Vanguardia
Veja São Paulo
Veja.com
Vila Mulher
Publishers Supporting AMP
(A Growing List!)

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
Technical SEO, AMP and boost up page speed
Technical SEO, AMP and boost up page speedTechnical SEO, AMP and boost up page speed
Technical SEO, AMP and boost up page speed

- Technical SEO - What is AMP & benefit? - Difference to mobile site? AMP tester. - What is AMP stories? - Page speed importance - Site improvement with AMP - AMP SEO - WordPress plugins

technical seoseoamp
Ramp up your Mobile Content Slideshow
Ramp up your Mobile Content SlideshowRamp up your Mobile Content Slideshow
Ramp up your Mobile Content Slideshow

This document discusses Google's Accelerated Mobile Pages (AMP) project and provides a roadmap for implementing AMP on a website. It begins with an overview of AMP and its benefits like faster page loads and increased visibility in search results. It then outlines a three step roadmap: 1) building the business case for AMP, 2) setting goals for priorities and analytics, and 3) maintaining AMP page health. Key resources for creating AMP pages like templates, components and validation tools are also reviewed. The presentation concludes by highlighting additional AMP resources and thanking the audience.

ampaccelerated mobile pagesbrightonseo17
Apps & Platforms Supporting AMP
(Also A Growing List!)
Google Search Google News
Google News & Weather
7300+ 1900+PULL REQUESTSDEVELOPERS HAVE
ENGAGED
88RELEASES
Fantastic momentum and engagement for AMP Project
Source: github.com/ampproject/amphtml. Data as of May 12, 2016
Ads Content Access
FormatAnalytics
Focus Areas
Publishers
Vendors
Platforms
Collaborators
Analytics in AMP
● <amp-analytics> custom element
● Highly configurable analytics framework
■ Event triggers: Page visible, click, scroll, timer
■ AMP library–provided data values: Client ID, page and content
info, device and browser info, performance, and more
● Instrumentation managed by AMP means performance stays in
check: “Measure once, report to many”
● Easy vendor config from 10+ vendors (and more welcome)

Recommended for you

Accelerating AdTech on AWS in Japan
Accelerating AdTech on AWS in JapanAccelerating AdTech on AWS in Japan
Accelerating AdTech on AWS in Japan

This document summarizes four Japanese AdTech companies that use AWS: Dynalyst, fluct, IM-DMP, and UNICORN. Dynalyst uses AWS for real-time bidding and cross-region data processing. fluct is an SSP that processes 30 billion impressions per month on a serverless architecture. IM-DMP utilizes Amazon ECS and Spot Fleet to power its public DMP. UNICORN is a full automated marketing platform that uses AWS for real-time bidding, data analysis, and machine learning.

awsadtech
Jeffrey Jose
Jeffrey Jose   Jeffrey Jose
Jeffrey Jose

This document discusses Accelerated Mobile Pages (AMP) and how it improves the mobile web experience. AMP aims to create fast loading, visual content across different surfaces like websites, emails and stories. It allows for richer media like video and images while keeping pages lightweight. Analytics data shows that AMP pages have lower bounce rates and higher conversion rates compared to regular pages. The document outlines various AMP formats and capabilities like A/B testing, reporting, e-commerce support and more to provide enhanced user experiences across devices and platforms.

Progressive Web Apps – the return of the web?
Progressive Web Apps – the return of the web?Progressive Web Apps – the return of the web?
Progressive Web Apps – the return of the web?

Progressive Web Apps aim to bring the benefits of native mobile apps to the web. They use newer web capabilities like app manifests and service workers to deliver app-like experiences through the browser. App manifests allow web apps to be installed on home screens and launched full screen like native apps. Service workers enable features like offline access and push notifications. Early adopters are seeing increased user engagement through Progressive Web Apps, with metrics like conversions and time spent improving. While browser support is still evolving, Progressive Web Apps provide a promising approach for delivering high-quality mobile experiences through the web.

progressivewebappsdevternity
Ads in AMP
● <amp-ad> custom element
● Integration with existing ad trafficking workflows
● Support for most common formats: standard banner ads,
HTML5 ads, native ads, ads that resize on user interaction
● No restrictions on ad density
● Viewability support
● Integration with dozens of 3rd party providers: demand sources,
sponsored content, data management platforms
Content Access in AMP
● <amp-access> custom element
● Support for metering and subscriber sign-in
● Client-side content hiding
● Publisher uses their own business logic to make access decision
● Publisher can track (count) accesses
● Integration with amp-analytics
Join the AMP initiative
1 EXPLORE
ampproject.org/docs to learn more and read documentation
github.com/ampproject/amphtml to connect with the development team
2 DEVELOP & TEST
Start developing AMP files and validate them
3 LAUNCH
Point to AMP files from canonical articles to make them discoverable
and eligible to appear in content platforms
1
2
3
Format Innovation in AMP
● Out of the box image carousel and lightbox
● Menu for site navigation (amp-sidebar)
● Tighter Progressive Web App (PWA) integration (amp-install-serviceworker)
● Templating for dynamic data loading (amp-list)
● Expand/collapse sections (amp-accordion)
● 15+ supported vendor extensions (audio, video, social, etc)

Recommended for you

Fantastic Voyage into the Web of Data
Fantastic Voyage into the Web of DataFantastic Voyage into the Web of Data
Fantastic Voyage into the Web of Data

My presentation at the webmontag in Frankfurt about decentralisation of data, using APIs and mixing the web with YQL.

datawebapisocial
Big Data and Analytics on Amazon Web Services: Building A Business-Friendly P...
Big Data and Analytics on Amazon Web Services: Building A Business-Friendly P...Big Data and Analytics on Amazon Web Services: Building A Business-Friendly P...
Big Data and Analytics on Amazon Web Services: Building A Business-Friendly P...

If you are crafting a better customer experience, automating your business, or modernizing your systems, you are likely finding that your data and analytics platform is absolutely critical to your success. In this session, we will look at how customers are building on the managed services from Amazon Web Services to meet the needs of the business. Patterns we see gaining popularity are near-real time engagement with customers over mobile, also combining and analyzing unstructured consumer behavior with structured transactional data, as well as managing spiky data workloads. See how our customers use our managed, elastic, secure, and highly available services to change what is possible.

aws summit 20162016tpesummitiot & big data session
Why AMP for WordPress?
Why AMP for WordPress? Why AMP for WordPress?
Why AMP for WordPress?

What is AMP and why should you care about it? This presentation will give an overview of the AMP specifications and what are its benefits. This will include case study examples. Next, I’ll discuss the challenges of implementing AMP, AMP and Gutenberg, and AMP themes/plugins.

wordpressampweb design
Q & A
THANK YOU
@greenido
ido-green.appspot.com
Amp Overview #YGLF 2016
Amp Overview #YGLF 2016

Recommended for you

ANTS Programmatic Agency - Credential
ANTS Programmatic Agency - CredentialANTS Programmatic Agency - Credential
ANTS Programmatic Agency - Credential

ANTS Programmatic Agency - Credential ANTS Data-Driven Marketing-Sales Group is the leading technology-driven integrated internet advertising platform in Southeast Asia. ANTS solutions provide a unique Software as a Service (SaaS) platform by combining Demand Side Platform – Supply Side Platform, which includes Data Management Technology and Extraordinary Insight Engine (Founded in 2014). Beyond just the digital marketing and performance marketing agency, ANTS is proud of providing the full-stack data-driven marketing-sales solution for increasing the profits of our clients in FMCG, F&B, Ecommerce, Etailer, Omnichannel through our successful campaigns. ANTS Programmatic Agency (ANTS ATD) is ANTS Group’s programmatic specialist division, which is designed as an open, integrated, neutral partner. With more than 50 specialists in over 4 countries, ANTS ATD’s experts and our programmatic platform help clients reach their consumers with the most effective advertising experiences. ANTS are successful because we eliminate the complexities in digital services, making it easier for consumers to achieve an outcome. Despite years of disruption, confusion and operational risks in programmatic media, ANTS is putting a stake in the ground to do the same with the programmatic & multichannel media buying industry. Specifically, it is pioneering what it means for the advertising industry to offer simplicity and accountability to clients. ANTS vision is to unleash the full economic potential of digital media and business, built on the application of its expertise, data, algorithms, technology and media investments to assume risks and drive measurable outcomes for clients. With 100 data-driven & programmatic experts, ANTS has over 1,000 clients in 4 markets across Southeast Asia, Singapore, Vietnam and Indonesia.

ants.vnants vietnamants programmatic agency
Schema and Open Graph 101 - SMX Munich
Schema and Open Graph 101 - SMX MunichSchema and Open Graph 101 - SMX Munich
Schema and Open Graph 101 - SMX Munich

Matthew Brown discusses semantic search engine optimization techniques. He defines semantic SEO as using semantic web technologies to send detailed page content meanings to search engines in a way computers can process. Brown recommends starting with Schema.org and Open Graph vocabularies and provides links to resources on structured data types, markup troubleshooting, and semantic web statistics. He also lists people involved in both SEO and semantic web fields.

semantseosearch engine optimization
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

More Related Content

What's hot

From AMP to PWA
From AMP to PWAFrom AMP to PWA
From AMP to PWA
Ido Green
 
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
 
Accelerated Mobile Pages (AMP) The Next Revolution in Mobile Web Development
Accelerated Mobile Pages (AMP) The Next Revolution in Mobile Web DevelopmentAccelerated Mobile Pages (AMP) The Next Revolution in Mobile Web Development
Accelerated Mobile Pages (AMP) The Next Revolution in Mobile Web Development
NotifyVisitors
 
Mobile Site For Mobile World
Mobile Site For Mobile WorldMobile Site For Mobile World
Mobile Site For Mobile World
Ido Green
 
E-commerce Berlin Expo 2018 - From AMP to PWA: A Modern Web User Journey
E-commerce Berlin Expo 2018 - From AMP to PWA: A Modern Web User JourneyE-commerce Berlin Expo 2018 - From AMP to PWA: A Modern Web User Journey
E-commerce Berlin Expo 2018 - From AMP to PWA: A Modern Web User Journey
E-Commerce Berlin EXPO
 
Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)
Chitpong Wuttanan
 
AMP and PWA
AMP and PWAAMP and PWA
AMP and PWA
Eun Cho
 
WordPress & Front-end performance
WordPress & Front-end performanceWordPress & Front-end performance
WordPress & Front-end performance
Michael Mizner
 
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
 
Progressive Web Apps 1. keynote
Progressive Web Apps 1. keynoteProgressive Web Apps 1. keynote
Progressive Web Apps 1. keynote
Abdelrahman Omran
 
Accelerated mobile pages - AuroIN
Accelerated mobile pages - AuroINAccelerated mobile pages - AuroIN
Accelerated mobile pages - AuroIN
AuroIN
 
Meet.js Summit 2019 - PWA in practice
Meet.js Summit 2019 - PWA in practiceMeet.js Summit 2019 - PWA in practice
Meet.js Summit 2019 - PWA in practice
Łukasz Romanowicz
 
Progressive web apps
Progressive web appsProgressive web apps
Progressive web apps
Timmy Kokke
 
The Case for Progressive Web Apps
The Case for Progressive Web AppsThe Case for Progressive Web Apps
The Case for Progressive Web Apps
Jason Grigsby
 
Progressive Web App Challenges
Progressive Web App ChallengesProgressive Web App Challenges
Progressive Web App Challenges
Jason Grigsby
 
Progressive Web Apps
Progressive Web AppsProgressive Web Apps
Progressive Web Apps
Nitheesh T Ganesh
 
February 2018: Sustainable UX Conference
February 2018: Sustainable UX ConferenceFebruary 2018: Sustainable UX Conference
February 2018: Sustainable UX Conference
Lisa Huang
 
Nodevember 2017: AMP Primer
Nodevember 2017: AMP PrimerNodevember 2017: AMP Primer
Nodevember 2017: AMP Primer
Lisa Huang
 
De l'application mobile à l'application web progressive
De l'application mobile à l'application web progressiveDe l'application mobile à l'application web progressive
De l'application mobile à l'application web progressive
Macha DA COSTA
 
Progressive Web Apps and the Windows Ecosystem [Build 2017]
Progressive Web Apps and the Windows Ecosystem [Build 2017]Progressive Web Apps and the Windows Ecosystem [Build 2017]
Progressive Web Apps and the Windows Ecosystem [Build 2017]
Aaron Gustafson
 

What's hot (20)

From AMP to PWA
From AMP to PWAFrom AMP to PWA
From AMP to PWA
 
Accelerated Mobile Pages - WordCamp Kansas City
Accelerated Mobile Pages - WordCamp Kansas CityAccelerated Mobile Pages - WordCamp Kansas City
Accelerated Mobile Pages - WordCamp Kansas City
 
Accelerated Mobile Pages (AMP) The Next Revolution in Mobile Web Development
Accelerated Mobile Pages (AMP) The Next Revolution in Mobile Web DevelopmentAccelerated Mobile Pages (AMP) The Next Revolution in Mobile Web Development
Accelerated Mobile Pages (AMP) The Next Revolution in Mobile Web Development
 
Mobile Site For Mobile World
Mobile Site For Mobile WorldMobile Site For Mobile World
Mobile Site For Mobile World
 
E-commerce Berlin Expo 2018 - From AMP to PWA: A Modern Web User Journey
E-commerce Berlin Expo 2018 - From AMP to PWA: A Modern Web User JourneyE-commerce Berlin Expo 2018 - From AMP to PWA: A Modern Web User Journey
E-commerce Berlin Expo 2018 - From AMP to PWA: A Modern Web User Journey
 
Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)
 
AMP and PWA
AMP and PWAAMP and PWA
AMP and PWA
 
WordPress & Front-end performance
WordPress & Front-end performanceWordPress & Front-end performance
WordPress & Front-end performance
 
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
 
Progressive Web Apps 1. keynote
Progressive Web Apps 1. keynoteProgressive Web Apps 1. keynote
Progressive Web Apps 1. keynote
 
Accelerated mobile pages - AuroIN
Accelerated mobile pages - AuroINAccelerated mobile pages - AuroIN
Accelerated mobile pages - AuroIN
 
Meet.js Summit 2019 - PWA in practice
Meet.js Summit 2019 - PWA in practiceMeet.js Summit 2019 - PWA in practice
Meet.js Summit 2019 - PWA in practice
 
Progressive web apps
Progressive web appsProgressive web apps
Progressive web apps
 
The Case for Progressive Web Apps
The Case for Progressive Web AppsThe Case for Progressive Web Apps
The Case for Progressive Web Apps
 
Progressive Web App Challenges
Progressive Web App ChallengesProgressive Web App Challenges
Progressive Web App Challenges
 
Progressive Web Apps
Progressive Web AppsProgressive Web Apps
Progressive Web Apps
 
February 2018: Sustainable UX Conference
February 2018: Sustainable UX ConferenceFebruary 2018: Sustainable UX Conference
February 2018: Sustainable UX Conference
 
Nodevember 2017: AMP Primer
Nodevember 2017: AMP PrimerNodevember 2017: AMP Primer
Nodevember 2017: AMP Primer
 
De l'application mobile à l'application web progressive
De l'application mobile à l'application web progressiveDe l'application mobile à l'application web progressive
De l'application mobile à l'application web progressive
 
Progressive Web Apps and the Windows Ecosystem [Build 2017]
Progressive Web Apps and the Windows Ecosystem [Build 2017]Progressive Web Apps and the Windows Ecosystem [Build 2017]
Progressive Web Apps and the Windows Ecosystem [Build 2017]
 

Similar to Amp Overview #YGLF 2016

Accelerated Mobile Pages (AMP) & How it will Impact your Business
Accelerated Mobile Pages (AMP) & How it will Impact your BusinessAccelerated Mobile Pages (AMP) & How it will Impact your Business
Accelerated Mobile Pages (AMP) & How it will Impact your Business
Harshavardhan MP
 
Get AMP’ed for AMP!
Get AMP’ed for AMP!Get AMP’ed for AMP!
Get AMP’ed for AMP!
Greenlane
 
AMP K.S.
AMP K.S.AMP K.S.
AMP K.S.
Jacob Lial
 
Going All-In On AMP
Going All-In On AMPGoing All-In On AMP
Going All-In On AMP
Benu Aggarwal
 
Accelerated Mobile Pages (AMP)
Accelerated Mobile Pages (AMP)Accelerated Mobile Pages (AMP)
Accelerated Mobile Pages (AMP)
ijtsrd
 
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: 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
 
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
 
Technical SEO, AMP and boost up page speed
Technical SEO, AMP and boost up page speedTechnical SEO, AMP and boost up page speed
Technical SEO, AMP and boost up page speed
ivan so
 
Ramp up your Mobile Content Slideshow
Ramp up your Mobile Content SlideshowRamp up your Mobile Content Slideshow
Ramp up your Mobile Content Slideshow
Dan Lapham
 
Accelerating AdTech on AWS in Japan
Accelerating AdTech on AWS in JapanAccelerating AdTech on AWS in Japan
Accelerating AdTech on AWS in Japan
Eiji Shinohara
 
Jeffrey Jose
Jeffrey Jose   Jeffrey Jose
Jeffrey Jose
James Prentis
 
Progressive Web Apps – the return of the web?
Progressive Web Apps – the return of the web?Progressive Web Apps – the return of the web?
Progressive Web Apps – the return of the web?
Christian Heilmann
 
Fantastic Voyage into the Web of Data
Fantastic Voyage into the Web of DataFantastic Voyage into the Web of Data
Fantastic Voyage into the Web of Data
Christian Heilmann
 
Big Data and Analytics on Amazon Web Services: Building A Business-Friendly P...
Big Data and Analytics on Amazon Web Services: Building A Business-Friendly P...Big Data and Analytics on Amazon Web Services: Building A Business-Friendly P...
Big Data and Analytics on Amazon Web Services: Building A Business-Friendly P...
Amazon Web Services
 
Why AMP for WordPress?
Why AMP for WordPress? Why AMP for WordPress?
Why AMP for WordPress?
TAC Marketing Group
 
ANTS Programmatic Agency - Credential
ANTS Programmatic Agency - CredentialANTS Programmatic Agency - Credential
ANTS Programmatic Agency - Credential
ANTS
 
Schema and Open Graph 101 - SMX Munich
Schema and Open Graph 101 - SMX MunichSchema and Open Graph 101 - SMX Munich
Schema and Open Graph 101 - SMX Munich
Matthew Brown
 
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
 
Wordcamp 2017-toronto-sam lalonde
Wordcamp 2017-toronto-sam lalondeWordcamp 2017-toronto-sam lalonde
Wordcamp 2017-toronto-sam lalonde
wcto2017
 

Similar to Amp Overview #YGLF 2016 (20)

Accelerated Mobile Pages (AMP) & How it will Impact your Business
Accelerated Mobile Pages (AMP) & How it will Impact your BusinessAccelerated Mobile Pages (AMP) & How it will Impact your Business
Accelerated Mobile Pages (AMP) & How it will Impact your Business
 
Get AMP’ed for AMP!
Get AMP’ed for AMP!Get AMP’ed for AMP!
Get AMP’ed for AMP!
 
AMP K.S.
AMP K.S.AMP K.S.
AMP K.S.
 
Going All-In On AMP
Going All-In On AMPGoing All-In On AMP
Going All-In On AMP
 
Accelerated Mobile Pages (AMP)
Accelerated Mobile Pages (AMP)Accelerated Mobile Pages (AMP)
Accelerated Mobile Pages (AMP)
 
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: 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
 
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
 
Technical SEO, AMP and boost up page speed
Technical SEO, AMP and boost up page speedTechnical SEO, AMP and boost up page speed
Technical SEO, AMP and boost up page speed
 
Ramp up your Mobile Content Slideshow
Ramp up your Mobile Content SlideshowRamp up your Mobile Content Slideshow
Ramp up your Mobile Content Slideshow
 
Accelerating AdTech on AWS in Japan
Accelerating AdTech on AWS in JapanAccelerating AdTech on AWS in Japan
Accelerating AdTech on AWS in Japan
 
Jeffrey Jose
Jeffrey Jose   Jeffrey Jose
Jeffrey Jose
 
Progressive Web Apps – the return of the web?
Progressive Web Apps – the return of the web?Progressive Web Apps – the return of the web?
Progressive Web Apps – the return of the web?
 
Fantastic Voyage into the Web of Data
Fantastic Voyage into the Web of DataFantastic Voyage into the Web of Data
Fantastic Voyage into the Web of Data
 
Big Data and Analytics on Amazon Web Services: Building A Business-Friendly P...
Big Data and Analytics on Amazon Web Services: Building A Business-Friendly P...Big Data and Analytics on Amazon Web Services: Building A Business-Friendly P...
Big Data and Analytics on Amazon Web Services: Building A Business-Friendly P...
 
Why AMP for WordPress?
Why AMP for WordPress? Why AMP for WordPress?
Why AMP for WordPress?
 
ANTS Programmatic Agency - Credential
ANTS Programmatic Agency - CredentialANTS Programmatic Agency - Credential
ANTS Programmatic Agency - Credential
 
Schema and Open Graph 101 - SMX Munich
Schema and Open Graph 101 - SMX MunichSchema and Open Graph 101 - SMX Munich
Schema and Open Graph 101 - SMX Munich
 
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
 
Wordcamp 2017-toronto-sam lalonde
Wordcamp 2017-toronto-sam lalondeWordcamp 2017-toronto-sam lalonde
Wordcamp 2017-toronto-sam lalonde
 

More from Ido Green

How to get things done - Lessons from Yahoo, Google, Netflix and Meta
How to get things done - Lessons from Yahoo, Google, Netflix and Meta How to get things done - Lessons from Yahoo, Google, Netflix and Meta
How to get things done - Lessons from Yahoo, Google, Netflix and Meta
Ido Green
 
Crypto 101 and a bit more [Sep-2022]
Crypto 101 and a bit more [Sep-2022]Crypto 101 and a bit more [Sep-2022]
Crypto 101 and a bit more [Sep-2022]
Ido Green
 
The Future of Continuous Software Updates Is Here
The Future of Continuous Software Updates Is HereThe Future of Continuous Software Updates Is Here
The Future of Continuous Software Updates Is Here
Ido Green
 
Open Source & DevOps Market trends - Open Core Summit
Open Source & DevOps Market trends - Open Core SummitOpen Source & DevOps Market trends - Open Core Summit
Open Source & DevOps Market trends - Open Core Summit
Ido Green
 
DevOps as a competitive advantage
DevOps as a competitive advantageDevOps as a competitive advantage
DevOps as a competitive advantage
Ido Green
 
Data Driven DevOps & Technologies (swampUP 2019 keynote)
Data Driven DevOps & Technologies (swampUP 2019 keynote)Data Driven DevOps & Technologies (swampUP 2019 keynote)
Data Driven DevOps & Technologies (swampUP 2019 keynote)
Ido Green
 
Create An Amazing Apps For The Google Assistant!
Create An Amazing Apps For The Google Assistant!Create An Amazing Apps For The Google Assistant!
Create An Amazing Apps For The Google Assistant!
Ido Green
 
VUI Design
VUI DesignVUI Design
VUI Design
Ido Green
 
Google Assistant - Why? How?
Google Assistant - Why? How?Google Assistant - Why? How?
Google Assistant - Why? How?
Ido Green
 
The Google Assistant - Macro View (October 2017)
The Google Assistant - Macro View (October 2017)The Google Assistant - Macro View (October 2017)
The Google Assistant - Macro View (October 2017)
Ido Green
 
Actions On Google - GDD Europe 2017
Actions On Google - GDD Europe 2017Actions On Google - GDD Europe 2017
Actions On Google - GDD Europe 2017
Ido Green
 
Building conversational experiences with Actions on Google
Building conversational experiences with Actions on GoogleBuilding conversational experiences with Actions on Google
Building conversational experiences with Actions on Google
Ido Green
 
Actions On Google - How? Why?
Actions On Google - How? Why?Actions On Google - How? Why?
Actions On Google - How? Why?
Ido Green
 
Startups Best Practices
Startups Best PracticesStartups Best Practices
Startups Best Practices
Ido Green
 
Earn More Revenue With Firebase and AdMob
Earn More Revenue With Firebase and AdMobEarn More Revenue With Firebase and AdMob
Earn More Revenue With Firebase and AdMob
Ido Green
 
How To Grow Your User Base?
How To Grow Your User Base?How To Grow Your User Base?
How To Grow Your User Base?
Ido Green
 
Google Innovation 101
Google Innovation 101Google Innovation 101
Google Innovation 101
Ido Green
 
סטארטאפ - איך? כמה? ולמה
סטארטאפ - איך? כמה? ולמהסטארטאפ - איך? כמה? ולמה
סטארטאפ - איך? כמה? ולמה
Ido Green
 
איך להתחיל סטארטאפ 2016
איך להתחיל סטארטאפ 2016איך להתחיל סטארטאפ 2016
איך להתחיל סטארטאפ 2016
Ido Green
 
Building a Progressive Web App
Building a  Progressive Web AppBuilding a  Progressive Web App
Building a Progressive Web App
Ido Green
 

More from Ido Green (20)

How to get things done - Lessons from Yahoo, Google, Netflix and Meta
How to get things done - Lessons from Yahoo, Google, Netflix and Meta How to get things done - Lessons from Yahoo, Google, Netflix and Meta
How to get things done - Lessons from Yahoo, Google, Netflix and Meta
 
Crypto 101 and a bit more [Sep-2022]
Crypto 101 and a bit more [Sep-2022]Crypto 101 and a bit more [Sep-2022]
Crypto 101 and a bit more [Sep-2022]
 
The Future of Continuous Software Updates Is Here
The Future of Continuous Software Updates Is HereThe Future of Continuous Software Updates Is Here
The Future of Continuous Software Updates Is Here
 
Open Source & DevOps Market trends - Open Core Summit
Open Source & DevOps Market trends - Open Core SummitOpen Source & DevOps Market trends - Open Core Summit
Open Source & DevOps Market trends - Open Core Summit
 
DevOps as a competitive advantage
DevOps as a competitive advantageDevOps as a competitive advantage
DevOps as a competitive advantage
 
Data Driven DevOps & Technologies (swampUP 2019 keynote)
Data Driven DevOps & Technologies (swampUP 2019 keynote)Data Driven DevOps & Technologies (swampUP 2019 keynote)
Data Driven DevOps & Technologies (swampUP 2019 keynote)
 
Create An Amazing Apps For The Google Assistant!
Create An Amazing Apps For The Google Assistant!Create An Amazing Apps For The Google Assistant!
Create An Amazing Apps For The Google Assistant!
 
VUI Design
VUI DesignVUI Design
VUI Design
 
Google Assistant - Why? How?
Google Assistant - Why? How?Google Assistant - Why? How?
Google Assistant - Why? How?
 
The Google Assistant - Macro View (October 2017)
The Google Assistant - Macro View (October 2017)The Google Assistant - Macro View (October 2017)
The Google Assistant - Macro View (October 2017)
 
Actions On Google - GDD Europe 2017
Actions On Google - GDD Europe 2017Actions On Google - GDD Europe 2017
Actions On Google - GDD Europe 2017
 
Building conversational experiences with Actions on Google
Building conversational experiences with Actions on GoogleBuilding conversational experiences with Actions on Google
Building conversational experiences with Actions on Google
 
Actions On Google - How? Why?
Actions On Google - How? Why?Actions On Google - How? Why?
Actions On Google - How? Why?
 
Startups Best Practices
Startups Best PracticesStartups Best Practices
Startups Best Practices
 
Earn More Revenue With Firebase and AdMob
Earn More Revenue With Firebase and AdMobEarn More Revenue With Firebase and AdMob
Earn More Revenue With Firebase and AdMob
 
How To Grow Your User Base?
How To Grow Your User Base?How To Grow Your User Base?
How To Grow Your User Base?
 
Google Innovation 101
Google Innovation 101Google Innovation 101
Google Innovation 101
 
סטארטאפ - איך? כמה? ולמה
סטארטאפ - איך? כמה? ולמהסטארטאפ - איך? כמה? ולמה
סטארטאפ - איך? כמה? ולמה
 
איך להתחיל סטארטאפ 2016
איך להתחיל סטארטאפ 2016איך להתחיל סטארטאפ 2016
איך להתחיל סטארטאפ 2016
 
Building a Progressive Web App
Building a  Progressive Web AppBuilding a  Progressive Web App
Building a Progressive Web App
 

Recently uploaded

Massey University degree offer diploma Transcript
Massey University degree offer diploma TranscriptMassey University degree offer diploma Transcript
Massey University degree offer diploma Transcript
ubufe
 
一比一原版(hull毕业证书)英国赫尔大学毕业证如何办理
一比一原版(hull毕业证书)英国赫尔大学毕业证如何办理一比一原版(hull毕业证书)英国赫尔大学毕业证如何办理
一比一原版(hull毕业证书)英国赫尔大学毕业证如何办理
taqyea
 
一比一原版(greenwich毕业证书)英国格林威治大学毕业证如何办理
一比一原版(greenwich毕业证书)英国格林威治大学毕业证如何办理一比一原版(greenwich毕业证书)英国格林威治大学毕业证如何办理
一比一原版(greenwich毕业证书)英国格林威治大学毕业证如何办理
taqyea
 
一比一原版澳洲巴拉特大学毕业证(utas毕业证书)如何办理
一比一原版澳洲巴拉特大学毕业证(utas毕业证书)如何办理一比一原版澳洲巴拉特大学毕业证(utas毕业证书)如何办理
一比一原版澳洲巴拉特大学毕业证(utas毕业证书)如何办理
taqyea
 
Future Trends What's Next for UI UX Design on Websites
Future Trends What's Next for UI UX Design on WebsitesFuture Trends What's Next for UI UX Design on Websites
Future Trends What's Next for UI UX Design on Websites
Serva AppLabs
 
202254.com免费观看《长相思第二季》免费观看高清,长相思第二季线上看,《长相思第二季》最新电视剧在线观看,杨紫最新电视剧
202254.com免费观看《长相思第二季》免费观看高清,长相思第二季线上看,《长相思第二季》最新电视剧在线观看,杨紫最新电视剧202254.com免费观看《长相思第二季》免费观看高清,长相思第二季线上看,《长相思第二季》最新电视剧在线观看,杨紫最新电视剧
202254.com免费观看《长相思第二季》免费观看高清,长相思第二季线上看,《长相思第二季》最新电视剧在线观看,杨紫最新电视剧
ffg01100
 
How to Choose the Right UIUX Design Service for Optimal Customer Experience
How to Choose the Right UIUX Design Service for Optimal Customer ExperienceHow to Choose the Right UIUX Design Service for Optimal Customer Experience
How to Choose the Right UIUX Design Service for Optimal Customer Experience
Serva AppLabs
 
10th International Conference on Networks, Mobile Communications and Telema...
10th International Conference on Networks, Mobile Communications and   Telema...10th International Conference on Networks, Mobile Communications and   Telema...
10th International Conference on Networks, Mobile Communications and Telema...
ijp2p
 
Book dating , international dating phgra
Book dating , international dating phgraBook dating , international dating phgra
Book dating , international dating phgra
thomaskurtha9
 
Carrington degree offer diploma Transcript
Carrington degree offer diploma TranscriptCarrington degree offer diploma Transcript
Carrington degree offer diploma Transcript
ubufe
 
Jarren Duran Fuck EM T shirts Jarren Duran Fuck EM T shirts
Jarren Duran Fuck EM T shirts Jarren Duran Fuck EM T shirtsJarren Duran Fuck EM T shirts Jarren Duran Fuck EM T shirts
Jarren Duran Fuck EM T shirts Jarren Duran Fuck EM T shirts
exgf28
 
一比一原版(oregon毕业证书)俄勒冈大学毕业证如何办理
一比一原版(oregon毕业证书)俄勒冈大学毕业证如何办理一比一原版(oregon毕业证书)俄勒冈大学毕业证如何办理
一比一原版(oregon毕业证书)俄勒冈大学毕业证如何办理
taqyea
 
Bai-Tập-Tiếng-Anh-On-Tập-He lớp 1- lớp 5 hot nhất
Bai-Tập-Tiếng-Anh-On-Tập-He lớp 1- lớp 5  hot nhấtBai-Tập-Tiếng-Anh-On-Tập-He lớp 1- lớp 5  hot nhất
Bai-Tập-Tiếng-Anh-On-Tập-He lớp 1- lớp 5 hot nhất
Thiên Đường Tình Yêu
 
一比一原版(uom毕业证)曼彻斯特大学毕业证如何办理
一比一原版(uom毕业证)曼彻斯特大学毕业证如何办理一比一原版(uom毕业证)曼彻斯特大学毕业证如何办理
一比一原版(uom毕业证)曼彻斯特大学毕业证如何办理
taqyea
 
一比一原版(爱大毕业证书)爱丁堡大学毕业证如何办理
一比一原版(爱大毕业证书)爱丁堡大学毕业证如何办理一比一原版(爱大毕业证书)爱丁堡大学毕业证如何办理
一比一原版(爱大毕业证书)爱丁堡大学毕业证如何办理
taqyea
 
cyber-security-training-presentation-q320.ppt
cyber-security-training-presentation-q320.pptcyber-security-training-presentation-q320.ppt
cyber-security-training-presentation-q320.ppt
LiamOConnor52
 
Megalive99 Situs Betting Online Gacor Terpercaya
Megalive99 Situs Betting Online Gacor TerpercayaMegalive99 Situs Betting Online Gacor Terpercaya
Megalive99 Situs Betting Online Gacor Terpercaya
Megalive99
 
一比一原版(ucb毕业证书)英国伯明翰大学学院毕业证如何办理
一比一原版(ucb毕业证书)英国伯明翰大学学院毕业证如何办理一比一原版(ucb毕业证书)英国伯明翰大学学院毕业证如何办理
一比一原版(ucb毕业证书)英国伯明翰大学学院毕业证如何办理
taqyea
 
SlideEgg_200767-ICC Mens T20 World Cup 2024.pptx
SlideEgg_200767-ICC Mens T20 World Cup 2024.pptxSlideEgg_200767-ICC Mens T20 World Cup 2024.pptx
SlideEgg_200767-ICC Mens T20 World Cup 2024.pptx
NandakumarP24
 
Corporate Minimal Newspaper Headline Style Newsletter.pptx
Corporate Minimal Newspaper Headline Style Newsletter.pptxCorporate Minimal Newspaper Headline Style Newsletter.pptx
Corporate Minimal Newspaper Headline Style Newsletter.pptx
byubyu7
 

Recently uploaded (20)

Massey University degree offer diploma Transcript
Massey University degree offer diploma TranscriptMassey University degree offer diploma Transcript
Massey University degree offer diploma Transcript
 
一比一原版(hull毕业证书)英国赫尔大学毕业证如何办理
一比一原版(hull毕业证书)英国赫尔大学毕业证如何办理一比一原版(hull毕业证书)英国赫尔大学毕业证如何办理
一比一原版(hull毕业证书)英国赫尔大学毕业证如何办理
 
一比一原版(greenwich毕业证书)英国格林威治大学毕业证如何办理
一比一原版(greenwich毕业证书)英国格林威治大学毕业证如何办理一比一原版(greenwich毕业证书)英国格林威治大学毕业证如何办理
一比一原版(greenwich毕业证书)英国格林威治大学毕业证如何办理
 
一比一原版澳洲巴拉特大学毕业证(utas毕业证书)如何办理
一比一原版澳洲巴拉特大学毕业证(utas毕业证书)如何办理一比一原版澳洲巴拉特大学毕业证(utas毕业证书)如何办理
一比一原版澳洲巴拉特大学毕业证(utas毕业证书)如何办理
 
Future Trends What's Next for UI UX Design on Websites
Future Trends What's Next for UI UX Design on WebsitesFuture Trends What's Next for UI UX Design on Websites
Future Trends What's Next for UI UX Design on Websites
 
202254.com免费观看《长相思第二季》免费观看高清,长相思第二季线上看,《长相思第二季》最新电视剧在线观看,杨紫最新电视剧
202254.com免费观看《长相思第二季》免费观看高清,长相思第二季线上看,《长相思第二季》最新电视剧在线观看,杨紫最新电视剧202254.com免费观看《长相思第二季》免费观看高清,长相思第二季线上看,《长相思第二季》最新电视剧在线观看,杨紫最新电视剧
202254.com免费观看《长相思第二季》免费观看高清,长相思第二季线上看,《长相思第二季》最新电视剧在线观看,杨紫最新电视剧
 
How to Choose the Right UIUX Design Service for Optimal Customer Experience
How to Choose the Right UIUX Design Service for Optimal Customer ExperienceHow to Choose the Right UIUX Design Service for Optimal Customer Experience
How to Choose the Right UIUX Design Service for Optimal Customer Experience
 
10th International Conference on Networks, Mobile Communications and Telema...
10th International Conference on Networks, Mobile Communications and   Telema...10th International Conference on Networks, Mobile Communications and   Telema...
10th International Conference on Networks, Mobile Communications and Telema...
 
Book dating , international dating phgra
Book dating , international dating phgraBook dating , international dating phgra
Book dating , international dating phgra
 
Carrington degree offer diploma Transcript
Carrington degree offer diploma TranscriptCarrington degree offer diploma Transcript
Carrington degree offer diploma Transcript
 
Jarren Duran Fuck EM T shirts Jarren Duran Fuck EM T shirts
Jarren Duran Fuck EM T shirts Jarren Duran Fuck EM T shirtsJarren Duran Fuck EM T shirts Jarren Duran Fuck EM T shirts
Jarren Duran Fuck EM T shirts Jarren Duran Fuck EM T shirts
 
一比一原版(oregon毕业证书)俄勒冈大学毕业证如何办理
一比一原版(oregon毕业证书)俄勒冈大学毕业证如何办理一比一原版(oregon毕业证书)俄勒冈大学毕业证如何办理
一比一原版(oregon毕业证书)俄勒冈大学毕业证如何办理
 
Bai-Tập-Tiếng-Anh-On-Tập-He lớp 1- lớp 5 hot nhất
Bai-Tập-Tiếng-Anh-On-Tập-He lớp 1- lớp 5  hot nhấtBai-Tập-Tiếng-Anh-On-Tập-He lớp 1- lớp 5  hot nhất
Bai-Tập-Tiếng-Anh-On-Tập-He lớp 1- lớp 5 hot nhất
 
一比一原版(uom毕业证)曼彻斯特大学毕业证如何办理
一比一原版(uom毕业证)曼彻斯特大学毕业证如何办理一比一原版(uom毕业证)曼彻斯特大学毕业证如何办理
一比一原版(uom毕业证)曼彻斯特大学毕业证如何办理
 
一比一原版(爱大毕业证书)爱丁堡大学毕业证如何办理
一比一原版(爱大毕业证书)爱丁堡大学毕业证如何办理一比一原版(爱大毕业证书)爱丁堡大学毕业证如何办理
一比一原版(爱大毕业证书)爱丁堡大学毕业证如何办理
 
cyber-security-training-presentation-q320.ppt
cyber-security-training-presentation-q320.pptcyber-security-training-presentation-q320.ppt
cyber-security-training-presentation-q320.ppt
 
Megalive99 Situs Betting Online Gacor Terpercaya
Megalive99 Situs Betting Online Gacor TerpercayaMegalive99 Situs Betting Online Gacor Terpercaya
Megalive99 Situs Betting Online Gacor Terpercaya
 
一比一原版(ucb毕业证书)英国伯明翰大学学院毕业证如何办理
一比一原版(ucb毕业证书)英国伯明翰大学学院毕业证如何办理一比一原版(ucb毕业证书)英国伯明翰大学学院毕业证如何办理
一比一原版(ucb毕业证书)英国伯明翰大学学院毕业证如何办理
 
SlideEgg_200767-ICC Mens T20 World Cup 2024.pptx
SlideEgg_200767-ICC Mens T20 World Cup 2024.pptxSlideEgg_200767-ICC Mens T20 World Cup 2024.pptx
SlideEgg_200767-ICC Mens T20 World Cup 2024.pptx
 
Corporate Minimal Newspaper Headline Style Newsletter.pptx
Corporate Minimal Newspaper Headline Style Newsletter.pptxCorporate Minimal Newspaper Headline Style Newsletter.pptx
Corporate Minimal Newspaper Headline Style Newsletter.pptx
 

Amp Overview #YGLF 2016

  • 1. AMP
  • 3. With the shift to mobile, the way we consume content has changed
  • 4. 9:34 AM contentbazaar.co/20160314/pi-way 9:34 AM contentbazaar.co/20160314/pi-way Lorem ipsum dolor sit amet, consectetur adipiscing elit, sed do eiusmod tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam, quis nostrud exercitation ullamco 9:34 AM contentbazaar.co/20160314/pi-way Slow Loading Non-Responsive Content Content Shifting
  • 5. It sometimes seems like we’ve just given in.
  • 6. Data from: Reuters Institute - Digital News Report http://www.digitalnewsreport.org/survey/2015/executive-summary-and-key-findings-2015/ 2015 2014 2013 2012 Smartphone news use 60% 40% 20% 0% GermanyJapan France UK US Denmark NA
  • 7. State of the News Media 2015, Pew Research Center http://www.journalism.org/2015/04/29/state-of-the-news-media-2015/ 78% of top news sites and apps (2015) Mobile > Desktop Visitors
  • 8. 20% of top news sites and apps (2015) Mobile > Desktop Time Spent Per Visit State of the News Media 2015, Pew Research Center http://www.journalism.org/2015/04/29/state-of-the-news-media-2015/
  • 10. 40% of people abandon a website that takes more than 3 seconds to load https://blog.kissmetrics.com/loading-time
  • 11. ● How to build experiences that will be fast and engaging while monetizing well? ● How to operate in a world where the discovery of content is increasingly happening off-site?
  • 12. Accelerated Mobile Pages Project Introducing ...
  • 13. Demo: AMP on Google Search driving content discovery In late February, Google launched AMP articles in “Top stories” in Google Search Try it now on google.com (in your phone’s browser)
  • 15. Goals for the AMP Project Make pages fast Be easy to implement Embrace the open web Enable monetization
  • 18. AMP pages = web pages: ● AMP-HTML + CSS ● No one-off JavaScript ● Instead: custom elements ● Sandboxed amp-iframes can contain anything AMP open-source JS library: ● Same everywhere ⇒ highly cacheable ● Defines behaviors for custom elements ● Manages rendering and resource loading to optimize performance
  • 19. AMP pages = web pages: ● AMP-HTML + CSS ● No one-off JavaScript ● Instead: custom elements ● Sandboxed amp-iframes can contain anything AMP open-source JS library: ● Same everywhere ⇒ highly cacheable ● Defines behaviors for custom elements ● Manages rendering and resource loading to optimize performance “AMP”
  • 20. What is AMP? HTML5 (AMP-HTML) JavaScript (AMP JS Library) CSS3 (Custom styling) Caching (AMP Cache)
  • 21. What is AMP? HTML5 (AMP-HTML) JavaScript (AMP JS Library) CSS3 (Custom styling) Caching (AMP Cache) Validation (AMP Validator)
  • 22. AMP Publishing Flow AMP-HTML HTML AMP Cache CMS Ad revenue and analytics Publishers depicted are examples for illustrative purposes Platforms depicted are examples for illustrative purposes Link Tags
  • 23. Three Sources of Speed AMP-HTML HTML AMP Cache CMS Ad revenue and analytics CachingAMP-HTML Format Prerendering Link Tags
  • 24. S P E E D S O U R C E # 1 AMP-HTML Format
  • 25. Average Mobile Site Image: https://en.wikipedia.org/wiki/Auto_racing#/media/File:Three-wide_multiple_row_back.JPG
  • 26. Hand-Tuned Site Average Mobile Site Image: https://en.wikipedia.org/wiki/Auto_racing#/media/File:Three-wide_multiple_row_back.JPG
  • 27. Hand-Tuned Site Average Mobile Site Image: https://en.wikipedia.org/wiki/Auto_racing#/media/File:Three-wide_multiple_row_back.JPG AMP
  • 28. Hand-Tuned Site Average Mobile Site Image: https://en.wikipedia.org/wiki/Auto_racing#/media/File:Three-wide_multiple_row_back.JPG All AMPs
  • 29. ● Smart content prioritization ✓ Prefetching the elements ✓ No relayout ✓ Asynchronous load ● Responsive design baked in ✓ Always get the best image for your screen (full srcset support) ● Limited by design ✓ No custom JavaScript except in amp-iframe ✓ No scrolling elements on the page ✓ Max 50KB inline stylesheet AMP Format: Elevated Performance Baseline for All
  • 30. Image: https://en.wikipedia.org/wiki/Auto_racing#/media/File:Three-wide_multiple_row_back.JPG 10x4x Less DataFaster Data furnished by Google. 0101010110010011 1001010010100110 AMP Format: Elevated Performance Baseline for All
  • 31. S P E E D S O U R C E # 2 Caching
  • 32. Local copy of assets Without an AMP cache With an AMP cache Web server Web server Edge server Edge server Edge server Edge server Edge server Edge server Edge server Caching Brings Content Physically Closer to Users
  • 33. S P E E D S O U R C E # 3 Prerendering
  • 34. Header Logo Responsive hero image Headline Article text Image in article Some more text Ad Optimizations include: ● Only the first viewport is prerendered — because AMP knows where each page element is positioned ● No 3rd party JavaScript is executed at this stage “Above the Fold” Prerendered “Below the Fold” Not Prerendered Prerendering by Platforms Can Make Loading Instant
  • 35. Three Sources of Speed AMP-HTML HTML AMP Cache CMS Ad revenue and analytics Caching Prerendering Link Tags AMP-HTML Format
  • 36. 20 Minutes 20 Minutos ABC AS BBC Abendzeitung ANSA Bento Berliner Morgenpost BILD Blasting News Blogo.it CCM Benchmark Charente Libre.fr Conde Nast Corriere della Sera DailyMail.com / MailOnline Daily Star The Week El Confidencial El Español El Mundo El Mundo Deportivo EL PAÍS El Periódico El Economista Europa Press Evening Standard Expansión Daily Express Frankfurter Allgemeine Zeitung FOCUS Online France 24 Francetvinfo Golem.de Gruner + Jahr Guardian News & Media HNA.de IBT UK Il Fatto Quotidiano IlSole24Ore IlSussidiario.net Ippen Digital Plattform kicker La République des Pyrénées La Stampa La Vanguardia Lagardère Active Le Parisien Les Echos L'Express Mail.Ru Group Marca Meduza merkur.de Metro UK Metronews OK! Ouest France Promiflash Público Repubblica RP Online RT RTL Russmedia Digital Sorrisi e Canzoni SPIEGEL ONLINE Sport SPORT1 Stuttgarter Zeitung Süddeutsche Zeitung SudOuest.fr t-online.de tagesschau TF1 The Financial Times The Independent Trinity Mirror tz.de Vocento Welt.de ZEIT ONLINE Вести.Ru Информационное агентство России ТАСС Лента.ру Московский Комсомолец Телекомпания НТВ Europe Asia Ameba.com Asahi Shimbun Bintang.com BLOGOS Bloter Bola.com Oneindia Business Standard CINEMATODAY Digital Chosun Eiga.com FirstPost Hankyung.com Indiatoday.in JoongAng Ilbo KapanLagi Network KASKUS Kompas.com Liputan6.com Maekyung.com Mainichi Shimbun Mynavi News NDTV Newstapa Nikkan Sports Republika.co.id Response Sankei News SANSPO Slow News THE PAGE Tempo.co Economic Times Uzone.id Yonhap News ZAKZAK North America ABC News The Atlantic Business Insider Buzzfeed CNN Digital Trends E! News Entrepreneur Forbes Fusion Hearst Heavy The Huffington Post IBT Media The Inquisitr News Los Angeles Times MarketWatch Mic MSNBC New York Daily News The Next Web The New York Post The New York Times POPSUGAR. SB Nation theScore Time Inc. Tribune Media USA Today The Verge Vox Wall Street Journal Washington Post Latin America Agência Brasil Basket4us.com Cybercook Diário 24 Horas EBC Economiahoy.mx El Universal Época ESPN Brasil Estadão Exame.com Excelsior Folha de S. Paulo Galileu Globo Grupo Expansion Grupo Imagen Grupo Medios Grupo RBS Jornal Extra M de Mulher MaisEquilibrio O Globo Portal Catraca Livre R7.com Radioagência Nacional Tecmundo Televisa Terra Terra Mexico TV Azteca UOL Vanguardia Veja São Paulo Veja.com Vila Mulher Publishers Supporting AMP (A Growing List!)
  • 37. Apps & Platforms Supporting AMP (Also A Growing List!) Google Search Google News Google News & Weather
  • 38. 7300+ 1900+PULL REQUESTSDEVELOPERS HAVE ENGAGED 88RELEASES Fantastic momentum and engagement for AMP Project Source: github.com/ampproject/amphtml. Data as of May 12, 2016
  • 39. Ads Content Access FormatAnalytics Focus Areas Publishers Vendors Platforms Collaborators
  • 40. Analytics in AMP ● <amp-analytics> custom element ● Highly configurable analytics framework ■ Event triggers: Page visible, click, scroll, timer ■ AMP library–provided data values: Client ID, page and content info, device and browser info, performance, and more ● Instrumentation managed by AMP means performance stays in check: “Measure once, report to many” ● Easy vendor config from 10+ vendors (and more welcome)
  • 41. Ads in AMP ● <amp-ad> custom element ● Integration with existing ad trafficking workflows ● Support for most common formats: standard banner ads, HTML5 ads, native ads, ads that resize on user interaction ● No restrictions on ad density ● Viewability support ● Integration with dozens of 3rd party providers: demand sources, sponsored content, data management platforms
  • 42. Content Access in AMP ● <amp-access> custom element ● Support for metering and subscriber sign-in ● Client-side content hiding ● Publisher uses their own business logic to make access decision ● Publisher can track (count) accesses ● Integration with amp-analytics
  • 43. Join the AMP initiative 1 EXPLORE ampproject.org/docs to learn more and read documentation github.com/ampproject/amphtml to connect with the development team 2 DEVELOP & TEST Start developing AMP files and validate them 3 LAUNCH Point to AMP files from canonical articles to make them discoverable and eligible to appear in content platforms 1 2 3
  • 44. Format Innovation in AMP ● Out of the box image carousel and lightbox ● Menu for site navigation (amp-sidebar) ● Tighter Progressive Web App (PWA) integration (amp-install-serviceworker) ● Templating for dynamic data loading (amp-list) ● Expand/collapse sections (amp-accordion) ● 15+ supported vendor extensions (audio, video, social, etc)
  • 45. Q & A