Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.

0

Share

Download to read offline

2018 le seo à l heure du mobile first index

Download to read offline

A l'heure ou Google bascule son index en mode "mobile first", il est important de comprendre qu'en 2018 la version visible en usage mobile est devenue la plus importante du site pour le référencement.
La conférence a passé en revue les prérequis pour qu'un site soit bien référencé en usage de recherche mobile, et sur les dernières techniques pour être bien référencé.

Related Books

Free with a 30 day trial from Scribd

See all

Related Audiobooks

Free with a 30 day trial from Scribd

See all
  • Be the first to like this

2018 le seo à l heure du mobile first index

  1. 1. 2018, Mobile et SEO : adaptez votre site aux dernières évolutions de Google Philippe Yonnet CEO & fondateur Agence Search Foresight
  2. 2. Programme de la conférence 35 mn + 10 mn de questions 2 Présentation du Speaker Conclusion Search-Foresight Etre mobile friendly La recherche vocale Les Progressive Web Apps (PWA) #S4sight @s4sight #GEN La Speed UpdateLe Mobile First Index La montée en puissance des usages mobiles Les pages AMP
  3. 3. La montée en puissance des usages mobiles
  4. 4. L’ÉVOLUTION DE L’USAGE Nos usages évoluent et Google adapte en conséquence son algo 4
  5. 5. Selon Médiamétrie 5
  6. 6. AXA DRIVECAPITAINE TRAIN MEETIC FOODCHERIROBIN HOOD ZIPJET Des business models “Mobile Only” émergent
  7. 7. Les 2 modes d’usage multi-écran - 7 - Usage Séquentiel Passer d’1 écran à l’autre pour effectuer une tâche Usage Simultané Utiliser différents écrans pour un usage complémentaire ou non Multi-tasking – Activités différentes Usage Complémentaire – Activités reliées Source : Think With Google
  8. 8. 8
  9. 9. C’est plus grave que vous ne le pensez ! 9 Le mobile s’immisce partout !
  10. 10. La priorité : Etre mobile friendly selon les critères de Google !
  11. 11. - 11 - Vérifiez la compatibilité mobile de votre site  https://www.google.com/webmaster s/tools/mobile-friendly/  Ne pas regarder pagespeed insights  Les principaux points d’attention  Usage de plugins interdits :  Présence d’une balise viewport (conf de la fenêtre d’affichage)  Adaptation du contenu à la taille de l’écran • Attention aux images  Adaptation des CSS (texte trop petit, éléments trop rapprochés)
  12. 12. - 12 - Nouveau critère : les « popups intrusifs »  Depuis le 10 janvier 2017, la présence d’insterstitiels intrusifs conduit au déclassement de vos pages sur smartphone.
  13. 13. La recherche vocale change l‘expérience de recherche et les algorithmes de classement
  14. 14. Se transformer en moteur de réponses
  15. 15. “we’re trying to get you direct answers to your queries because it’s quicker (…) than the ten blue links Google used to show.” “This is especially important on mobile (…).” 09/2014
  16. 16. S’adapter à la transformation des recherches via mobile et vocal
  17. 17. 2020Tous Devices 50%
  18. 18. Voice Everywhere
  19. 19. De la recherche au conversationnel Amazon Echo
  20. 20. Google Home
  21. 21. Qu’est-ce que ça peut changer en SEO ? Référencer et positionner un site dans un index Insérer sa réponse dans une conversation ! Insérer les mots clés des requêtes populaires dans ses pages d’atterrissage Créer une page qui soit la meilleure réponse possible à une question de l’internaute
  22. 22. 2018 : Le passage au mobile first index
  23. 23. Qu’est ce que le Mobile First Index ? Index primaire mobile Afin d’améliorer l’expérience utilisateur, Google souhaite améliorer son index mobile ainsi que ses résultats de recherches mobiles en indexant prioritairement la version mobile d’un site. Genèse du projet 23
  24. 24. Déploiement en cours Google a commencé avec les sites pour lesquels il savait que que l’impact va être minime (sites responsive) Combien de temps va prendre la bascule ? On n’en sait rien, et Google avance « sur des œufs » Tous les sites n’ont pas encore basculé Déploiement prudent et progressif 24
  25. 25. Comment savoir si on a basculé ? 25 Déploiement du Mobile First Index Méthode 1 : regarder ses logs Si Googlebot mobile crawle plus de pages que Googlebot mobile : le site a basculé, ou est en train de basculer Seule méthode possible si le site est responsive Méthode 2 : regarder ses snippets si les balises sont différentes (site en m.) Méthode 3 (la plus sûre): regarder les messages de sa Google Search Console
  26. 26. Prérequis pour le mobile first Avoir un contenu identique Le contenu visible sur desktop doit être 100% présent sur mobile: que ce soit pour les robots ou pour les utilisateurs, les contenus des deux versions doivent être les mêmes. Les systèmes de cloaking sont bien évidemment à bannir. Principe de base : contenu 26
  27. 27. Prérequis pour le mobile first Contenu masqué : onglets et accordéons Le contenu caché mais potentiellement visible dans une page (onglets, accordéons, roll over...) sera traité, lors du lancement du projet Mobile First, comme du texte visible "normal". Le seul impératif est que l’internaute doit pouvoir découvrir le contenu par un clic. Confirmation de John Mueller via un hangout (juillet 2017) Rappelons qu'aujourd'hui, ce texte potentiellement visible est indexé, mais avec un poids moins fort. Cette perte de poids n'existera donc plus avec Mobile First. Déclaration officielle Google sur le contenu caché 27
  28. 28. Prérequis pour le mobile first Autoriser le crawl de la version mobile Les ressources ne doivent pas être bloquées aux Googlebot mobile : en effet, il est courant d’avoir des sites bloquant les fichiers JS et CSS. Cela fait quelque temps que Google nous invite à ne pas le faire. C’est encore plus important d’éviter de le faire surtout si ces fichiers statiques sont utiles à l’affichage de votre rendu mobile. Principe de base : crawl 28
  29. 29. Prérequis pour le mobile first Pas de changement notable à prévoir pour l’implémentation des balise rel=canonical (version desktop) et les alternate (vers mobile) Google vous invite à conserver le système du balisage et des canonicales (vers la version desktop) et alternates vers la version mobile ne changent pas cas des sites mobiles dédiés : m.domaine.com ou mobile.domaine.com site mobile dédié 29
  30. 30. Prérequis pour le mobile first Auditer votre site mobile avec la Search Console Inscrivez votre site mobile pour être averti des dysfonctionnements (erreurs de crawl, bot bloqué, actions manuelles, problèmes ergonomiques ou microdatas.) site mobile dédié 30
  31. 31. Prérequis pour le mobile first Optimisez vos performances Voici les 3 critères de votre site mobile que vous devez évaluer Time to First Byte < 200ms Temps de téléchargement HTML < 500ms Temps de rendition < 2 secondes temps de chargement 31
  32. 32. Prérequis pour le mobile first Les Micro-datas un sont un MUST HAVE sur Mobile Si vous avez omis le balisage sur mobile, alors qu’elles sont bien implémentées sur desktop, vous perdrez vos résultats enrichis dans les SERPS (résultats de recherche). Si vous êtes en version responsive, vos micro datas sont implémentés, pas besoin de faire deux fois le travail. Principe de base : données structurées 32
  33. 33. Faites la chasse aux pubs intrusives 33 Chrome bloque des publicités classées comme trop intrusives selon les standards de la "Coalition for Better Ads" Ne placez pas des overlays qui s’affichent lors de la première visite (overlay de téléchargement) Googlebot les voit à chaque visite, car il ne stocke pas les cookies ! Les formats bloqués dorénavant par Chrome Avertissement affiché par Chrome quand une publicité intrusive est détectée
  34. 34. Prérequis pour le mobile first Pas de changement notable à prévoir aussi pour l’AMP Spécificité > site mobile dédié Principe de base : AMP 34
  35. 35. Prérequis pour le mobile first Linking externe À date, nous avons peu d’information de la part de Google ! On sait simplement que les liens s’obtiennent rarement sur une version mobile d’un site. Les fondements de l’algorithme seront toujours concentrés autour de la popularité et donc de celle acquise sur votre version desktop. Principe de base : AMP 35
  36. 36. Juillet 2018 : La speed update
  37. 37. Juillet 2018 C’était déjà le cas sur Desktop Mais pas sur mobile. Ce n’est même pas un problème pris en compte dans le mobile friendly test Il a fallu attendre une plus grande fiabilité des outils de mesure de la performance par Google Mise à jour des outils Pagespeed https://webmasters.googleblog.com/201 8/01/using-page-speed-in-mobile- search.html La vitesse de chargement est devenu un critère de classement sur mobile 37
  38. 38. Pensez à vos utilisateurs d’abord Avoir de meilleurs performances dope la conversion sur mobile Avoir de mauvaises performances vous fait perdre des visiteurs et des clients Si vos concurrents ont des vitesses de téléchargement plus élevées, vos clients iront chez eux Ne travaillez pas vos performances juste parce que Google le veut ! 38
  39. 39. Suis-je impacté ? Les outils suggérés par Google pour savoir où vous en êtes côté performance Chrome User Experience Report https://developers.google.com/web/to ols/chrome-user-experience-report/ Lighthouse https://developers.google.com/web/to ols/lighthouse/ Pagespeed Insights https://developers.google.com/speed/p agespeed/insights/ Seuls les cancres ont subi des pertes de position 39
  40. 40. Google propose beaucoup d’outils sur la perf https://developers.google.com/web/f undamentals/performance/speed- tools/pdf/Infographic- How_To_Think_About_Speed_Tools.pdf https://developers.google.com/web/f undamentals/performance/speed- tools/ Pour y voir clair, il y’a cette infographie 40
  41. 41. Impact : sur les positions SEO, et le quality score 41
  42. 42. Les pages AMP
  43. 43. Le projet AMP pour accélérer l’expérience mobile Lancé fin 2015, le format AMP (accelerated mobile pages) permet un affichage quasi-instantané des contenus sur mobile via leur mise en cache dans un CDN Google, et un code optimisé et un contenu optimisé Au départ réservé aux sites media, ce format est maintenant ouvert aux sites e-commerce. Ebay a été le 1er à l’adopter en juin 2016. Les résultats AMP apparaissaient uniquement dans un carrousel en haut de page ; depuis le 20 septembre 2016, on les retrouve mêlés aux résultats classiques. Nouveauté : les URL d’origine des pages seront utilisées lors des partages. Remplacement du site mobile et mort de l’App Indexing ? App Indexing Version Mobile AMP
  44. 44. Pour en savoir plus : http://www.ampproject.org 44
  45. 45. Augmentation de la part de l'AMP Pour une requête portant sur l'actualité, 7 résultats sur 10 sont au format AMP 70% AMP
  46. 46. Les principes Gains de perfomance X10 Code allégé Mise en cache Pré rendition / préchargement chez Google
  47. 47. Un code sérieusement allégé 47 Une page AMP contient 5 fois moins de trackers en moyenne qu’une page « normale », et un code 6 foix plus léger. Comment ? Des balises HTML « lourdes » interdites Une librairie javascript « couteau suisse » unique et allégée
  48. 48. Un CDN dédié Un CDN (content delivery network) est un ensemble de serveurs : • Conservant une version « en cache » de la page • Et répartis partout dans le monde, près des utilisateurs Google fournit le CDN dédié aux pages AMP Remarque : la mise en cache systématique rend la création de pages AMP entièrement dynamiques « server side » impossible Par contre, on peut créer des pages partiellement dynamiques 48
  49. 49. SEO : attention aux doublons La page AMP est un doublon quasi parfait du contenu de la page « normale » Il faut donc « canonicaliser » la page AMP Lien link rel=canonical pointant vers le contenu d’origine Au départ, Google recommandait de pointer vers la version desktop Avec le mobile first index : la recommandation reste la même ! Pourquoi ? Pour les autres moteurs ! 49
  50. 50. Adopter l’AMP : parce que c’est plus rapide Test fait en 2016 sur les pages responsive du Guardian, comparé avec la version AMP Le score Google pagespeed passe de 57% à 94% ! L’amélioration de l’UX est réelle et spectaculaire
  51. 51. Et l’impact, c’est plus de conversions 51
  52. 52. Et parce qu’il y’a un ranking boost ! Et donc un traffic boost parfois 52 Sur mobile, les carrousels AMP pour les news sont placés en tête des résultats (position zéro) Pour être présent dans ce carrousel, il n’est pas nécessaire d’être indexé dans google news, il faut juste le balisage schema.org ad hoc et des pages AMP Evidemment, cela met en valeur les pages AMP vs les pages « normales » Le gain maximal est atteint si on est dans la première case du carrousel
  53. 53. Et c’est vrai à l’international Les carrousels AMP envahissent les versions internationales de google 53
  54. 54. International : Baidu supporte l’AMP ! Son format MIP est devenu AMP compatible depuis le printemps 2017
  55. 55. De plus en plus de diffuseurs exploitent l’amp Les principales plateformes qui exploitent l’AMP en dehors de Google : Pinterest, LinkedIn, et Twitter 55
  56. 56. Quels sont les limitations de l’AMP ? L’AMP est rapide car il n’embarque qu’un certain nombre limité de fonctionnalités, certaines balises, scripts ou façon de codées sont volontairement interdites Conclusion : tout n’est pas supporté en AMP Au début : beaucoup de choses utiles voire indispensables n’étaient pas disponibles Mais aujourd’hui, toutes les briques utiles sont dispo en AMP ! Possibilité de faire 100% d’un site éditorial ou ecommerce en AMP Mais au prix de certaines concessions Changement d’outils de trackings, d’ad servers, de régies, de systèmes de paiement, ou de méthodes de conception Il y’en a, de moins en moins gênantes, et plus vraiment bloquantes 56
  57. 57. Les Progressive Web Apps
  58. 58. mSites & apps convergent http://blog.chromium.org/2015/03/chrome-42-beta-push-notifications_12.html OFFLINEPUSH NOTIFICATION APP INDEXING GOOGLE NOW ON TAP BOUTON “ADD TO HOMESCREEN” APP STREAMING
  59. 59. Qu’est ce que le PWA: Progressive Web App? Le meilleur des technologies du Web (HTML5) associées aux fonctionnalités des applications Les principaux avantages:  Un site web qui fonctionne sans connexion (comme une App)  Une application qui se référence sur Google (mieux qu’avec l’App Indexing)  Un outil avec un excellent temps de chargement  Un support interactif avec des notifications (comme une App)
  60. 60. Pourquoi les PWA sont intéressantes pour le SEO ? Les principaux avantages:  Google sait indexer de manière native une page provenant d’une PWA  Une page PWA s’optimise et se référence exactement comme une page web normale  Une PWA correctement indexée permet de capter efficacement un public via le search pour le fidéliser avec une app  Rappel : les recherches sur Google sont beaucoup, beaucoup plus importantes en volume que les recherches sur un App Store
  61. 61. Et l’app indexing alors ? Cela fonctionne toujours mais  Les pages d’app captent peu de clics dans la pratique  Manque de visibilité  Manque d’intérêt des utilisateurs  Sur mobile, entre une page AMP et son équivalent sur une APP, Google renvoie vers la page AMP  depuis le 21 sept. 2016  CONCLUSION :  L’ASO et l’App Indexing restent d’actualité  Mais le PWA a de réels avantages côté SEO
  62. 62. Mais il ne faut pas oublier les fondamentaux ?  Les PWA sont souvent trop souvent codées avec des technologies ou des approches qui posent des problèmes pour le référencement  Client Side Rendering  Problèmes de performance  Urls « Ajax » Mais ce n’est pas du tout une fatalité !  En principe, faire le choix d’une PWA apporte un plus pour le référencement, à condition de ne pas oublier les bonnes pratiques applicables aux sites web
  63. 63. Quels sont les points d’attention ? https://developers.google.com/web/progressive- web-apps/checklist
  64. 64. Et évidemment, n’oubliez pas les balises SEO ! 64
  65. 65. Les avantages du PWA: Le cas LANCÔME  Baisse de 84% du temps de chargement  Augmentation de 17% du taux de conversion  Diminution du taux de rebond de 15%  18% de taux d’ouverture des notifications  Accroissement de 12% du taux de conversion sur la récupération de panier via les notifications push.
  66. 66. Et Google recommande… Le mixte du PWA et l’AMP Google, recommande de cumuler les deux technologies: AMP + PWA = #PWAMP PWA va dans le sens de l’histoire AMP : c’est moins sûr => résoudre les problèmes de performance avec une approche « AMP like » peut être aussi efficace, plus universel et plus durable + PWA
  67. 67. Où en est-on du support des PWA ? Même safari se met bientôt aux Service Workers ! Rappel : ce n’est pas du tout ou rien, une PWA continue de fonctionner en mode dégradé en cas de support partiel (y compris sur Safari) https://ispwaready.toxicjohann.com/
  68. 68. Exemples de code https://hybrid-dot-indexable-pwa.appspot.com/
  69. 69. CONCLUSION
  70. 70. Conclusion Dorénavant, travaillez à fond la version mobile de vos sites, Testez l’AMP et pensez aux PWA (faites au moins un test, un POC) Exploitez tout le potentiel des données structurées Travaillez toute la chaine du SXO, et notamment les positions zéro et attention à la qualité Pensez performance, performance et encore performance Soyez la meilleure réponse possible à une recherche d’un internaute ! Adaptez vous ! 70
  71. 71. SF vous partage sa passion du Search Chaque semaine, de nouvelles ressources à votre disposition en exclusivité 71 Des prises de parole chaque semaine Un accès en avant première aux web-conférences Search Foresight et aux contenus de nos prises de parole pour vous transmettre notre expérience Des contenus de référence Des contenus exclusifs chaque semaine : Newsletter, Articles, Case study, Etudes… Une communauté de passionnés Partagez avec une communauté d’experts du Digital, du Search, du Webmarketing… Des évènements pointus Echangez et networkez lors de nos évènements exclusifs : Meet-up, Barcamp, Petits-déjeuners… https://www.search-foresight.com/blog_seo_sea/
  72. 72. 72 Merci ! Et maintenant, passons à vos questions
  73. 73. Restons en contact www.search-foresight.com 73 philippe.yonnet@search-foresight.com + 33 1 74 18 29 40 @s4sight Slideshare.net/S4sight Philippe Yonnet, Directeur Général et fondateur

A l'heure ou Google bascule son index en mode "mobile first", il est important de comprendre qu'en 2018 la version visible en usage mobile est devenue la plus importante du site pour le référencement. La conférence a passé en revue les prérequis pour qu'un site soit bien référencé en usage de recherche mobile, et sur les dernières techniques pour être bien référencé.

Views

Total views

363

On Slideshare

0

From embeds

0

Number of embeds

14

Actions

Downloads

8

Shares

0

Comments

0

Likes

0

×