On commence à voir des liens AMP dans les pages de résultat Google depuis février 2017. Qui sont les sites qui se sont lancés dans l’aventure ? Avec quels résultats ? Quid du e-commerce ? Faut t’il y aller et si oui comment, pour quelles opportunités et avec quels risques ? Ce sont à toutes ces questions que cette conférence tentera de répondre, en vous dressant un bilan d’un an d’AMP.
10. #SEOCamp @largow
Comment font t’ils ?
Texte et images sont téléchargés en 1er
Le reste est relégué au second plan
HTML super light
JS réduit au minimum
Chargement asynchrone des iframes pour gagner encore en temps de
chargement.
Nombre de requêtes réduit drastiquement : load de 10x moins de
data qu’une page mobile classique (Source : Google)
11. Quelques stats AMP fournies par Google
7 300 développeurs utilisaient AMP en mai 2016
1 900 soumissions de code (mai 2016)
1,4 milliard de pages au format AMP dans l’index Google pour
850 000 domaines, en 104 langues (février 2017)
6 millions de nouvelles pages chaque semaine (aout 2016)
@largow / @gbournizien
Source des data : Google
#SEOCamp @largow
12. #SEOCamp @largow
Le navigateur ainsi que les supports partenaires repèrent la présence
de l’éclair dans la balise HTML d’ouverture pour basculer le lien vers
un contenu AMP depuis un mobile.
Google recommande de privilégier l’UTF-8
HTTPS sera bientôt obligatoire
Obligatoire : déclarer toutes les autres pages canoniques (web
et/ou mobiles)
AMP peut être la page canonique, c’est à dire la seule disponible
<!DOCTYPE html>
<html >
<head>
<meta charset="utf-8">
<link rel="canonical" href="$Url_page_canonique">
<meta name="viewport" content="width=device-width,minimum-
scale=1,initial-scale-1">
13. #SEOCamp @largow
Page article sur
mon site
⚡
Page AMP
?amp ou /amp
⚡
Page AMP
dans le
Google CDN
rel="amphtml"
rel="canonical"
Gestion du duplicate dans Google AMP
15. #SEOCamp @largow
Des limitations
Interstitiels interdits
Fichier CSS commun à toutes les pages AMP inférieur à 50 ko
Frames, iframes, embed,… sont interdits et doivent être
remplacés par des composants AMP
Codage strict : on est obligé par AMP de donner les
dimensions de tous les objets comme les images. Width et
height.
16. #SEOCamp @largow
Adapter le code issu du wysiwyg pour tout le contenu riche
Des composants sont disponibles pour gérer ces cas :
Composant Type d'usage
amp-img Images
amp-anim GIF animés
amp-Youtube Embed
amp-facebook Embed
amp-twitter Embed
amp-pinterest Embed
amp-instagram Embed
amp-lightbox Popup
amp-carousel Diaporama
amp-list Liste à puces
amp-analytics Tag stats
amp-iframe
Iframes et tout ce qui n'est pas disponible via autres
composants
amp-ad Publicités
Tous les composants : https://www.ampproject.org/docs/reference/extended.html
20. #SEOCamp @largow
Etape 1 : validation en développement
Avec le navigateur Chrome
1. Ajouter #development=1 à la fin de l’url AMP
2. Ajouter la console DevTools (Afficher/Outils pour
développeurs/Console Javascript
23. #SEOCamp @largow
Etape 3 : validation du microformat
NewsArticle, Article, BlogPosting ou VideoObject
https://developers.google.com/structured-data/testing-tool/
25. #SEOCamp @largow
Etape 4 : suivi de l’indexation et des rejets
https://developers.google.com/structured-data/testing-tool/
Attention, 1 semaine de délai entre l’analyse de la page et le reporting dans Search Console
26. #SEOCamp @largow
Une page AMP ne sera pas acceptée tant qu’elle comportera
une erreur, aussi petite soit t’elle.
Pages AMP en erreur ? Tu sors !
29. #SEOCamp @largow
Communication officielle Google :
15 à 85% de gain* en vitesse d’affichage
Réalité (pages AMP hors cache Google) :
13 et 72% de gain* (Source : Fastrize)
* par rapport à une page mobile « normale »
Quel gain ?
30. #SEOCamp @largow
Avant AMP
Taux de revisite sous 7 jours : 51%
Avec AMP
Taux de revisite sous 7 jours : 63%
Doit aussi beaucoup à l’UX du carrousel AMP...
Retour d’expérience du Washington Post
31. #SEOCamp @largow
Une clé de succès : un bon produit, une bonne ergo
The Guardian :
60% du trafic total
site mobile en
provenance d’AMP
#CQFD
Source : AMP Conf Google - 08/03/2017
32. @largow / @gbournizien
AMP Ecommerce : 1ers retours
#SEOCamp @largow
Snapdeal (US):
+ 52% de commandes
journalières sur mobile grâce
à AMP
+59% de trafic mobile
quotidien grâce à AMP
Source : AMP Conf Google 07/03/2017
33. #SEOCamp @largow
Additionnel ou défensif ?
#CaDepend
Additionnel pour
les sites pas très
bons en trafic
news
Défensif pour les
sites déjà leaders
35. #SEOCamp @largow
Source des data :
0
10
20
30
40
50
60
70
80
90
100
Sep-16 Oct-16 Nov-16 Dec-16 Jan-17 Feb-17
81% de SERP's Google contenant au moins 1 résultat
AMP (requêtes contenu)
France UK US
36. #SEOCamp @largow
Source des data :
66
67
68
69
70
71
72
73
74
75
76
Sep-16 Oct-16 Nov-16 Dec-16 Jan-17 Feb-17
74% des résultats dans les Newsbox sont AMP en France
37. @largow / @gbournizien
89 %
11 %
#SEOCamp @largow
Source des data :
0
10
20
30
40
50
60
70
Sep-16 Oct-16 Nov-16 Dec-16 Jan-17 Feb-17
54% de résultats texte AMP dans les SERP's Google en
France
France UK US
38. @largow / @gbournizien
11 %
#SEOCamp @largow
Source : Search Engine Roundtable
Nouveauté Mars 2016 US : Top Stories Related Picks
43. #SEOCamp @largow
Chiffres clés AMP secteur média
Etude réalisée par largow auprès de 10 sites média du Top 15 en audience en février/mars 2017
44. #SEOCamp @largow
Attention, bug de compatabilisation dans Google Analytics
Les visites qui commencent par une page AMP et se poursuivent ensuite sur le
site « normal » peuvent causer une erreur de comptabilication qui peut alle
jusqu’à x4
Créer obligatoirement un profil séparé pour AMP
Plus d’infos sur Search Engine Roundtable : http://bit.ly/2mkSNNf
47. #SEOCamp @largow
Sauf que…
Le Page Speed l’est
Le mobile friendly aussi
Les pages AMP rankent très haut dans les SERP’s, dans
un carrousel imagé et très visible.
Attention, AMP ne résout pas les problématiques de page
speed ou d’ergonomie sur votre site mobile !
49. #SEOCamp @largow
Critères de déclenchement du carrousel
Le carrousel ne se déclenche pas
sur toute les requêtes
Il se déclenche s’il y a assez de
volume de recherches et de pages
AMP disponibles sur une requête.
La fraicheur est un critère mais ce
n’est pas le seul.
Critères de ranking proches de
ceux des Google NewsBox
51. #SEOCamp @largow
AMP et la question des urls
Url éditeur :
https://www.monsite.tld/article/amp
Url Cache :
https://www.monsite.tld.cdn.ampproject.org/c/http://www.monsite.tld/article/amp
Url Viewer :
https://www.google.com/amp/www.monsite.tld/article/amp
Toutes les explications sur le site AMP HTML : http://bit.ly/2kTa65X
54. #SEOCamp @largow
AMP et la question des urls
Url Cache Url Viewer Url éditeur
Toutes les explications sur le site AMP HTML : http://bit.ly/2m64MMh
Sert à Google à
valider les pages
AMP avant de les
délivrer et à bloquer
celles qui sont KO
Prévention attaques
XSS
Optimisation des
images pour rduire
le temps de load
Obligatoire pour gérer
l’historique dans le
navigateur (refresh,
précédent/suivant)
Contrainte de sécuité
des navigateurs
L’url source qui est
utilise pour les
partages sociaux, les
liens et affichée en
version « domaine »
dans le viewer
55. #SEOCamp @largow
AMP Cache : d’autres solutions que Google arrivent
https://blog.cloudflare.com/accelerated-mobile/
57. #SEOCamp @largow
Plus de 60 ad networks compatibles
90% des publishers observent un CTR en augmentation
80% des publishers observent une « ad viewability » en
augmentation.
Tout ce qu’il faut pour monétiser…
58. #SEOCamp @largow
Contrôle complet sur la commercialisation
Beaucoup d’ad servers compatibles
MAIS
Les agences média sont frileuses
Pas de data first party pour le ciblage
Interstitiels et habillages publicitaire interdits
Header bidding (programmatic advertising) impossible
… Mais une monétisation encore compliquée
60. @largow / @gbournizien
Extension au ecommerce (product & product listing pages), aux
annonces immobilières, aux chansons et aux recettes de cuisine
#SEOCamp @largow
63. @largow / @gbournizien
AMP dans Google News, gestion du paywall (contenus payants)
#SEOCamp @largow
Sites non AMP de fait pénalisés en visibilité par leur absence du carrousel
66. @largow / @gbournizien
Carrousel dédié « live » tout en haut de page
sur les sujets très chauds
#SEOCamp @largow
Pour y être, il faudra utiliser l’api Google indexing (cache CDN Google obligatoire).
67. @largow
Google enterre l’App Indexing
#SEOCamp @largow
« Users searching from mobile devices
will be directed to the relevant AMP
pages even if an equivalent app page
exists. »
Google
68. Redesign du « viewer » AMP
@largow / @gbournizien
Ajout d’une croix
pour fermer
#SEOCamp @largow
Bandeau passé de bleu vif à gris
69. Bing entre dans la danse
@largow / @gbournizien
#SEOCamp @largow
Source image : Search Engine Land
70. Et aussi
@largow / @gbournizien
Multi size ads pour une même emplacement pub
Nouveaux formats pub
Outils d’A/B Testing
Tracking Analytics plus poussé
Etc.
La plateforme évolue très très vite. Et bien.
#SEOCamp @largow
73. Mes blogs
Café Numérique
Digital Marketing Caféine
http://www.cafe-numerique.com
Café Référencement
La pause SEO qu’il vous faut
http://www.cafe-referencement.com
@largow