SlideShare a Scribd company logo

How Google's AMP pages are displayed and navigated

•
•
P
Peter Knight

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.

Internet
1 of 9
How Google’s new Accelerated Mobile Pages (AMP) are displayed and navigated. Produced by EdenStudios
1. Top Stories AMP pages are displayed as Top stories at the top of the search results* 2. The Amp card carousel Each story is displayed within a card - a small white panel enclosing the individual story components. * When there are not enough stories to warrant a carousel, AMP articles are displayed within the normal search results. 1 2 How AMP pages are displayed
1 Amp Card components Each AMP card consists of the following: 1. Publisher logo 2. Lead image 3. Story title 4. The new AMP icon 5. Time published 4 Componenets of an AMP card 2 3 5
Next Users can swipe through the articles in the carousel results or click into an AMP page.. Carousel When a search topic results in a few results, Amp stories are dis- played within cards and a horizontally scrolling carousel. The AMP card carousel
A fundamental change to how Google AMP pages differ to ‘normal’ search results. Reading AMP stories
Clicking a ‘normal’ Google result Web page is hosted on publishers’ own domain and served from publishers’ hosting. Clicking a search result sends a visitor to the publishers’ own web page Page title 1 http://www.website.domain.not/result... Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque consectetur lectus eget... Page title 3 http://www.website.domain.not/result... Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque consectetur lectus eget... Page title 2 http://www.website.domain.not/result... Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque consectetur lectus eget...
Clicking a Google AMP search result The AMP page is served from on a Google CDN. Clicking a search result sends visitors to a Google page Page title 1 http://www.website.domain.not/result... Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque consectetur lectus eget... Page title 3 http://www.website.domain.not/result... Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque consectetur lectus eget... Page title 2 http://www.website.domain.not/result... Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque consectetur lectus eget... 1 2 1. Address Bar Reads as Google URL 2. Navigation Each story from the results is immediately accessible by swiping left/right.
Instantly available While reading an AMP page, other search results are pre-loaded and appear instananteous when called. Accessing other AMP pages Swipe Navigate through articles without going back to the search results.
+353 086 823 3456 peter@edenstudios.com www.edenstudios.com Peter Knight Freelance Web & Graphic Designer

Recommended

What Are Accelerated Mobile Pages (AMPs)?
What Are Accelerated Mobile Pages (AMPs)?What Are Accelerated Mobile Pages (AMPs)?
What Are Accelerated Mobile Pages (AMPs)?MatchCraft
 
AMPed SEO with Mike Arnesen & SEMpdx
AMPed SEO with Mike Arnesen & SEMpdxAMPed SEO with Mike Arnesen & SEMpdx
AMPed SEO with Mike Arnesen & SEMpdxMike Arnesen
 
AMP - Accelerated Mobile Pages
AMP - Accelerated Mobile PagesAMP - Accelerated Mobile Pages
AMP - Accelerated Mobile PagesIdo Green
 
AMP Accelerated Mobile Pages - Getting Started & Analytics
AMP Accelerated Mobile Pages - Getting Started & AnalyticsAMP Accelerated Mobile Pages - Getting Started & Analytics
AMP Accelerated Mobile Pages - Getting Started & AnalyticsVincent Koc
 
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 (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 BusinessHarshavardhan MP
 
AMP and PWA
AMP and PWAAMP and PWA
AMP and PWAEun Cho
 
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 DevelopmentNotifyVisitors
 

Recommended

What Are Accelerated Mobile Pages (AMPs)?
What Are Accelerated Mobile Pages (AMPs)?What Are Accelerated Mobile Pages (AMPs)?
What Are Accelerated Mobile Pages (AMPs)?MatchCraft
 
AMPed SEO with Mike Arnesen & SEMpdx
AMPed SEO with Mike Arnesen & SEMpdxAMPed SEO with Mike Arnesen & SEMpdx
AMPed SEO with Mike Arnesen & SEMpdxMike Arnesen
 
AMP - Accelerated Mobile Pages
AMP - Accelerated Mobile PagesAMP - Accelerated Mobile Pages
AMP - Accelerated Mobile PagesIdo Green
 
AMP Accelerated Mobile Pages - Getting Started & Analytics
AMP Accelerated Mobile Pages - Getting Started & AnalyticsAMP Accelerated Mobile Pages - Getting Started & Analytics
AMP Accelerated Mobile Pages - Getting Started & AnalyticsVincent Koc
 
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 (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 BusinessHarshavardhan MP
 
AMP and PWA
AMP and PWAAMP and PWA
AMP and PWAEun Cho
 
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 DevelopmentNotifyVisitors
 
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 2016Jesse Semchuck
 
Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)Chitpong Wuttanan
 
Accelerated Mobile Pages
Accelerated Mobile PagesAccelerated Mobile Pages
Accelerated Mobile PagesJeremy Green
 
Accelerated Mobile Pages - WordCamp Kansas City
Accelerated Mobile Pages - WordCamp Kansas CityAccelerated Mobile Pages - WordCamp Kansas City
Accelerated Mobile Pages - WordCamp Kansas CityJeremy Green
 
Get AMP'ed for Accelerated Mobile Pages - SEO Grail Philadelphia 1/20/16
Get AMP'ed for Accelerated Mobile Pages - SEO Grail Philadelphia 1/20/16Get AMP'ed for Accelerated Mobile Pages - SEO Grail Philadelphia 1/20/16
Get AMP'ed for Accelerated Mobile Pages - SEO Grail Philadelphia 1/20/16Sean Malseed
 
Accelerated Mobile Pages (AMP)
Accelerated Mobile Pages (AMP)Accelerated Mobile Pages (AMP)
Accelerated Mobile Pages (AMP)Chris Burgess
 
Amp Overview #YGLF 2016
Amp Overview #YGLF 2016Amp Overview #YGLF 2016
Amp Overview #YGLF 2016Ido Green
 
Amp up your Site with Accelerated Mobile Pages
Amp up your Site with Accelerated Mobile PagesAmp up your Site with Accelerated Mobile Pages
Amp up your Site with Accelerated Mobile PagesBrian McKeiver
 
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 ServicesBrian McKeiver
 
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 pagesRobert McFrazier
 
AMP K.S.
AMP K.S.AMP K.S.
AMP K.S.Jacob Lial
 
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 groupMichael Posso
 
AMP up Your WordPress Site
AMP up Your WordPress SiteAMP up Your WordPress Site
AMP up Your WordPress SitePrem Tiwari
 
Accelerated mobile pages - AuroIN
Accelerated mobile pages - AuroINAccelerated mobile pages - AuroIN
Accelerated mobile pages - AuroINAuroIN
 
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
 
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 pagesRobert McFrazier
 
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 2019Benni Mack
 
Users web experience with AMP | Improve exploratory web experience
Users web experience with AMP | Improve exploratory web experienceUsers web experience with AMP | Improve exploratory web experience
Users web experience with AMP | Improve exploratory web experienceManish Kumar Sharma
 
Digital marketing companies
Digital marketing companiesDigital marketing companies
Digital marketing companiesvohi sharma
 
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 AnalyticsVivek Patel
 
Accelerated Mobile Pages (AMP) in Magento
Accelerated Mobile Pages (AMP) in MagentoAccelerated Mobile Pages (AMP) in Magento
Accelerated Mobile Pages (AMP) in MagentoMagecom UK Limited
 
Optimising AMP (Accelerated Mobile Pages) #SMXLondon
Optimising AMP (Accelerated Mobile Pages) #SMXLondonOptimising AMP (Accelerated Mobile Pages) #SMXLondon
Optimising AMP (Accelerated Mobile Pages) #SMXLondonAleyda Solís
 

More Related Content

What's hot

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 2016Jesse Semchuck
 
Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)Chitpong Wuttanan
 
Accelerated Mobile Pages
Accelerated Mobile PagesAccelerated Mobile Pages
Accelerated Mobile PagesJeremy Green
 
Accelerated Mobile Pages - WordCamp Kansas City
Accelerated Mobile Pages - WordCamp Kansas CityAccelerated Mobile Pages - WordCamp Kansas City
Accelerated Mobile Pages - WordCamp Kansas CityJeremy Green
 
Get AMP'ed for Accelerated Mobile Pages - SEO Grail Philadelphia 1/20/16
Get AMP'ed for Accelerated Mobile Pages - SEO Grail Philadelphia 1/20/16Get AMP'ed for Accelerated Mobile Pages - SEO Grail Philadelphia 1/20/16
Get AMP'ed for Accelerated Mobile Pages - SEO Grail Philadelphia 1/20/16Sean Malseed
 
Accelerated Mobile Pages (AMP)
Accelerated Mobile Pages (AMP)Accelerated Mobile Pages (AMP)
Accelerated Mobile Pages (AMP)Chris Burgess
 
Amp Overview #YGLF 2016
Amp Overview #YGLF 2016Amp Overview #YGLF 2016
Amp Overview #YGLF 2016Ido Green
 
Amp up your Site with Accelerated Mobile Pages
Amp up your Site with Accelerated Mobile PagesAmp up your Site with Accelerated Mobile Pages
Amp up your Site with Accelerated Mobile PagesBrian McKeiver
 
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 ServicesBrian McKeiver
 
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 pagesRobert McFrazier
 
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 groupMichael Posso
 
AMP up Your WordPress Site
AMP up Your WordPress SiteAMP up Your WordPress Site
AMP up Your WordPress SitePrem Tiwari
 
Accelerated mobile pages - AuroIN
Accelerated mobile pages - AuroINAccelerated mobile pages - AuroIN
Accelerated mobile pages - AuroINAuroIN
 
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
 
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 pagesRobert McFrazier
 
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 2019Benni Mack
 
Users web experience with AMP | Improve exploratory web experience
Users web experience with AMP | Improve exploratory web experienceUsers web experience with AMP | Improve exploratory web experience
Users web experience with AMP | Improve exploratory web experienceManish Kumar Sharma
 
Digital marketing companies
Digital marketing companiesDigital marketing companies
Digital marketing companiesvohi sharma
 

What's hot (19)

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 AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)Google AMP (Accelerated Mobile Pages)
Google AMP (Accelerated Mobile Pages)
 
Accelerated Mobile Pages
Accelerated Mobile PagesAccelerated Mobile Pages
Accelerated Mobile Pages
 
Accelerated Mobile Pages - WordCamp Kansas City
Accelerated Mobile Pages - WordCamp Kansas CityAccelerated Mobile Pages - WordCamp Kansas City
Accelerated Mobile Pages - WordCamp Kansas City
 
Get AMP'ed for Accelerated Mobile Pages - SEO Grail Philadelphia 1/20/16
Get AMP'ed for Accelerated Mobile Pages - SEO Grail Philadelphia 1/20/16Get AMP'ed for Accelerated Mobile Pages - SEO Grail Philadelphia 1/20/16
Get AMP'ed for Accelerated Mobile Pages - SEO Grail Philadelphia 1/20/16
 
Accelerated Mobile Pages (AMP)
Accelerated Mobile Pages (AMP)Accelerated Mobile Pages (AMP)
Accelerated Mobile Pages (AMP)
 
Amp Overview #YGLF 2016
Amp Overview #YGLF 2016Amp Overview #YGLF 2016
Amp Overview #YGLF 2016
 
Amp up your Site with Accelerated Mobile Pages
Amp up your Site with Accelerated Mobile PagesAmp up your Site with Accelerated Mobile Pages
Amp up your Site with Accelerated Mobile Pages
 
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 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 K.S.
AMP K.S.AMP K.S.
AMP K.S.
 
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 up Your WordPress Site
AMP up Your WordPress SiteAMP up Your WordPress Site
AMP up Your WordPress Site
 
Accelerated mobile pages - AuroIN
Accelerated mobile pages - AuroINAccelerated mobile pages - AuroIN
Accelerated mobile pages - AuroIN
 
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...
 
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
 
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
 
Users web experience with AMP | Improve exploratory web experience
Users web experience with AMP | Improve exploratory web experienceUsers web experience with AMP | Improve exploratory web experience
Users web experience with AMP | Improve exploratory web experience
 
Digital marketing companies
Digital marketing companiesDigital marketing companies
Digital marketing companies
 

Similar to How Google's AMP pages are displayed and navigated

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 AnalyticsVivek Patel
 
Accelerated Mobile Pages (AMP) in Magento
Accelerated Mobile Pages (AMP) in MagentoAccelerated Mobile Pages (AMP) in Magento
Accelerated Mobile Pages (AMP) in MagentoMagecom UK Limited
 
Optimising AMP (Accelerated Mobile Pages) #SMXLondon
Optimising AMP (Accelerated Mobile Pages) #SMXLondonOptimising AMP (Accelerated Mobile Pages) #SMXLondon
Optimising AMP (Accelerated Mobile Pages) #SMXLondonAleyda Solís
 
02.Branding and identity
02.Branding and identity02.Branding and identity
02.Branding and identityJulian Matthews
 
CSM Module 2: Branding and identity
CSM Module 2: Branding and identityCSM Module 2: Branding and identity
CSM Module 2: Branding and identityJulian Matthews
 
eCommerce SEO: a guide to on-site optimization
eCommerce SEO: a guide to on-site optimizationeCommerce SEO: a guide to on-site optimization
eCommerce SEO: a guide to on-site optimizationArnas Rackauskas
 
How to Create a Fan-Fueled Frenzy Online
How to Create a Fan-Fueled Frenzy OnlineHow to Create a Fan-Fueled Frenzy Online
How to Create a Fan-Fueled Frenzy OnlineMeteor Solutions
 
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 WebsiteWebwing Technologies
 
SEO Toolkit: Magento Extension by Amasty. User Guide.
SEO Toolkit: Magento Extension by Amasty. User Guide.SEO Toolkit: Magento Extension by Amasty. User Guide.
SEO Toolkit: Magento Extension by Amasty. User Guide.Amasty
 
Advanced Tips, Tricks, & Tools for Conquering AMP Problems Today By Paul Shapiro
Advanced Tips, Tricks, & Tools for Conquering AMP Problems Today By Paul ShapiroAdvanced Tips, Tricks, & Tools for Conquering AMP Problems Today By Paul Shapiro
Advanced Tips, Tricks, & Tools for Conquering AMP Problems Today By Paul ShapiroSearch Marketing Expo - SMX
 
The Lean Startup Engines of Growth with Google's Platforms
The Lean Startup Engines of Growth with Google's PlatformsThe Lean Startup Engines of Growth with Google's Platforms
The Lean Startup Engines of Growth with Google's PlatformsMark Masterson
 
STN Project documentation
STN Project documentationSTN Project documentation
STN Project documentationSaw Naing
 
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 websiteWebwing Technologies
 
Search Engine Optimisation
Search Engine OptimisationSearch Engine Optimisation
Search Engine OptimisationAndrew Armitage
 
Testing experience in web application P3 what should pay attention to
Testing experience in web application P3 what should pay attention toTesting experience in web application P3 what should pay attention to
Testing experience in web application P3 what should pay attention toVu Tran
 
Promo Banners User Guide
Promo Banners User GuidePromo Banners User Guide
Promo Banners User GuideAmasty
 
SEO site architecture best practices
SEO site architecture best practicesSEO site architecture best practices
SEO site architecture best practicesMM Rahman Bappi
 

Similar to How Google's AMP pages are displayed and navigated (20)

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
 
Accelerated Mobile Pages (AMP) in Magento
Accelerated Mobile Pages (AMP) in MagentoAccelerated Mobile Pages (AMP) in Magento
Accelerated Mobile Pages (AMP) in Magento
 
Optimising AMP (Accelerated Mobile Pages) #SMXLondon
Optimising AMP (Accelerated Mobile Pages) #SMXLondonOptimising AMP (Accelerated Mobile Pages) #SMXLondon
Optimising AMP (Accelerated Mobile Pages) #SMXLondon
 
02.Branding and identity
02.Branding and identity02.Branding and identity
02.Branding and identity
 
CSM Module 2: Branding and identity
CSM Module 2: Branding and identityCSM Module 2: Branding and identity
CSM Module 2: Branding and identity
 
Google optimizer
Google optimizerGoogle optimizer
Google optimizer
 
03.Advance search
03.Advance search03.Advance search
03.Advance search
 
eCommerce SEO: a guide to on-site optimization
eCommerce SEO: a guide to on-site optimizationeCommerce SEO: a guide to on-site optimization
eCommerce SEO: a guide to on-site optimization
 
How to Create a Fan-Fueled Frenzy Online
How to Create a Fan-Fueled Frenzy OnlineHow to Create a Fan-Fueled Frenzy Online
How to Create a Fan-Fueled Frenzy Online
 
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
 
Funnel 03 leads-gen04
Funnel 03 leads-gen04Funnel 03 leads-gen04
Funnel 03 leads-gen04
 
SEO Toolkit: Magento Extension by Amasty. User Guide.
SEO Toolkit: Magento Extension by Amasty. User Guide.SEO Toolkit: Magento Extension by Amasty. User Guide.
SEO Toolkit: Magento Extension by Amasty. User Guide.
 
Advanced Tips, Tricks, & Tools for Conquering AMP Problems Today By Paul Shapiro
Advanced Tips, Tricks, & Tools for Conquering AMP Problems Today By Paul ShapiroAdvanced Tips, Tricks, & Tools for Conquering AMP Problems Today By Paul Shapiro
Advanced Tips, Tricks, & Tools for Conquering AMP Problems Today By Paul Shapiro
 
The Lean Startup Engines of Growth with Google's Platforms
The Lean Startup Engines of Growth with Google's PlatformsThe Lean Startup Engines of Growth with Google's Platforms
The Lean Startup Engines of Growth with Google's Platforms
 
STN Project documentation
STN Project documentationSTN Project documentation
STN Project documentation
 
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
 
Search Engine Optimisation
Search Engine OptimisationSearch Engine Optimisation
Search Engine Optimisation
 
Testing experience in web application P3 what should pay attention to
Testing experience in web application P3 what should pay attention toTesting experience in web application P3 what should pay attention to
Testing experience in web application P3 what should pay attention to
 
Promo Banners User Guide
Promo Banners User GuidePromo Banners User Guide
Promo Banners User Guide
 
SEO site architecture best practices
SEO site architecture best practicesSEO site architecture best practices
SEO site architecture best practices
 

Recently uploaded

AlbaniaDreamin24 - How to easily use an API with Flows
AlbaniaDreamin24 - How to easily use an API with FlowsAlbaniaDreamin24 - How to easily use an API with Flows
AlbaniaDreamin24 - How to easily use an API with FlowsThierry TROUIN ☁
 
FULL ENJOY Call Girls In Mayur Vihar Delhi Contact Us 8377087607
FULL ENJOY Call Girls In Mayur Vihar Delhi Contact Us 8377087607FULL ENJOY Call Girls In Mayur Vihar Delhi Contact Us 8377087607
FULL ENJOY Call Girls In Mayur Vihar Delhi Contact Us 8377087607dollysharma2066
 
DDoS In Oceania and the Pacific, presented by Dave Phelan at NZNOG 2024
DDoS In Oceania and the Pacific, presented by Dave Phelan at NZNOG 2024DDoS In Oceania and the Pacific, presented by Dave Phelan at NZNOG 2024
DDoS In Oceania and the Pacific, presented by Dave Phelan at NZNOG 2024APNIC
 
GDG Cloud Southlake 32: Kyle Hettinger: Demystifying the Dark Web
GDG Cloud Southlake 32: Kyle Hettinger: Demystifying the Dark WebGDG Cloud Southlake 32: Kyle Hettinger: Demystifying the Dark Web
GDG Cloud Southlake 32: Kyle Hettinger: Demystifying the Dark WebJames Anderson
 
Low Rate Young Call Girls in Sector 63 Mamura Noida ✔️☆9289244007✔️☆ Female E...
Low Rate Young Call Girls in Sector 63 Mamura Noida ✔️☆9289244007✔️☆ Female E...Low Rate Young Call Girls in Sector 63 Mamura Noida ✔️☆9289244007✔️☆ Female E...
Low Rate Young Call Girls in Sector 63 Mamura Noida ✔️☆9289244007✔️☆ Female E...SofiyaSharma5
 
Russian Call girls in Dubai +971563133746 Dubai Call girls
Russian Call girls in Dubai +971563133746 Dubai Call girlsRussian Call girls in Dubai +971563133746 Dubai Call girls
Russian Call girls in Dubai +971563133746 Dubai Call girlsstephieert
 
How is AI changing journalism? (v. April 2024)
How is AI changing journalism? (v. April 2024)How is AI changing journalism? (v. April 2024)
How is AI changing journalism? (v. April 2024)Damian Radcliffe
 
Pune Airport ( Call Girls ) Pune 6297143586 Hot Model With Sexy Bhabi Ready...
Pune Airport ( Call Girls ) Pune 6297143586 Hot Model With Sexy Bhabi Ready...Pune Airport ( Call Girls ) Pune 6297143586 Hot Model With Sexy Bhabi Ready...
Pune Airport ( Call Girls ) Pune 6297143586 Hot Model With Sexy Bhabi Ready...tanu pandey
 
Chennai Call Girls Porur Phone 🍆 8250192130 👅 celebrity escorts service
Chennai Call Girls Porur Phone 🍆 8250192130 👅 celebrity escorts serviceChennai Call Girls Porur Phone 🍆 8250192130 👅 celebrity escorts service
Chennai Call Girls Porur Phone 🍆 8250192130 👅 celebrity escorts servicesonalikaur4
 
Russian Call girl in Ajman +971563133746 Ajman Call girl Service
Russian Call girl in Ajman +971563133746 Ajman Call girl ServiceRussian Call girl in Ajman +971563133746 Ajman Call girl Service
Russian Call girl in Ajman +971563133746 Ajman Call girl Servicegwenoracqe6
 
Radiant Call girls in Dubai O56338O268 Dubai Call girls
Radiant Call girls in Dubai O56338O268 Dubai Call girlsRadiant Call girls in Dubai O56338O268 Dubai Call girls
Radiant Call girls in Dubai O56338O268 Dubai Call girlsstephieert
 
Hot Service (+9316020077 ) Goa Call Girls Real Photos and Genuine Service
Hot Service (+9316020077 ) Goa Call Girls Real Photos and Genuine ServiceHot Service (+9316020077 ) Goa Call Girls Real Photos and Genuine Service
Hot Service (+9316020077 ) Goa Call Girls Real Photos and Genuine Servicesexy call girls service in goa
 
AWS Community DAY Albertini-Ellan Cloud Security (1).pptx
AWS Community DAY Albertini-Ellan Cloud Security (1).pptxAWS Community DAY Albertini-Ellan Cloud Security (1).pptx
AWS Community DAY Albertini-Ellan Cloud Security (1).pptxellan12
 
₹5.5k {Cash Payment}New Friends Colony Call Girls In [Delhi NIHARIKA] 🔝|97111...
₹5.5k {Cash Payment}New Friends Colony Call Girls In [Delhi NIHARIKA] 🔝|97111...₹5.5k {Cash Payment}New Friends Colony Call Girls In [Delhi NIHARIKA] 🔝|97111...
₹5.5k {Cash Payment}New Friends Colony Call Girls In [Delhi NIHARIKA] 🔝|97111...Diya Sharma
 
Enjoy Night⚡Call Girls Dlf City Phase 3 Gurgaon >༒8448380779 Escort Service
Enjoy Night⚡Call Girls Dlf City Phase 3 Gurgaon >༒8448380779 Escort ServiceEnjoy Night⚡Call Girls Dlf City Phase 3 Gurgaon >༒8448380779 Escort Service
Enjoy Night⚡Call Girls Dlf City Phase 3 Gurgaon >༒8448380779 Escort ServiceDelhi Call girls
 
horny (9316020077 ) Goa Call Girls Service by VIP Call Girls in Goa
horny (9316020077 ) Goa Call Girls Service by VIP Call Girls in Goahorny (9316020077 ) Goa Call Girls Service by VIP Call Girls in Goa
horny (9316020077 ) Goa Call Girls Service by VIP Call Girls in Goasexy call girls service in goa
 
VIP 7001035870 Find & Meet Hyderabad Call Girls LB Nagar high-profile Call Girl
VIP 7001035870 Find & Meet Hyderabad Call Girls LB Nagar high-profile Call GirlVIP 7001035870 Find & Meet Hyderabad Call Girls LB Nagar high-profile Call Girl
VIP 7001035870 Find & Meet Hyderabad Call Girls LB Nagar high-profile Call Girladitipandeya
 

Recently uploaded (20)

AlbaniaDreamin24 - How to easily use an API with Flows
AlbaniaDreamin24 - How to easily use an API with FlowsAlbaniaDreamin24 - How to easily use an API with Flows
AlbaniaDreamin24 - How to easily use an API with Flows
 
FULL ENJOY Call Girls In Mayur Vihar Delhi Contact Us 8377087607
FULL ENJOY Call Girls In Mayur Vihar Delhi Contact Us 8377087607FULL ENJOY Call Girls In Mayur Vihar Delhi Contact Us 8377087607
FULL ENJOY Call Girls In Mayur Vihar Delhi Contact Us 8377087607
 
DDoS In Oceania and the Pacific, presented by Dave Phelan at NZNOG 2024
DDoS In Oceania and the Pacific, presented by Dave Phelan at NZNOG 2024DDoS In Oceania and the Pacific, presented by Dave Phelan at NZNOG 2024
DDoS In Oceania and the Pacific, presented by Dave Phelan at NZNOG 2024
 
GDG Cloud Southlake 32: Kyle Hettinger: Demystifying the Dark Web
GDG Cloud Southlake 32: Kyle Hettinger: Demystifying the Dark WebGDG Cloud Southlake 32: Kyle Hettinger: Demystifying the Dark Web
GDG Cloud Southlake 32: Kyle Hettinger: Demystifying the Dark Web
 
Rohini Sector 22 Call Girls Delhi 9999965857 @Sabina Saikh No Advance
Rohini Sector 22 Call Girls Delhi 9999965857 @Sabina Saikh No AdvanceRohini Sector 22 Call Girls Delhi 9999965857 @Sabina Saikh No Advance
Rohini Sector 22 Call Girls Delhi 9999965857 @Sabina Saikh No Advance
 
Low Rate Young Call Girls in Sector 63 Mamura Noida ✔️☆9289244007✔️☆ Female E...
Low Rate Young Call Girls in Sector 63 Mamura Noida ✔️☆9289244007✔️☆ Female E...Low Rate Young Call Girls in Sector 63 Mamura Noida ✔️☆9289244007✔️☆ Female E...
Low Rate Young Call Girls in Sector 63 Mamura Noida ✔️☆9289244007✔️☆ Female E...
 
Russian Call girls in Dubai +971563133746 Dubai Call girls
Russian Call girls in Dubai +971563133746 Dubai Call girlsRussian Call girls in Dubai +971563133746 Dubai Call girls
Russian Call girls in Dubai +971563133746 Dubai Call girls
 
How is AI changing journalism? (v. April 2024)
How is AI changing journalism? (v. April 2024)How is AI changing journalism? (v. April 2024)
How is AI changing journalism? (v. April 2024)
 
Pune Airport ( Call Girls ) Pune 6297143586 Hot Model With Sexy Bhabi Ready...
Pune Airport ( Call Girls ) Pune 6297143586 Hot Model With Sexy Bhabi Ready...Pune Airport ( Call Girls ) Pune 6297143586 Hot Model With Sexy Bhabi Ready...
Pune Airport ( Call Girls ) Pune 6297143586 Hot Model With Sexy Bhabi Ready...
 
Chennai Call Girls Porur Phone 🍆 8250192130 👅 celebrity escorts service
Chennai Call Girls Porur Phone 🍆 8250192130 👅 celebrity escorts serviceChennai Call Girls Porur Phone 🍆 8250192130 👅 celebrity escorts service
Chennai Call Girls Porur Phone 🍆 8250192130 👅 celebrity escorts service
 
Russian Call girl in Ajman +971563133746 Ajman Call girl Service
Russian Call girl in Ajman +971563133746 Ajman Call girl ServiceRussian Call girl in Ajman +971563133746 Ajman Call girl Service
Russian Call girl in Ajman +971563133746 Ajman Call girl Service
 
Radiant Call girls in Dubai O56338O268 Dubai Call girls
Radiant Call girls in Dubai O56338O268 Dubai Call girlsRadiant Call girls in Dubai O56338O268 Dubai Call girls
Radiant Call girls in Dubai O56338O268 Dubai Call girls
 
Hot Service (+9316020077 ) Goa Call Girls Real Photos and Genuine Service
Hot Service (+9316020077 ) Goa Call Girls Real Photos and Genuine ServiceHot Service (+9316020077 ) Goa Call Girls Real Photos and Genuine Service
Hot Service (+9316020077 ) Goa Call Girls Real Photos and Genuine Service
 
AWS Community DAY Albertini-Ellan Cloud Security (1).pptx
AWS Community DAY Albertini-Ellan Cloud Security (1).pptxAWS Community DAY Albertini-Ellan Cloud Security (1).pptx
AWS Community DAY Albertini-Ellan Cloud Security (1).pptx
 
Rohini Sector 6 Call Girls Delhi 9999965857 @Sabina Saikh No Advance
Rohini Sector 6 Call Girls Delhi 9999965857 @Sabina Saikh No AdvanceRohini Sector 6 Call Girls Delhi 9999965857 @Sabina Saikh No Advance
Rohini Sector 6 Call Girls Delhi 9999965857 @Sabina Saikh No Advance
 
Rohini Sector 26 Call Girls Delhi 9999965857 @Sabina Saikh No Advance
Rohini Sector 26 Call Girls Delhi 9999965857 @Sabina Saikh No AdvanceRohini Sector 26 Call Girls Delhi 9999965857 @Sabina Saikh No Advance
Rohini Sector 26 Call Girls Delhi 9999965857 @Sabina Saikh No Advance
 
₹5.5k {Cash Payment}New Friends Colony Call Girls In [Delhi NIHARIKA] 🔝|97111...
₹5.5k {Cash Payment}New Friends Colony Call Girls In [Delhi NIHARIKA] 🔝|97111...₹5.5k {Cash Payment}New Friends Colony Call Girls In [Delhi NIHARIKA] 🔝|97111...
₹5.5k {Cash Payment}New Friends Colony Call Girls In [Delhi NIHARIKA] 🔝|97111...
 
Enjoy Night⚡Call Girls Dlf City Phase 3 Gurgaon >༒8448380779 Escort Service
Enjoy Night⚡Call Girls Dlf City Phase 3 Gurgaon >༒8448380779 Escort ServiceEnjoy Night⚡Call Girls Dlf City Phase 3 Gurgaon >༒8448380779 Escort Service
Enjoy Night⚡Call Girls Dlf City Phase 3 Gurgaon >༒8448380779 Escort Service
 
horny (9316020077 ) Goa Call Girls Service by VIP Call Girls in Goa
horny (9316020077 ) Goa Call Girls Service by VIP Call Girls in Goahorny (9316020077 ) Goa Call Girls Service by VIP Call Girls in Goa
horny (9316020077 ) Goa Call Girls Service by VIP Call Girls in Goa
 
VIP 7001035870 Find & Meet Hyderabad Call Girls LB Nagar high-profile Call Girl
VIP 7001035870 Find & Meet Hyderabad Call Girls LB Nagar high-profile Call GirlVIP 7001035870 Find & Meet Hyderabad Call Girls LB Nagar high-profile Call Girl
VIP 7001035870 Find & Meet Hyderabad Call Girls LB Nagar high-profile Call Girl
 

How Google's AMP pages are displayed and navigated

  • 1. How Google’s new Accelerated Mobile Pages (AMP) are displayed and navigated. Produced by EdenStudios
  • 2. 1. Top Stories AMP pages are displayed as Top stories at the top of the search results* 2. The Amp card carousel Each story is displayed within a card - a small white panel enclosing the individual story components. * When there are not enough stories to warrant a carousel, AMP articles are displayed within the normal search results. 1 2 How AMP pages are displayed
  • 3. 1 Amp Card components Each AMP card consists of the following: 1. Publisher logo 2. Lead image 3. Story title 4. The new AMP icon 5. Time published 4 Componenets of an AMP card 2 3 5
  • 4. Next Users can swipe through the articles in the carousel results or click into an AMP page.. Carousel When a search topic results in a few results, Amp stories are dis- played within cards and a horizontally scrolling carousel. The AMP card carousel
  • 5. A fundamental change to how Google AMP pages differ to ‘normal’ search results. Reading AMP stories
  • 6. Clicking a ‘normal’ Google result Web page is hosted on publishers’ own domain and served from publishers’ hosting. Clicking a search result sends a visitor to the publishers’ own web page Page title 1 http://www.website.domain.not/result... Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque consectetur lectus eget... Page title 3 http://www.website.domain.not/result... Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque consectetur lectus eget... Page title 2 http://www.website.domain.not/result... Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque consectetur lectus eget...
  • 7. Clicking a Google AMP search result The AMP page is served from on a Google CDN. Clicking a search result sends visitors to a Google page Page title 1 http://www.website.domain.not/result... Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque consectetur lectus eget... Page title 3 http://www.website.domain.not/result... Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque consectetur lectus eget... Page title 2 http://www.website.domain.not/result... Lorem ipsum dolor sit amet, consectetur adipiscing elit. Quisque consectetur lectus eget... 1 2 1. Address Bar Reads as Google URL 2. Navigation Each story from the results is immediately accessible by swiping left/right.
  • 8. Instantly available While reading an AMP page, other search results are pre-loaded and appear instananteous when called. Accessing other AMP pages Swipe Navigate through articles without going back to the search results.
  • 9. +353 086 823 3456 peter@edenstudios.com www.edenstudios.com Peter Knight Freelance Web & Graphic Designer