SlideShare une entreprise Scribd logo
1  sur  28
userADgents
ACCELERATED MOBILE PAGES
Comprendre la notion d’AMP, pour
des pages web plus rapides sur mobile
MOBILI


tea time
#13



userADgents
GUIDE PRATIQUE
DES INTERNAUTES ABANDONNENT
UN SITE LORSQUE LE CHARGEMENT
EXCÈDE 3 SECONDES !
53%
LE CHIFFRE
Source : DoubleClick by Google
DANS UN MONDE MOBILE FIRST,
OÙ IL Y A + DE MOBINAUTES QUE
D’INTERNAUTES, IL EST TEMPS D’OPTIMISER
LA LECTURE DES PAGES WEB SUR MOBILE !
LE CONSTAT
GOOGLE A DONC LANCÉ LE FORMAT ‘AMP’
QUI PERMET D’AFFICHER BEAUCOUP
PLUS RAPIDEMENT UNE PAGE WEB SUR MOBILE
UNE INITIATIVE OPEN SOURCE : AMP PROJECT
I

CONCRÈTEMENT, QU’EST CE QUE C’EST ?
COMMENT ÇA SE TRADUIT ?
Lors d’une requête sur Google sur terminal mobile,
les sites disposant de la pastille & mention AMP
figurent dans les résultats de recherche. 

Il est facile de swiper parmi le carrousel pour voir
tous les sites AMP abordant le sujet recherché.
Ce carrousel apparaît avant les résultats
traditionnels et est donc très visible.

Une fois sur le site souhaité, la page charge
instantanément (en moins de 2 secondes en
général) et il est facile de scroller sans attendre
que le contenu de la page charge.
Pour le moment ce type d’affichage « carrousel » n’est
appliqué que pour les sites d’actualités.
POUR QUELS SITES ?
Il s’agit aujourd’hui principalement de sites d’informations : actualités généralistes, actualités
sportives, technologiques.
AMP convient aux sites qui ont du contenu régulièrement mis à jour ou publié, des actualités
chaudes.
Depuis août 2016, Google a lancé AMP pour les sites e-commerce (uniquement pour les pages de
listing et les pages produit), cela devrait donc se développer.
À terme, tous les sites devraient avoir des pages en AMP pour améliorer l’expérience de lecture !
Ebay est le 1er site e-commerce à avoir développé l'AMP.Les sites d’actualités en AMP
L’internaute qui sélectionne
un contenu AMP n’est en
fait pas redirigé vers le site
à l’origine du contenu : la
lecture se fait directement
sur le domaine de Google !
HTML AMP TRÈS LIGHT PRIORISATION LECTURE AU SEIN DU
DOMAINE GOOGLE
Avec des pages AMP,
lorsqu’un contenu est
consulté depuis les
résultats de Google,
c’est sa version AMP qui
est systématiquement
appelée à la place de la
page HTML classique.
Il s’agit en fait de
pages HTML très
légères, auxquelles
s’ajoute le système
de cache CDN et
une réduction du
Javascript.
L’image principale et le
texte sont chargés en
premier, au lieu de la
publicité et des scripts en
temps normal.
COMMENT ÇA MARCHE ?
II

LES BÉNÉFICES DE L’AMP
4
fois 

+ rapides
10fois
- de données
PAR RAPPORT AUX PAGES NON AMP !
15à 

85%
de gain de vitesse 

d’affichage
UNE AUGMENTATION SIGNIFICATIVE 

DE VISIBILITÉ
EN CRÉANT DES ARTICLES AMP, LES ÉDITEURS / MARQUES VERRONT LEURS
CONTENUS, AUPARAVANT ISOLÉS SUR DES BLOGS, MIS EN AVANT DIRECTEMENT
SUR GOOGLE.
S’IMPOSER DANS LA GUERRE DU
RÉFÉRENCEMENT
GOOGLE A DEPUIS QUELQUES ANNÉES ANNONCÉ LA PRIORISATION DES SITES
MOBILE-FRIENDLY SUR SES SERPS.
EN TOUTE LOGIQUE, LE MOTEUR DE RECHERCHE ENTEND ÉGALEMENT MIEUX
RÉFÉRENCER LES SITES AMP !
UNE MEILLEURE EXPÉRIENCE

UTILISATEUR
UN CONFORT DE LECTURE EN TOUTE MOBILITÉ
ENTRAINANT DAVANTAGE DE CONTENUS CONSULTÉS
III

PARLONS TECHNIQUE
3 PARTIES COMPOSENT L’AMP :
ET TECHNIQUEMENT ?
Elle garantit un rendu
rapide des pages AMP
HTML. Et permet d’intégrer
dans des pages AMP des
composants dynamiques et
asynchrones tels que les
analytics, les frameworks de
publicités, et bientôt les
tunnels ecommerce.
Une déclinaison du
HTML comportant
certaines restrictions
pour assurer des
performances fiables,
ainsi que certaines
extensions permettant
de créer directement
du contenu riche sans
javascript ou CSS
complexe.
Il fournit les pages AMP
HTML sur un réseau CDN
ultra rapide permettant de
gagner en temps de
réponse sur des data-
center répartis sur le
monde entier.
LE AMP HTML LA BIBLIOTÈQUE AMP JS LE GOOGLE AMP CACHE
AMP HTML
ET TECHNIQUEMENT ?
Même si la plupart des balises sur une page
AMP HTML sont des balises HTML standard,
certaines sont remplacées par des balises
AMP spécifiques.
Ces éléments personnalisés, appelés
composants AMP HTML, permettent
d'implémenter facilement et efficacement
des modèles communs.
Exemple à droite, une publicité est composée
uniquement d’une balise <amp-ad> qui
permet d’afficher une bannière très
rapidement sur la page.
https://github.com/ampproject/amphtml/blob/master/spec/amp-html-format.md
AMP JS
ET TECHNIQUEMENT ?
La bibliothèque AMP JS comprend toutes les
meilleures pratiques d'AMP en termes d’efficacité. Elle
gère le chargement des ressources et contient les
balises personnalisées.
L'une des plus grandes optimisations est la
désynchronisation de tout ce qui provient de
ressources externes, de sorte que rien sur la page ne
bloque le rendu des différents éléments.
Toujours dans une logique de gain de performance, on
peut citer également le système de « sandbox » pour
tous les iframes, la pré-définition de la disposition de
chaque élément sur la page avant le chargement des
ressources et la désactivation des sélecteurs CSS lents.
AMP CACHE
ET TECHNIQUEMENT ?
Toujours afin d’optimiser la vitesse d’affichage Google fournit gratuitement un CDN « Content
Delivery Network » de type « proxy-cache » qui sauvegarde une version cache des pages AMP
afin d’améliorer la performance d’affichage.
Avec Google AMP Cache, tous les fichiers JS et toutes les images se chargent à partir d'une
source, laquelle utilise HTTP 2.0 pour une efficacité optimale.
Ce cache intègre également un système de validation qui vérifie le bon fonctionnement de la
page et sa non dépendance vis-à-vis de ressources externes.
Le lien des pages AMP est donc aujourd’hui un lien www.google.fr/amp
IV

LES COMPLEXITÉS DE L’AMP
NOUVELLE
VERSION DU SITE
ATTENTION
DUPLICATION
PUBLICITÉ
& AMP
ANALYTICS
& AMP
L’AMP est un projet
complexe qui nécessite
de développer une
nouvelle version du site.
Il faut veiller à ce
que le contenu ne
soit pas dupliqué
avec la version
mobile existante
(gestion des Urls
canoniques)
LES COMPLEXITÉS D’AMP
Certains réseaux
publicitaires ne sont
pas compatibles
AMP
Le tracking analytics
n’est pas aussi
complet qu’avec une
page HTML, même si
de nombreux outils
sont déjà
compatibles (Google
Analytics,
Comscore…)
AMP est un projet
récent dont on ne
connait pas encore les
évolutions ni la
pérennité. Il est
intéressant de mener ce
projet très prometteur
mais conserver son site
mobile en parallèle est
plus prudent.
VIABILITÉ
VOUS SOUHAITEZ ÊTRE ACCOMPAGNÉ DANS
VOTRE STRATÉGIE MOBILE FIRST / AMP ?
Rencontrons-nous !
userADgents est spécialisée dans la conception, le développement et la promotion de
sites et d’applications pour smartphones, tablettes et objets connectés.
userADgents
Nicolas Benoist
CTO
n.benoist@useradgents.com
Solange Derrey
Directrice du Pôle Trendwatchers
& de la Communication
s.derrey@useradgents.com
É T U D E R É A L I S É E P A R
T R E N D W A T C H E R S
Le pôle études digitales
et formations de userADgents
JE M’INSCRIS À LA NEWS
JE FOLLOW SUR TWITTER
Et pour ne rien manquer
des prochaines études !
www.useradgents.com
userADgents
RETROUVEZ NOS
AUTRES ÉTUDES
SUR
SLIDESHARE
ENVIE D’UNE
ÉTUDE
SUR-MESURE ?
DÉCOUVREZ 

NOTRE
CATALOGUE
DE FORMATIONS
INTÉRESSÉ PAR UNE
ÉTUDE SUR-MESURE
POUR VOTRE
ENTREPRISE ?
N’HÉSITEZ PAS À
CONSULTER NOTRE
CATALOGUE DE
FORMATIONS
VOIR NOS 20 FORMATIONSDÉCOUVRIR NOS OFFRESEN VOIR PLUS !
Digitalisation du point de vente,
smartwatches, smart home, Apple
TV… découvrez toutes nos études en
libre accès sur Slideshare !
Découvrez nos 3 offres d’études sur-
mesure : étude sectorielle, étude de
tendances et audit de marque.
A partir de 5000 € H.T, sur devis
Envie d’en savoir plus sur le mobile
et l’innovation ? 

Trouvez votre bonheur parmi nos
20 formations animées par des
experts du domaine.
A partir de 2000 € H.T
pour 1 à 15 personnes
USERADGENTS & JOSHFIRE
AGENCE DIGITALE
MOBILE FIRST USER CENTRIC
AGENCE CONSEIL
EN INNOVATION
userADgents est spécialisée dans la conception,
le développement et la promotion de sites et
d’applications pour smartphones, tablettes et
objets connectés.
Joshfire, une équipe de designers et
d’ingénieurs qui conçoivent de A à Z des
objets connectés et des expériences
interactives sur mesure.
userADgents
FABRIQUE 

DE DISPOSITIFS 

DIGITAUXINNOVANTS
COMPLÉMENTAIRES
DEUXAGENCES
Hier l’enjeu était de s’adapter au web mobile,
aujourd’hui & demain il sera d’embrasser ce
nouveau monde ultra connecté où terminaux
mobiles & objets communiquent. 
Notre complémentarité nous permet
d’imaginer des expériences transversales à
ces dispositifs et de répondre aux nouvelles
problématiques des marques.
1
ÈRE
1
FORMANTÀELLESDEUXLA:
USERADGENTS & JOSHFIRE
…DU CONSEIL À LA COMMERCIALISATION…
Analyse
comportementale
Ateliers d’idéation
Recherche de
concepts innovants
User journey
Ergonomie
Tests utilisateurs
Ateliers de co-création
Design des
interfaces
Design industriel
Objets connectés
Applications natives
(iOS/Android/Windows)
Responsive & Adaptive
Design
Back-end & APIs
Arduino / Raspberry Pi
Réalité virtuelle
Chat bots
Publicité mobile
Couponing
SMS/Push Notif
App Store
Optimization
Mobile-to-store
Interactions in-store
Beacons
Vidéo
Etudes fonctionnelles
Prototypages
Spécifications
Suivi d’industrialisation
& de production
Etude de tendances
Audit de marque
Benchmarks
Accompagnement
stratégique
Recherche &
Innovation
DESIGN
PROMOTION
CRM
UX / IDÉATION DÉVELOPPEMENT
PROTOTYPAGE &
INDUSTRIALISATION
CONSEIL
userADgents
SOYEZ UTILES

& COHÉRENTS
CULTIVEZ VOTRE
DIFFÉRENCE
Le digital et vos clients sont en
constante mouvance ! Nous aimons
faire bouger les choses et secouer les
esprits pour sortir des idées reçues et
se challenger constamment.
SENS
EFFERVESCENCE
ESSENCE
Dans un environnement de plus en plus
concurrentiel et un contexte de
surexposition des consommateurs,
chaque marque doit cultiver sa
différence et revendiquer son ADN et
ses valeurs.
Nous pensons que le digital ne doit pas
être gadget ! Nous voulons créer des
dispositifs qui ont du sens pour vos
clients.
OUVREZ GRAND 

LES YEUX
…ANIMÉES PAR UNE VISION COMMUNE !
MobiliTeaTime #13 : Accelerated Mobile Pages

Contenu connexe

Tendances

Les nouveaux enjeux de la distribution de contenu : Google AMP, Facebook Inst...
Les nouveaux enjeux de la distribution de contenu : Google AMP, Facebook Inst...Les nouveaux enjeux de la distribution de contenu : Google AMP, Facebook Inst...
Les nouveaux enjeux de la distribution de contenu : Google AMP, Facebook Inst...Virginie Clève - largow ☕️
 
Réussir son lancement mobile
Réussir son lancement mobileRéussir son lancement mobile
Réussir son lancement mobileJérémie Clévy
 
Promotion d'une appli mobile : ASO, social media, campagnes marketing,...
Promotion d'une appli mobile : ASO, social media, campagnes marketing,...Promotion d'une appli mobile : ASO, social media, campagnes marketing,...
Promotion d'une appli mobile : ASO, social media, campagnes marketing,...Virginie Clève - largow ☕️
 
Aso 101 : comment booster votre appli mobile sur les stores
Aso 101 : comment booster votre appli mobile sur les storesAso 101 : comment booster votre appli mobile sur les stores
Aso 101 : comment booster votre appli mobile sur les storesVirginie Clève - largow ☕️
 
Internet mobile en 2020 : Progressive web apps PWA et Google AMP
Internet mobile en 2020 : Progressive web apps PWA et Google AMPInternet mobile en 2020 : Progressive web apps PWA et Google AMP
Internet mobile en 2020 : Progressive web apps PWA et Google AMPVirginie Clève - largow ☕️
 
Actualité des moteurs de recherche et du référencement (SEO & SEA) - Petit-d...
Actualité des moteurs de recherche et du référencement (SEO & SEA)  - Petit-d...Actualité des moteurs de recherche et du référencement (SEO & SEA)  - Petit-d...
Actualité des moteurs de recherche et du référencement (SEO & SEA) - Petit-d...Peak Ace
 
Conseils pour être featuré sur les appstores
Conseils pour être featuré sur les appstoresConseils pour être featuré sur les appstores
Conseils pour être featuré sur les appstoresAlexandra Combeau
 
Le mobile first index - Petit déjeuner de Genève du 16 Mai
 Le mobile first index - Petit déjeuner de Genève du 16 Mai Le mobile first index - Petit déjeuner de Genève du 16 Mai
Le mobile first index - Petit déjeuner de Genève du 16 MaiPeak Ace
 
10 conseils pour réussir le lancement de votre application
10 conseils pour réussir le lancement de votre application10 conseils pour réussir le lancement de votre application
10 conseils pour réussir le lancement de votre applicationBeApp
 
Mobile et e-commerce 2017 : Google AMP, Mobile First Index
Mobile et e-commerce 2017 : Google AMP, Mobile First IndexMobile et e-commerce 2017 : Google AMP, Mobile First Index
Mobile et e-commerce 2017 : Google AMP, Mobile First IndexSandra BOYER
 
MobiliteaTime #4 : Guide Pratique Apple TV
MobiliteaTime #4 : Guide Pratique Apple TVMobiliteaTime #4 : Guide Pratique Apple TV
MobiliteaTime #4 : Guide Pratique Apple TVUSERADGENTS
 
Les chantiers indispensables à glisser dans votre roadmap 2018 - Petit-déjeun...
Les chantiers indispensables à glisser dans votre roadmap 2018 - Petit-déjeun...Les chantiers indispensables à glisser dans votre roadmap 2018 - Petit-déjeun...
Les chantiers indispensables à glisser dans votre roadmap 2018 - Petit-déjeun...Peak Ace
 
TUNISEO - 2018 - Le SEO à l'heure du Mobile First par Philippe Yonnet, Direct...
TUNISEO - 2018 - Le SEO à l'heure du Mobile First par Philippe Yonnet, Direct...TUNISEO - 2018 - Le SEO à l'heure du Mobile First par Philippe Yonnet, Direct...
TUNISEO - 2018 - Le SEO à l'heure du Mobile First par Philippe Yonnet, Direct...Peak Ace
 
2011 05 05 rendez accessible votre site internetvia un telephone portable by ...
2011 05 05 rendez accessible votre site internetvia un telephone portable by ...2011 05 05 rendez accessible votre site internetvia un telephone portable by ...
2011 05 05 rendez accessible votre site internetvia un telephone portable by ...COMPETITIC
 
Internet mobile en 2020 : objectif #PWAMP par Virginie Clève
Internet mobile en 2020 : objectif #PWAMP par Virginie ClèveInternet mobile en 2020 : objectif #PWAMP par Virginie Clève
Internet mobile en 2020 : objectif #PWAMP par Virginie ClèveLa Cuisine du Web
 
Actualités SEO - Petit déjeuner 27 sept 2018 - Anne Claire Frapin
Actualités SEO - Petit déjeuner 27 sept 2018 - Anne Claire FrapinActualités SEO - Petit déjeuner 27 sept 2018 - Anne Claire Frapin
Actualités SEO - Petit déjeuner 27 sept 2018 - Anne Claire FrapinPeak Ace
 
Comment booster son application dans les stores? par Virginie Clève
Comment booster son application dans les stores? par Virginie ClèveComment booster son application dans les stores? par Virginie Clève
Comment booster son application dans les stores? par Virginie ClèveTheFamily
 
Progressive Web Apps PWA : quoi, comment, pour quels résultats ?
Progressive Web Apps PWA : quoi, comment, pour quels résultats ?Progressive Web Apps PWA : quoi, comment, pour quels résultats ?
Progressive Web Apps PWA : quoi, comment, pour quels résultats ?Virginie Clève - largow ☕️
 
SMX Paris 2018 - Comment optimiser votre visibilité en développant des synerg...
SMX Paris 2018 - Comment optimiser votre visibilité en développant des synerg...SMX Paris 2018 - Comment optimiser votre visibilité en développant des synerg...
SMX Paris 2018 - Comment optimiser votre visibilité en développant des synerg...Peak Ace
 

Tendances (20)

Les nouveaux enjeux de la distribution de contenu : Google AMP, Facebook Inst...
Les nouveaux enjeux de la distribution de contenu : Google AMP, Facebook Inst...Les nouveaux enjeux de la distribution de contenu : Google AMP, Facebook Inst...
Les nouveaux enjeux de la distribution de contenu : Google AMP, Facebook Inst...
 
Réussir son lancement mobile
Réussir son lancement mobileRéussir son lancement mobile
Réussir son lancement mobile
 
Promotion d'une appli mobile : ASO, social media, campagnes marketing,...
Promotion d'une appli mobile : ASO, social media, campagnes marketing,...Promotion d'une appli mobile : ASO, social media, campagnes marketing,...
Promotion d'une appli mobile : ASO, social media, campagnes marketing,...
 
Aso 101 : comment booster votre appli mobile sur les stores
Aso 101 : comment booster votre appli mobile sur les storesAso 101 : comment booster votre appli mobile sur les stores
Aso 101 : comment booster votre appli mobile sur les stores
 
Internet mobile en 2020 : Progressive web apps PWA et Google AMP
Internet mobile en 2020 : Progressive web apps PWA et Google AMPInternet mobile en 2020 : Progressive web apps PWA et Google AMP
Internet mobile en 2020 : Progressive web apps PWA et Google AMP
 
Actualité des moteurs de recherche et du référencement (SEO & SEA) - Petit-d...
Actualité des moteurs de recherche et du référencement (SEO & SEA)  - Petit-d...Actualité des moteurs de recherche et du référencement (SEO & SEA)  - Petit-d...
Actualité des moteurs de recherche et du référencement (SEO & SEA) - Petit-d...
 
Conseils pour être featuré sur les appstores
Conseils pour être featuré sur les appstoresConseils pour être featuré sur les appstores
Conseils pour être featuré sur les appstores
 
Le mobile first index - Petit déjeuner de Genève du 16 Mai
 Le mobile first index - Petit déjeuner de Genève du 16 Mai Le mobile first index - Petit déjeuner de Genève du 16 Mai
Le mobile first index - Petit déjeuner de Genève du 16 Mai
 
10 conseils pour réussir le lancement de votre application
10 conseils pour réussir le lancement de votre application10 conseils pour réussir le lancement de votre application
10 conseils pour réussir le lancement de votre application
 
Mobile et e-commerce 2017 : Google AMP, Mobile First Index
Mobile et e-commerce 2017 : Google AMP, Mobile First IndexMobile et e-commerce 2017 : Google AMP, Mobile First Index
Mobile et e-commerce 2017 : Google AMP, Mobile First Index
 
MobiliteaTime #4 : Guide Pratique Apple TV
MobiliteaTime #4 : Guide Pratique Apple TVMobiliteaTime #4 : Guide Pratique Apple TV
MobiliteaTime #4 : Guide Pratique Apple TV
 
Les chantiers indispensables à glisser dans votre roadmap 2018 - Petit-déjeun...
Les chantiers indispensables à glisser dans votre roadmap 2018 - Petit-déjeun...Les chantiers indispensables à glisser dans votre roadmap 2018 - Petit-déjeun...
Les chantiers indispensables à glisser dans votre roadmap 2018 - Petit-déjeun...
 
TUNISEO - 2018 - Le SEO à l'heure du Mobile First par Philippe Yonnet, Direct...
TUNISEO - 2018 - Le SEO à l'heure du Mobile First par Philippe Yonnet, Direct...TUNISEO - 2018 - Le SEO à l'heure du Mobile First par Philippe Yonnet, Direct...
TUNISEO - 2018 - Le SEO à l'heure du Mobile First par Philippe Yonnet, Direct...
 
2011 05 05 rendez accessible votre site internetvia un telephone portable by ...
2011 05 05 rendez accessible votre site internetvia un telephone portable by ...2011 05 05 rendez accessible votre site internetvia un telephone portable by ...
2011 05 05 rendez accessible votre site internetvia un telephone portable by ...
 
Internet mobile en 2020 : objectif #PWAMP par Virginie Clève
Internet mobile en 2020 : objectif #PWAMP par Virginie ClèveInternet mobile en 2020 : objectif #PWAMP par Virginie Clève
Internet mobile en 2020 : objectif #PWAMP par Virginie Clève
 
Actualités SEO - Petit déjeuner 27 sept 2018 - Anne Claire Frapin
Actualités SEO - Petit déjeuner 27 sept 2018 - Anne Claire FrapinActualités SEO - Petit déjeuner 27 sept 2018 - Anne Claire Frapin
Actualités SEO - Petit déjeuner 27 sept 2018 - Anne Claire Frapin
 
Comment booster son application dans les stores? par Virginie Clève
Comment booster son application dans les stores? par Virginie ClèveComment booster son application dans les stores? par Virginie Clève
Comment booster son application dans les stores? par Virginie Clève
 
Progressive Web Apps PWA : quoi, comment, pour quels résultats ?
Progressive Web Apps PWA : quoi, comment, pour quels résultats ?Progressive Web Apps PWA : quoi, comment, pour quels résultats ?
Progressive Web Apps PWA : quoi, comment, pour quels résultats ?
 
SEO Dawa Day Progressive Web App 23 sept 2017
SEO Dawa Day Progressive Web App 23 sept 2017SEO Dawa Day Progressive Web App 23 sept 2017
SEO Dawa Day Progressive Web App 23 sept 2017
 
SMX Paris 2018 - Comment optimiser votre visibilité en développant des synerg...
SMX Paris 2018 - Comment optimiser votre visibilité en développant des synerg...SMX Paris 2018 - Comment optimiser votre visibilité en développant des synerg...
SMX Paris 2018 - Comment optimiser votre visibilité en développant des synerg...
 

Similaire à MobiliTeaTime #13 : Accelerated Mobile Pages

Les chantiers indispensables à ajouter à votre roadmap 2018 - Philippe Yonnet...
Les chantiers indispensables à ajouter à votre roadmap 2018 - Philippe Yonnet...Les chantiers indispensables à ajouter à votre roadmap 2018 - Philippe Yonnet...
Les chantiers indispensables à ajouter à votre roadmap 2018 - Philippe Yonnet...Peak Ace
 
L'AMP pour les sites e-commerce - 22 février - Lille
L'AMP pour les sites e-commerce - 22 février - LilleL'AMP pour les sites e-commerce - 22 février - Lille
L'AMP pour les sites e-commerce - 22 février - LillePeak Ace
 
Webinar Semrush Neper - quel ROI pour les pages amp
Webinar Semrush Neper - quel ROI pour les pages  ampWebinar Semrush Neper - quel ROI pour les pages  amp
Webinar Semrush Neper - quel ROI pour les pages ampPhilippe YONNET
 
Quel ROI attendre d'un projet de création de pages AMP ?
Quel ROI attendre d'un projet de création de pages AMP ?Quel ROI attendre d'un projet de création de pages AMP ?
Quel ROI attendre d'un projet de création de pages AMP ?Semrush France
 
Amp 2 ans après, quel impact sur votre seo en 2018
Amp 2 ans après, quel impact sur votre seo en 2018Amp 2 ans après, quel impact sur votre seo en 2018
Amp 2 ans après, quel impact sur votre seo en 2018Peak Ace
 
Google AMP 1 an après : quel bilan, quelles perspectives ?
Google AMP 1 an après : quel bilan, quelles perspectives ?Google AMP 1 an après : quel bilan, quelles perspectives ?
Google AMP 1 an après : quel bilan, quelles perspectives ?Virginie Clève - largow ☕️
 
Les chantiers indispensables à glisser dans votre roadmap 2018 - Petit-déjeun...
Les chantiers indispensables à glisser dans votre roadmap 2018 - Petit-déjeun...Les chantiers indispensables à glisser dans votre roadmap 2018 - Petit-déjeun...
Les chantiers indispensables à glisser dans votre roadmap 2018 - Petit-déjeun...Peak Ace
 
Les Sites Mobiles
Les Sites MobilesLes Sites Mobiles
Les Sites Mobilesmmti2008
 
Les Sites Mobiles
Les Sites MobilesLes Sites Mobiles
Les Sites Mobilesm.dubucq
 
Grand Est Numérique - 14 septembre - Le SEO à l'heure du Mobile First - Phili...
Grand Est Numérique - 14 septembre - Le SEO à l'heure du Mobile First - Phili...Grand Est Numérique - 14 septembre - Le SEO à l'heure du Mobile First - Phili...
Grand Est Numérique - 14 septembre - Le SEO à l'heure du Mobile First - Phili...Peak Ace
 
2018 le seo à l heure du mobile first index
2018 le seo à l heure du mobile first index2018 le seo à l heure du mobile first index
2018 le seo à l heure du mobile first indexPhilippe YONNET
 
Nouvelles architectures de sites web et SEO
Nouvelles architectures de sites web et SEONouvelles architectures de sites web et SEO
Nouvelles architectures de sites web et SEOPhilippe YONNET
 
Le livre blanc pour tout savoir de la webperf
Le livre blanc pour tout savoir de la webperfLe livre blanc pour tout savoir de la webperf
Le livre blanc pour tout savoir de la webperfObject Vingt Trois
 
L'argumentation commercial pour la vitesse dans le marketing numérique
L'argumentation commercial pour la vitesse dans le marketing numériqueL'argumentation commercial pour la vitesse dans le marketing numérique
L'argumentation commercial pour la vitesse dans le marketing numériqueThom. Poole
 
Le SEO pour mobile 
Le SEO pour mobile Le SEO pour mobile 
Le SEO pour mobile Peak Ace
 
Search : la todo list 2017 pour ne rien oublier dans votre roadmap - Petit dé...
Search : la todo list 2017 pour ne rien oublier dans votre roadmap - Petit dé...Search : la todo list 2017 pour ne rien oublier dans votre roadmap - Petit dé...
Search : la todo list 2017 pour ne rien oublier dans votre roadmap - Petit dé...Peak Ace
 
Search : la todo list 2017 - Petit déjeuner 29 septembre 2016 Lille
Search : la todo list 2017 - Petit déjeuner 29 septembre 2016 Lille Search : la todo list 2017 - Petit déjeuner 29 septembre 2016 Lille
Search : la todo list 2017 - Petit déjeuner 29 septembre 2016 Lille Peak Ace
 
SMX Paris 19 - Thalasso x Google x Atomic Search : How to boost your mobile p...
SMX Paris 19 - Thalasso x Google x Atomic Search : How to boost your mobile p...SMX Paris 19 - Thalasso x Google x Atomic Search : How to boost your mobile p...
SMX Paris 19 - Thalasso x Google x Atomic Search : How to boost your mobile p...Alexandre Siahou
 
Search : la todo list 2017 pour ne rien oublier dans votre roadmap - Petit dé...
Search : la todo list 2017 pour ne rien oublier dans votre roadmap - Petit dé...Search : la todo list 2017 pour ne rien oublier dans votre roadmap - Petit dé...
Search : la todo list 2017 pour ne rien oublier dans votre roadmap - Petit dé...Peak Ace
 
Améliorer l’expérience utilisateur en passant aux Progressive Web App
Améliorer l’expérience utilisateur en passant aux Progressive Web App Améliorer l’expérience utilisateur en passant aux Progressive Web App
Améliorer l’expérience utilisateur en passant aux Progressive Web App RESONEO
 

Similaire à MobiliTeaTime #13 : Accelerated Mobile Pages (20)

Les chantiers indispensables à ajouter à votre roadmap 2018 - Philippe Yonnet...
Les chantiers indispensables à ajouter à votre roadmap 2018 - Philippe Yonnet...Les chantiers indispensables à ajouter à votre roadmap 2018 - Philippe Yonnet...
Les chantiers indispensables à ajouter à votre roadmap 2018 - Philippe Yonnet...
 
L'AMP pour les sites e-commerce - 22 février - Lille
L'AMP pour les sites e-commerce - 22 février - LilleL'AMP pour les sites e-commerce - 22 février - Lille
L'AMP pour les sites e-commerce - 22 février - Lille
 
Webinar Semrush Neper - quel ROI pour les pages amp
Webinar Semrush Neper - quel ROI pour les pages  ampWebinar Semrush Neper - quel ROI pour les pages  amp
Webinar Semrush Neper - quel ROI pour les pages amp
 
Quel ROI attendre d'un projet de création de pages AMP ?
Quel ROI attendre d'un projet de création de pages AMP ?Quel ROI attendre d'un projet de création de pages AMP ?
Quel ROI attendre d'un projet de création de pages AMP ?
 
Amp 2 ans après, quel impact sur votre seo en 2018
Amp 2 ans après, quel impact sur votre seo en 2018Amp 2 ans après, quel impact sur votre seo en 2018
Amp 2 ans après, quel impact sur votre seo en 2018
 
Google AMP 1 an après : quel bilan, quelles perspectives ?
Google AMP 1 an après : quel bilan, quelles perspectives ?Google AMP 1 an après : quel bilan, quelles perspectives ?
Google AMP 1 an après : quel bilan, quelles perspectives ?
 
Les chantiers indispensables à glisser dans votre roadmap 2018 - Petit-déjeun...
Les chantiers indispensables à glisser dans votre roadmap 2018 - Petit-déjeun...Les chantiers indispensables à glisser dans votre roadmap 2018 - Petit-déjeun...
Les chantiers indispensables à glisser dans votre roadmap 2018 - Petit-déjeun...
 
Les Sites Mobiles
Les Sites MobilesLes Sites Mobiles
Les Sites Mobiles
 
Les Sites Mobiles
Les Sites MobilesLes Sites Mobiles
Les Sites Mobiles
 
Grand Est Numérique - 14 septembre - Le SEO à l'heure du Mobile First - Phili...
Grand Est Numérique - 14 septembre - Le SEO à l'heure du Mobile First - Phili...Grand Est Numérique - 14 septembre - Le SEO à l'heure du Mobile First - Phili...
Grand Est Numérique - 14 septembre - Le SEO à l'heure du Mobile First - Phili...
 
2018 le seo à l heure du mobile first index
2018 le seo à l heure du mobile first index2018 le seo à l heure du mobile first index
2018 le seo à l heure du mobile first index
 
Nouvelles architectures de sites web et SEO
Nouvelles architectures de sites web et SEONouvelles architectures de sites web et SEO
Nouvelles architectures de sites web et SEO
 
Le livre blanc pour tout savoir de la webperf
Le livre blanc pour tout savoir de la webperfLe livre blanc pour tout savoir de la webperf
Le livre blanc pour tout savoir de la webperf
 
L'argumentation commercial pour la vitesse dans le marketing numérique
L'argumentation commercial pour la vitesse dans le marketing numériqueL'argumentation commercial pour la vitesse dans le marketing numérique
L'argumentation commercial pour la vitesse dans le marketing numérique
 
Le SEO pour mobile 
Le SEO pour mobile Le SEO pour mobile 
Le SEO pour mobile 
 
Search : la todo list 2017 pour ne rien oublier dans votre roadmap - Petit dé...
Search : la todo list 2017 pour ne rien oublier dans votre roadmap - Petit dé...Search : la todo list 2017 pour ne rien oublier dans votre roadmap - Petit dé...
Search : la todo list 2017 pour ne rien oublier dans votre roadmap - Petit dé...
 
Search : la todo list 2017 - Petit déjeuner 29 septembre 2016 Lille
Search : la todo list 2017 - Petit déjeuner 29 septembre 2016 Lille Search : la todo list 2017 - Petit déjeuner 29 septembre 2016 Lille
Search : la todo list 2017 - Petit déjeuner 29 septembre 2016 Lille
 
SMX Paris 19 - Thalasso x Google x Atomic Search : How to boost your mobile p...
SMX Paris 19 - Thalasso x Google x Atomic Search : How to boost your mobile p...SMX Paris 19 - Thalasso x Google x Atomic Search : How to boost your mobile p...
SMX Paris 19 - Thalasso x Google x Atomic Search : How to boost your mobile p...
 
Search : la todo list 2017 pour ne rien oublier dans votre roadmap - Petit dé...
Search : la todo list 2017 pour ne rien oublier dans votre roadmap - Petit dé...Search : la todo list 2017 pour ne rien oublier dans votre roadmap - Petit dé...
Search : la todo list 2017 pour ne rien oublier dans votre roadmap - Petit dé...
 
Améliorer l’expérience utilisateur en passant aux Progressive Web App
Améliorer l’expérience utilisateur en passant aux Progressive Web App Améliorer l’expérience utilisateur en passant aux Progressive Web App
Améliorer l’expérience utilisateur en passant aux Progressive Web App
 

Plus de USERADGENTS

Etude Mobile et Relation Client
Etude Mobile et Relation ClientEtude Mobile et Relation Client
Etude Mobile et Relation ClientUSERADGENTS
 
Luxury Mobile Interfaces
Luxury Mobile InterfacesLuxury Mobile Interfaces
Luxury Mobile InterfacesUSERADGENTS
 
Mise à jour Guide Pratique - Panorama des technologies pour développer une ap...
Mise à jour Guide Pratique - Panorama des technologies pour développer une ap...Mise à jour Guide Pratique - Panorama des technologies pour développer une ap...
Mise à jour Guide Pratique - Panorama des technologies pour développer une ap...USERADGENTS
 
Métavers l'infini et au-delà : quelles opportunités pour les marques ?
Métavers l'infini et au-delà : quelles opportunités pour les marques ? Métavers l'infini et au-delà : quelles opportunités pour les marques ?
Métavers l'infini et au-delà : quelles opportunités pour les marques ? USERADGENTS
 
Etude • RetailXperience #4
Etude • RetailXperience #4Etude • RetailXperience #4
Etude • RetailXperience #4USERADGENTS
 
Fridays digest • Janvier - Décembre 2018 [ Friday's Watch ]
Fridays digest • Janvier - Décembre 2018 [ Friday's Watch ]Fridays digest • Janvier - Décembre 2018 [ Friday's Watch ]
Fridays digest • Janvier - Décembre 2018 [ Friday's Watch ]USERADGENTS
 
Friday's Digest • Janvier - Août 2018
Friday's Digest • Janvier - Août 2018Friday's Digest • Janvier - Août 2018
Friday's Digest • Janvier - Août 2018USERADGENTS
 
MoiliteaTime #17 : Best Practices Sites M-commerce | Ameublement & Décoration
MoiliteaTime #17 : Best Practices Sites M-commerce | Ameublement & DécorationMoiliteaTime #17 : Best Practices Sites M-commerce | Ameublement & Décoration
MoiliteaTime #17 : Best Practices Sites M-commerce | Ameublement & DécorationUSERADGENTS
 
MobiliteaTime #16 : Les Voice First Devices
MobiliteaTime #16 : Les Voice First Devices  MobiliteaTime #16 : Les Voice First Devices
MobiliteaTime #16 : Les Voice First Devices USERADGENTS
 
SUMMER'S WATCH • Les news Mobile & Tech de l'été
SUMMER'S WATCH • Les news Mobile & Tech de l'étéSUMMER'S WATCH • Les news Mobile & Tech de l'été
SUMMER'S WATCH • Les news Mobile & Tech de l'étéUSERADGENTS
 
MobiliteaTime #15 : iOS 11
MobiliteaTime #15 : iOS 11MobiliteaTime #15 : iOS 11
MobiliteaTime #15 : iOS 11USERADGENTS
 
MobiliTeaTime #14 : L'Atomic Design
MobiliTeaTime #14 : L'Atomic DesignMobiliTeaTime #14 : L'Atomic Design
MobiliTeaTime #14 : L'Atomic DesignUSERADGENTS
 
IoTeaTime #4 : Smart City
IoTeaTime #4 : Smart City IoTeaTime #4 : Smart City
IoTeaTime #4 : Smart City USERADGENTS
 
MobiliTeaTime #12 : RETAILXPERIENCE - Penser son point de vente comme un site...
MobiliTeaTime #12 : RETAILXPERIENCE - Penser son point de vente comme un site...MobiliTeaTime #12 : RETAILXPERIENCE - Penser son point de vente comme un site...
MobiliTeaTime #12 : RETAILXPERIENCE - Penser son point de vente comme un site...USERADGENTS
 
MobiliteaTime #10 : Apple Pay & Apple Wallet
MobiliteaTime #10 : Apple Pay & Apple Wallet MobiliteaTime #10 : Apple Pay & Apple Wallet
MobiliteaTime #10 : Apple Pay & Apple Wallet USERADGENTS
 
IoTeaTime #3 : Smart Home | De la maison connectée à la maison intelligente
IoTeaTime #3 : Smart Home | De la maison connectée à la maison intelligenteIoTeaTime #3 : Smart Home | De la maison connectée à la maison intelligente
IoTeaTime #3 : Smart Home | De la maison connectée à la maison intelligenteUSERADGENTS
 
MobiliteaTime #9 : les Search Ads d'Apple
MobiliteaTime #9 : les Search Ads d'AppleMobiliteaTime #9 : les Search Ads d'Apple
MobiliteaTime #9 : les Search Ads d'AppleUSERADGENTS
 
IoTeaTime #2 : Welcome to Artificial Reality | Réalités augmentée, virtuelle ...
IoTeaTime #2 : Welcome to Artificial Reality | Réalités augmentée, virtuelle ...IoTeaTime #2 : Welcome to Artificial Reality | Réalités augmentée, virtuelle ...
IoTeaTime #2 : Welcome to Artificial Reality | Réalités augmentée, virtuelle ...USERADGENTS
 
MobiliteaTime #8 : Les Chat Bots
MobiliteaTime #8 : Les Chat BotsMobiliteaTime #8 : Les Chat Bots
MobiliteaTime #8 : Les Chat BotsUSERADGENTS
 
MobiliteaTime #7 : Blockchain
MobiliteaTime #7 : BlockchainMobiliteaTime #7 : Blockchain
MobiliteaTime #7 : BlockchainUSERADGENTS
 

Plus de USERADGENTS (20)

Etude Mobile et Relation Client
Etude Mobile et Relation ClientEtude Mobile et Relation Client
Etude Mobile et Relation Client
 
Luxury Mobile Interfaces
Luxury Mobile InterfacesLuxury Mobile Interfaces
Luxury Mobile Interfaces
 
Mise à jour Guide Pratique - Panorama des technologies pour développer une ap...
Mise à jour Guide Pratique - Panorama des technologies pour développer une ap...Mise à jour Guide Pratique - Panorama des technologies pour développer une ap...
Mise à jour Guide Pratique - Panorama des technologies pour développer une ap...
 
Métavers l'infini et au-delà : quelles opportunités pour les marques ?
Métavers l'infini et au-delà : quelles opportunités pour les marques ? Métavers l'infini et au-delà : quelles opportunités pour les marques ?
Métavers l'infini et au-delà : quelles opportunités pour les marques ?
 
Etude • RetailXperience #4
Etude • RetailXperience #4Etude • RetailXperience #4
Etude • RetailXperience #4
 
Fridays digest • Janvier - Décembre 2018 [ Friday's Watch ]
Fridays digest • Janvier - Décembre 2018 [ Friday's Watch ]Fridays digest • Janvier - Décembre 2018 [ Friday's Watch ]
Fridays digest • Janvier - Décembre 2018 [ Friday's Watch ]
 
Friday's Digest • Janvier - Août 2018
Friday's Digest • Janvier - Août 2018Friday's Digest • Janvier - Août 2018
Friday's Digest • Janvier - Août 2018
 
MoiliteaTime #17 : Best Practices Sites M-commerce | Ameublement & Décoration
MoiliteaTime #17 : Best Practices Sites M-commerce | Ameublement & DécorationMoiliteaTime #17 : Best Practices Sites M-commerce | Ameublement & Décoration
MoiliteaTime #17 : Best Practices Sites M-commerce | Ameublement & Décoration
 
MobiliteaTime #16 : Les Voice First Devices
MobiliteaTime #16 : Les Voice First Devices  MobiliteaTime #16 : Les Voice First Devices
MobiliteaTime #16 : Les Voice First Devices
 
SUMMER'S WATCH • Les news Mobile & Tech de l'été
SUMMER'S WATCH • Les news Mobile & Tech de l'étéSUMMER'S WATCH • Les news Mobile & Tech de l'été
SUMMER'S WATCH • Les news Mobile & Tech de l'été
 
MobiliteaTime #15 : iOS 11
MobiliteaTime #15 : iOS 11MobiliteaTime #15 : iOS 11
MobiliteaTime #15 : iOS 11
 
MobiliTeaTime #14 : L'Atomic Design
MobiliTeaTime #14 : L'Atomic DesignMobiliTeaTime #14 : L'Atomic Design
MobiliTeaTime #14 : L'Atomic Design
 
IoTeaTime #4 : Smart City
IoTeaTime #4 : Smart City IoTeaTime #4 : Smart City
IoTeaTime #4 : Smart City
 
MobiliTeaTime #12 : RETAILXPERIENCE - Penser son point de vente comme un site...
MobiliTeaTime #12 : RETAILXPERIENCE - Penser son point de vente comme un site...MobiliTeaTime #12 : RETAILXPERIENCE - Penser son point de vente comme un site...
MobiliTeaTime #12 : RETAILXPERIENCE - Penser son point de vente comme un site...
 
MobiliteaTime #10 : Apple Pay & Apple Wallet
MobiliteaTime #10 : Apple Pay & Apple Wallet MobiliteaTime #10 : Apple Pay & Apple Wallet
MobiliteaTime #10 : Apple Pay & Apple Wallet
 
IoTeaTime #3 : Smart Home | De la maison connectée à la maison intelligente
IoTeaTime #3 : Smart Home | De la maison connectée à la maison intelligenteIoTeaTime #3 : Smart Home | De la maison connectée à la maison intelligente
IoTeaTime #3 : Smart Home | De la maison connectée à la maison intelligente
 
MobiliteaTime #9 : les Search Ads d'Apple
MobiliteaTime #9 : les Search Ads d'AppleMobiliteaTime #9 : les Search Ads d'Apple
MobiliteaTime #9 : les Search Ads d'Apple
 
IoTeaTime #2 : Welcome to Artificial Reality | Réalités augmentée, virtuelle ...
IoTeaTime #2 : Welcome to Artificial Reality | Réalités augmentée, virtuelle ...IoTeaTime #2 : Welcome to Artificial Reality | Réalités augmentée, virtuelle ...
IoTeaTime #2 : Welcome to Artificial Reality | Réalités augmentée, virtuelle ...
 
MobiliteaTime #8 : Les Chat Bots
MobiliteaTime #8 : Les Chat BotsMobiliteaTime #8 : Les Chat Bots
MobiliteaTime #8 : Les Chat Bots
 
MobiliteaTime #7 : Blockchain
MobiliteaTime #7 : BlockchainMobiliteaTime #7 : Blockchain
MobiliteaTime #7 : Blockchain
 

MobiliTeaTime #13 : Accelerated Mobile Pages

  • 1. userADgents ACCELERATED MOBILE PAGES Comprendre la notion d’AMP, pour des pages web plus rapides sur mobile MOBILI
 
tea time #13
 
 userADgents GUIDE PRATIQUE
  • 2. DES INTERNAUTES ABANDONNENT UN SITE LORSQUE LE CHARGEMENT EXCÈDE 3 SECONDES ! 53% LE CHIFFRE Source : DoubleClick by Google
  • 3. DANS UN MONDE MOBILE FIRST, OÙ IL Y A + DE MOBINAUTES QUE D’INTERNAUTES, IL EST TEMPS D’OPTIMISER LA LECTURE DES PAGES WEB SUR MOBILE ! LE CONSTAT
  • 4. GOOGLE A DONC LANCÉ LE FORMAT ‘AMP’ QUI PERMET D’AFFICHER BEAUCOUP PLUS RAPIDEMENT UNE PAGE WEB SUR MOBILE UNE INITIATIVE OPEN SOURCE : AMP PROJECT
  • 6. COMMENT ÇA SE TRADUIT ? Lors d’une requête sur Google sur terminal mobile, les sites disposant de la pastille & mention AMP figurent dans les résultats de recherche. 
 Il est facile de swiper parmi le carrousel pour voir tous les sites AMP abordant le sujet recherché. Ce carrousel apparaît avant les résultats traditionnels et est donc très visible.
 Une fois sur le site souhaité, la page charge instantanément (en moins de 2 secondes en général) et il est facile de scroller sans attendre que le contenu de la page charge. Pour le moment ce type d’affichage « carrousel » n’est appliqué que pour les sites d’actualités.
  • 7. POUR QUELS SITES ? Il s’agit aujourd’hui principalement de sites d’informations : actualités généralistes, actualités sportives, technologiques. AMP convient aux sites qui ont du contenu régulièrement mis à jour ou publié, des actualités chaudes. Depuis août 2016, Google a lancé AMP pour les sites e-commerce (uniquement pour les pages de listing et les pages produit), cela devrait donc se développer. À terme, tous les sites devraient avoir des pages en AMP pour améliorer l’expérience de lecture ! Ebay est le 1er site e-commerce à avoir développé l'AMP.Les sites d’actualités en AMP
  • 8. L’internaute qui sélectionne un contenu AMP n’est en fait pas redirigé vers le site à l’origine du contenu : la lecture se fait directement sur le domaine de Google ! HTML AMP TRÈS LIGHT PRIORISATION LECTURE AU SEIN DU DOMAINE GOOGLE Avec des pages AMP, lorsqu’un contenu est consulté depuis les résultats de Google, c’est sa version AMP qui est systématiquement appelée à la place de la page HTML classique. Il s’agit en fait de pages HTML très légères, auxquelles s’ajoute le système de cache CDN et une réduction du Javascript. L’image principale et le texte sont chargés en premier, au lieu de la publicité et des scripts en temps normal. COMMENT ÇA MARCHE ?
  • 10. 4 fois 
 + rapides 10fois - de données PAR RAPPORT AUX PAGES NON AMP ! 15à 
 85% de gain de vitesse 
 d’affichage
  • 11. UNE AUGMENTATION SIGNIFICATIVE 
 DE VISIBILITÉ EN CRÉANT DES ARTICLES AMP, LES ÉDITEURS / MARQUES VERRONT LEURS CONTENUS, AUPARAVANT ISOLÉS SUR DES BLOGS, MIS EN AVANT DIRECTEMENT SUR GOOGLE.
  • 12. S’IMPOSER DANS LA GUERRE DU RÉFÉRENCEMENT GOOGLE A DEPUIS QUELQUES ANNÉES ANNONCÉ LA PRIORISATION DES SITES MOBILE-FRIENDLY SUR SES SERPS. EN TOUTE LOGIQUE, LE MOTEUR DE RECHERCHE ENTEND ÉGALEMENT MIEUX RÉFÉRENCER LES SITES AMP !
  • 13. UNE MEILLEURE EXPÉRIENCE
 UTILISATEUR UN CONFORT DE LECTURE EN TOUTE MOBILITÉ ENTRAINANT DAVANTAGE DE CONTENUS CONSULTÉS
  • 15. 3 PARTIES COMPOSENT L’AMP : ET TECHNIQUEMENT ? Elle garantit un rendu rapide des pages AMP HTML. Et permet d’intégrer dans des pages AMP des composants dynamiques et asynchrones tels que les analytics, les frameworks de publicités, et bientôt les tunnels ecommerce. Une déclinaison du HTML comportant certaines restrictions pour assurer des performances fiables, ainsi que certaines extensions permettant de créer directement du contenu riche sans javascript ou CSS complexe. Il fournit les pages AMP HTML sur un réseau CDN ultra rapide permettant de gagner en temps de réponse sur des data- center répartis sur le monde entier. LE AMP HTML LA BIBLIOTÈQUE AMP JS LE GOOGLE AMP CACHE
  • 16. AMP HTML ET TECHNIQUEMENT ? Même si la plupart des balises sur une page AMP HTML sont des balises HTML standard, certaines sont remplacées par des balises AMP spécifiques. Ces éléments personnalisés, appelés composants AMP HTML, permettent d'implémenter facilement et efficacement des modèles communs. Exemple à droite, une publicité est composée uniquement d’une balise <amp-ad> qui permet d’afficher une bannière très rapidement sur la page. https://github.com/ampproject/amphtml/blob/master/spec/amp-html-format.md
  • 17. AMP JS ET TECHNIQUEMENT ? La bibliothèque AMP JS comprend toutes les meilleures pratiques d'AMP en termes d’efficacité. Elle gère le chargement des ressources et contient les balises personnalisées. L'une des plus grandes optimisations est la désynchronisation de tout ce qui provient de ressources externes, de sorte que rien sur la page ne bloque le rendu des différents éléments. Toujours dans une logique de gain de performance, on peut citer également le système de « sandbox » pour tous les iframes, la pré-définition de la disposition de chaque élément sur la page avant le chargement des ressources et la désactivation des sélecteurs CSS lents.
  • 18. AMP CACHE ET TECHNIQUEMENT ? Toujours afin d’optimiser la vitesse d’affichage Google fournit gratuitement un CDN « Content Delivery Network » de type « proxy-cache » qui sauvegarde une version cache des pages AMP afin d’améliorer la performance d’affichage. Avec Google AMP Cache, tous les fichiers JS et toutes les images se chargent à partir d'une source, laquelle utilise HTTP 2.0 pour une efficacité optimale. Ce cache intègre également un système de validation qui vérifie le bon fonctionnement de la page et sa non dépendance vis-à-vis de ressources externes. Le lien des pages AMP est donc aujourd’hui un lien www.google.fr/amp
  • 20. NOUVELLE VERSION DU SITE ATTENTION DUPLICATION PUBLICITÉ & AMP ANALYTICS & AMP L’AMP est un projet complexe qui nécessite de développer une nouvelle version du site. Il faut veiller à ce que le contenu ne soit pas dupliqué avec la version mobile existante (gestion des Urls canoniques) LES COMPLEXITÉS D’AMP Certains réseaux publicitaires ne sont pas compatibles AMP Le tracking analytics n’est pas aussi complet qu’avec une page HTML, même si de nombreux outils sont déjà compatibles (Google Analytics, Comscore…) AMP est un projet récent dont on ne connait pas encore les évolutions ni la pérennité. Il est intéressant de mener ce projet très prometteur mais conserver son site mobile en parallèle est plus prudent. VIABILITÉ
  • 21. VOUS SOUHAITEZ ÊTRE ACCOMPAGNÉ DANS VOTRE STRATÉGIE MOBILE FIRST / AMP ? Rencontrons-nous ! userADgents est spécialisée dans la conception, le développement et la promotion de sites et d’applications pour smartphones, tablettes et objets connectés.
  • 22. userADgents Nicolas Benoist CTO n.benoist@useradgents.com Solange Derrey Directrice du Pôle Trendwatchers & de la Communication s.derrey@useradgents.com É T U D E R É A L I S É E P A R T R E N D W A T C H E R S Le pôle études digitales et formations de userADgents JE M’INSCRIS À LA NEWS JE FOLLOW SUR TWITTER Et pour ne rien manquer des prochaines études ! www.useradgents.com
  • 23. userADgents RETROUVEZ NOS AUTRES ÉTUDES SUR SLIDESHARE ENVIE D’UNE ÉTUDE SUR-MESURE ? DÉCOUVREZ 
 NOTRE CATALOGUE DE FORMATIONS INTÉRESSÉ PAR UNE ÉTUDE SUR-MESURE POUR VOTRE ENTREPRISE ? N’HÉSITEZ PAS À CONSULTER NOTRE CATALOGUE DE FORMATIONS VOIR NOS 20 FORMATIONSDÉCOUVRIR NOS OFFRESEN VOIR PLUS ! Digitalisation du point de vente, smartwatches, smart home, Apple TV… découvrez toutes nos études en libre accès sur Slideshare ! Découvrez nos 3 offres d’études sur- mesure : étude sectorielle, étude de tendances et audit de marque. A partir de 5000 € H.T, sur devis Envie d’en savoir plus sur le mobile et l’innovation ? 
 Trouvez votre bonheur parmi nos 20 formations animées par des experts du domaine. A partir de 2000 € H.T pour 1 à 15 personnes
  • 24. USERADGENTS & JOSHFIRE AGENCE DIGITALE MOBILE FIRST USER CENTRIC AGENCE CONSEIL EN INNOVATION userADgents est spécialisée dans la conception, le développement et la promotion de sites et d’applications pour smartphones, tablettes et objets connectés. Joshfire, une équipe de designers et d’ingénieurs qui conçoivent de A à Z des objets connectés et des expériences interactives sur mesure.
  • 25. userADgents FABRIQUE 
 DE DISPOSITIFS 
 DIGITAUXINNOVANTS COMPLÉMENTAIRES DEUXAGENCES Hier l’enjeu était de s’adapter au web mobile, aujourd’hui & demain il sera d’embrasser ce nouveau monde ultra connecté où terminaux mobiles & objets communiquent.  Notre complémentarité nous permet d’imaginer des expériences transversales à ces dispositifs et de répondre aux nouvelles problématiques des marques. 1 ÈRE 1 FORMANTÀELLESDEUXLA: USERADGENTS & JOSHFIRE
  • 26. …DU CONSEIL À LA COMMERCIALISATION… Analyse comportementale Ateliers d’idéation Recherche de concepts innovants User journey Ergonomie Tests utilisateurs Ateliers de co-création Design des interfaces Design industriel Objets connectés Applications natives (iOS/Android/Windows) Responsive & Adaptive Design Back-end & APIs Arduino / Raspberry Pi Réalité virtuelle Chat bots Publicité mobile Couponing SMS/Push Notif App Store Optimization Mobile-to-store Interactions in-store Beacons Vidéo Etudes fonctionnelles Prototypages Spécifications Suivi d’industrialisation & de production Etude de tendances Audit de marque Benchmarks Accompagnement stratégique Recherche & Innovation DESIGN PROMOTION CRM UX / IDÉATION DÉVELOPPEMENT PROTOTYPAGE & INDUSTRIALISATION CONSEIL
  • 27. userADgents SOYEZ UTILES
 & COHÉRENTS CULTIVEZ VOTRE DIFFÉRENCE Le digital et vos clients sont en constante mouvance ! Nous aimons faire bouger les choses et secouer les esprits pour sortir des idées reçues et se challenger constamment. SENS EFFERVESCENCE ESSENCE Dans un environnement de plus en plus concurrentiel et un contexte de surexposition des consommateurs, chaque marque doit cultiver sa différence et revendiquer son ADN et ses valeurs. Nous pensons que le digital ne doit pas être gadget ! Nous voulons créer des dispositifs qui ont du sens pour vos clients. OUVREZ GRAND 
 LES YEUX …ANIMÉES PAR UNE VISION COMMUNE !