Google AMP : le tour de la question

8 803 vues

Publié le

Qu’est ce que Google AMP, comment et pourquoi y figurer, quelles sont les erreurs à ne pas commettre et quels bénéfices peut-on en attendre ?
Si vous voulez avoir les réponses à toutes ces questions et disposer d’un premier bilan sur Google AMP, cette présentation est pour vous.

Publié dans : Internet
0 commentaire
23 j’aime
Statistiques
Remarques
  • Soyez le premier à commenter

Aucun téléchargement
Vues
Nombre de vues
8 803
Sur SlideShare
0
Issues des intégrations
0
Intégrations
4 178
Actions
Partages
0
Téléchargements
0
Commentaires
0
J’aime
23
Intégrations 0
Aucune incorporation

Aucune remarque pour cette diapositive

Google AMP : le tour de la question

  1. 1. Google AMP : mise en œuvre et 1er bilan
  2. 2. Google AMP 101 – SEO Camp’Us 2016 @largow
  3. 3. Google AMP 101 – SEO Camp’Us 2016 @largow A l’origine d’AMP, le besoin de résoudre un problème sur mobile
  4. 4. Google AMP 101 – SEO Camp’Us 2016 @largow Le discours officiel de Google
  5. 5. QU’EST CE QUE AMP ? 1
  6. 6. Google AMP 101 – SEO Camp’Us 2016 @largow Version responsive / desktop
  7. 7. Google AMP 101 – SEO Camp’Us 2016 @largow Version responsive / mobile Version AMP
  8. 8. Google AMP 101 – SEO Camp’Us 2016 @largow Fonctionnement de Google AMP + Cache
  9. 9. Google AMP 101 – SEO Camp’Us 2016 @largow Fonctionnement de Google AMP Source : Google Hangout du 07/03/2016
  10. 10. Google AMP 101 – SEO Camp’Us 2016 @largow L’usage du mobile explose
  11. 11. Google AMP 101 – SEO Camp’Us 2016 @largow 1 critère de ranking de + en + fort : Mobile friendly Source : Search Engine Watch
  12. 12. Google AMP 101 – SEO Camp’Us 2016 @largow Autre critère de ranking de + en + fort : Mobile friendly Source : Smart Insights
  13. 13. Google AMP 101 – SEO Camp’Us 2016 @largow Or, Google AMP c’est… 1. Un affichage quasi instantané 2. Une compatibilité mobile complète
  14. 14. Google AMP 101 – SEO Camp’Us 2016 @largow Pourquoi tant d’éditeurs passent à AMP ? Parce que leurs sites mobiles sont TRES lourds à charger
  15. 15. Google AMP 101 – SEO Camp’Us 2016 @largow Et qu’avec AMP on peut obtenir un rendu similaire au site mobile / RWD Page RWD Page AMP
  16. 16. GAINS DE PERFORMANCE 2
  17. 17. Google AMP 101 – SEO Camp’Us 2016 @largow HTML super light (standard) + Système de cache (CDN mis à dispo gratuitement) + Pre rendering depuis la SERP =
  18. 18. Google AMP 101 – SEO Camp’Us 2016 @largow Quel gain ? 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 »
  19. 19. Google AMP 101 – SEO Camp’Us 2016 @largow 15 à 85% de gain en vitesse d’affichage : Pourquoi de telles différences ? Cela dépend du nombre de formats pub, de tags de tracking et d’embed (vidéos, tweets,…) Attention, on est encore en “Test & Learn”. En fonction de l’évolution du framework et du nombre de tags acceptés, cela pourrait à terme se révéler moins performant à terme.
  20. 20. Google AMP 101 – SEO Camp’Us 2016 @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
  21. 21. COMMENT CA MARCHE ? 3
  22. 22. Google AMP 101 – SEO Camp’Us 2016 @largow Source : Google Hangout du 07/03/2016
  23. 23. Google AMP 101 – SEO Camp’Us 2016 @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  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">
  24. 24. Google AMP 101 – SEO Camp’Us 2016 @largow Des possibilités étendues de personnalisation  On peut obtenir à peu près tous les rendus possibles en CSS  On peut inclure des embed en iframe  On peut inclure de la pub  On peut inclure des rebonds contextuels
  25. 25. Google AMP 101 – SEO Camp’Us 2016 TECHNOLOGIES PARTENAIRES @largow
  26. 26. Google AMP 101 – SEO Camp’Us 2016 @largow Technologies partenaires : CMS
  27. 27. Google AMP 101 – SEO Camp’Us 2016 @largow Technologies partenaires : Analytics https://www.ampproject.org/docs/reference/extended/amp-analytics.html
  28. 28. Google AMP 101 – SEO Camp’Us 2016 @largow Technologies partenaires : Ad Servers + de 20 ad servers partenaires en tout https://www.ampproject.org/docs/reference/amp-ad.html#supported-ad-networks
  29. 29. Google AMP 101 – SEO Camp’Us 2016 @largow Technologies partenaires : Native Advertising
  30. 30. Google AMP 101 – SEO Camp’Us 2016 @largow Technologies partenaires : Plateformes vidéo
  31. 31. Google AMP 101 – SEO Camp’Us 2016 @largow Technologies partenaires : Plateformes tierces
  32. 32. Google AMP 101 – SEO Camp’Us 2016 @largow https://www.ampproject.org/who/
  33. 33. MISE EN OEUVRE 4
  34. 34. Google AMP 101 – SEO Camp’Us 2016 @largow Un projet Open Source … Work in Progress
  35. 35. Google AMP 101 – SEO Camp’Us 2016 @largow Des limitations  Interstitiels et formulaires sont interdits  Fichier CSS commun à toutes les pages AMP inférieur à 50 ko  https est obligatoire  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.
  36. 36. Google AMP 101 – SEO Camp’Us 2016 @largow Adapter le code issu du wysiwyg pour tout le contenu riche Des composants sont disponibles pour gérer ces cas : Tous les composants : https://www.ampproject.org/docs/reference/extended.html 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
  37. 37. Google AMP 101 – SEO Camp’Us 2016 @largow https://www.ampproject.org/
  38. 38. Google AMP 101 – SEO Camp’Us 2016 OUTILS @largow
  39. 39. Google AMP 101 – SEO Camp’Us 2016 @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
  40. 40. Google AMP 101 – SEO Camp’Us 2016 @largow Etape 1 : validation en développement http://tools.maxxeight.com/amp-html/
  41. 41. Google AMP 101 – SEO Camp’Us 2016 @largow Etape 2 : validation en recette http://technicalseo.com/seo-tools/amp/
  42. 42. Google AMP 101 – SEO Camp’Us 2016 @largow Etape 3 : validation du microformat NewsArticle, Article, BlogPosting ou VideoObject https://developers.google.com/structured-data/testing-tool/
  43. 43. Google AMP 101 – SEO Camp’Us 2016 @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
  44. 44. Google AMP 101 – SEO Camp’Us 2016 @largow Pages AMP en erreur ? Tu sors ! Une page AMP ne sera pas acceptée tant qu’elle comportera une erreur, aussi petite soit t’elle.
  45. 45. Google AMP 101 – SEO Camp’Us 2016 @largow Suivez-moi sur Twitter https://twitter.com/largow
  46. 46. Google AMP 101 – SEO Camp’Us 2016 DEPLOYER AMP SUR WORDPRESS, JOOMLA ou DRUPAL @largow
  47. 47. Google AMP 101 – SEO Camp’Us 2016 @largow https://wordpress.org/plugins/amp/
  48. 48. Google AMP 101 – SEO Camp’Us 2016 @largow https://wordpress.org/plugins/pagefrog/
  49. 49. Google AMP 101 – SEO Camp’Us 2016 @largow https://wordpress.org/plugins/pagefrog/
  50. 50. Google AMP 101 – SEO Camp’Us 2016 @largow https://weeblr.com/joomla-accelerated-mobile-pages/wbamp
  51. 51. Google AMP 101 – SEO Camp’Us 2016 @largow https://www.drupal.org/project/amp
  52. 52. OÙ TROUVER LES PAGES AMP 5
  53. 53. Google AMP 101 – SEO Camp’Us 2016 @largow Pour l’instant, les pages AMP ne remontent que dans le carrousel Pour être dans le carrousel il faut :  Une page AMP valide  Des meta data valides Pas réservé aux sites « Google News » mais en pratique pour le moment quasiment seuls les sites qui y sont listés rankent…
  54. 54. Google AMP 101 – SEO Camp’Us 2016 @largow … A quelques exceptions près. Image : @eseoref
  55. 55. Google AMP 101 – SEO Camp’Us 2016 @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 de Google News Box ?
  56. 56. Google AMP 101 – SEO Camp’Us 2016 @largow Parfois les pages AMP peuvent d’afficher ailleurs que dans le carrousel
  57. 57. Google AMP 101 – SEO Camp’Us 2016 @largow Une fois la phase d’exploration initiale terminée, seuls les nouveaux articles (moins de 30 jours ?) semblent rester indexés. Source : Search Console
  58. 58. QUELLE AUDIENCE ? QUELS GAINS/RISQUES EN SEO ? 6
  59. 59. Google AMP 101 – SEO Camp’Us 2016 @largow Selon John Mueller, AMP n’est pas un ranking factor.
  60. 60. Google AMP 101 – SEO Camp’Us 2016 @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.
  61. 61. Google AMP 101 – SEO Camp’Us 2016 @largow Perspectives d’audience Trafic qui peut être fort sur un article unitaire mais sur le global pour le moment, audience limitée. => Il faut attendre que beaucoup d’éditeurs rejoignent AMP pour déclencher le carrousel sur beaucoup plus de requêtes longue traîne.
  62. 62. Google AMP 101 – SEO Camp’Us 2016 @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
  63. 63. Google AMP 101 – SEO Camp’Us 2016 @largow Pas de duplicate content natif si les canonical sont en place Les urls sous la forme : http://amp.monsite.fr ou www.monsite.fr/mon-article/amp ou www.monsite.fr/mon-article?amp ne sont pas rankées autrement que via le carrousel AMP et a priori pas indexées Ou presque…
  64. 64. Google AMP 101 – SEO Camp’Us 2016 @largow
  65. 65. Google AMP 101 – SEO Camp’Us 2016 @largow
  66. 66. Google AMP 101 – SEO Camp’Us 2016 @largow La problématique Domain Authority subsiste L’autorité de votre ndd pourrait pâtir d’AMP sur la durée, car les backlinks vont aller sur la version Google cache de la page AMP et non sur celle hébergée sur votre site
  67. 67. Google AMP 101 – SEO Camp’Us 2016 @largow Les audiences AMP sont non comptabilisées Mediamétrie Car la page vue est faite sur le domaine Google et non sur celui de l’éditeur
  68. 68. QUELLE MONETISATION ? 7
  69. 69. Google AMP 101 – SEO Camp’Us 2016 @largow Une monétisation encore balbutiante  Contrôle complet sur la commercialisation  Beaucoup d’ad servers compatibles MAIS  Pour le moment peu d’audience donc difficulté à monétiser  Pas de data first party pour le ciblage  Interstitiels et habillages publicitaire interdits  Header bidding (programmatic advertising) impossible  Paywalls non pris en charge
  70. 70. LE FUTUR 8
  71. 71. Google AMP 101 – SEO Camp’Us 2016 @largow Nouveautés à venir pour AMP  AMP pour les services et le ecommerce ? Infos contradictoires de Google sur le sujet.  Sites non AMP pénalisés en visibilité par leur absence du carrousel  Contenus AMP payants via la prise en charge des paywalls  Améliorations des possibilités publicitaires  Arrivée de nouveaux partenaires technologiques  Pages AMP ailleurs que dans le carrousel, voire dans d’autres produits Google.  Déploiement sur un nombre de requêtes beaucoup plus large …
  72. 72. Google AMP 101 – SEO Camp’Us 2016 @largow Navigation par catégories actuellement testée aux US
  73. 73. Google AMP 101 – SEO Camp’Us 2016 @largow Contenus Google Podium dans le carrousel
  74. 74. Google AMP 101 – SEO Camp’Us 2016 @largow Vers une nouvelle donne de la distribution du contenu web
  75. 75. Google AMP 101 – SEO Camp’Us 2016 @largow Vers une nouvelle donne de la distribution du contenu web
  76. 76. Google AMP 101 – SEO Camp’Us 2016 @largow Vers une nouvelle donne de la distribution du contenu web
  77. 77. Google AMP 101 – SEO Camp’Us 2016 @largow Vers une nouvelle donne de la distribution du contenu web
  78. 78. Google AMP 101 – SEO Camp’Us 2016 @largow AMP, y aller ou pas ? La question se pose et la réponse dépend de la marque concernée. Payant aujourd’hui sur les golden keywords et l’actu ultra chaude… à condition d’être bon en SEO AMP  Et demain ??
  79. 79. Google AMP 101 – SEO Camp’Us 2016 Mes blogs Café Numérique Le décryptage Digital Medias http://www.cafe-numerique.com/ Café Référencement La pause SEO qu’il vous faut http://www.cafe-referencement.com
  80. 80. Et sur les réseaux sociaux :Contact : virginie@largow.com Mobile : 06 27 26 67 08 Virginie Clève Digital Strategist @largow www.largow.com #GrowthMarketing #SocialMedia #Product #SEO #Mobile #ASO #Medias #ContentDistribution

×