Le « référencement mobile » est un terme à la mode, souvent galvaudé. Nous parlions il y a peu du label « mobile-friendly ». Que se cache-t-il derrière cette nouvelle expression ? Quelles sont les méthodes du SEO mobile ? Y-a-il un rapport avec les applications mobiles ? Autant de questions essentielles auxquelles nous allons tenter de répondre.
De l’importance du mobile
Les études statistiques nous offrent des chiffres divers et variés. Les nombreuses sources, la plupart du temps américaines, font état de chiffres relatifs au mobile très importants : plus de 60% de visites générées par des mobiles …
D’après nos propres constatations (statistiques sur l’année 2014 entière, pour la France) :
Site BtoB (par exemple un site de référenceur ou un centre de formation) :
- Desktop : 90%
- Mobile : 7%
- Tablet : 3%
Site e-commerce BtoC (moyenne constatée sur nos propres clients) :
- Desktop : 66%
- Mobile : 20%
- Tablet : 14%
Il est cependant certain que ces chiffres sont en constante hausse et que notre utilisation du mobile en est encore à l’âge de pierre face à des pays tels que la Chine. Ce dernier, grâce à des services tels que WeChat, Taobao, Tmall, est un « ultra-utilisateur intensif » du mobile en zone urbaine. Si ce rouleau-compresseur oriental préfigure de notre avenir numérique, il est certain que notre utilisation du mobile va exploser.
Définition du référencement mobile
Google personnalise en effet ses résultats de recherche en fonction de la géolocalisation, du navigateur utilisé, de la langue utilisée, de l’historique de navigation, etc. Mais surtout pour le sujet qui nous intéresse ici, en fonction du type d’appareil que vous utilisez.
L’algorithme de Google est le même pour le desktop que pour le mobile. Il n’existe donc pas à proprement dit de « référencement mobile ». Cependant, les bots de Google visitent votre site de toutes les manières possibles, notamment en version mobile (Googlebot-Mobile). Vous pouvez faire le test depuis votre Google Webmaster Tools en choisissant dans la partie « explorer comme Google » la version « mobile ». Consultez également notre article sur l’optimisation mobile grâce à Google Webmaster Tools.
Quel est l’objectif de Google ? Comme beaucoup d’entreprises à actionnariat, faire un maximum de bénéfices.
Comment y parvient-il ? En faisant le maximum de chiffre d’affaires > en vendant le maximum de publicités et en contrôlant la big data > en ayant un maximum de trafic > en contentant ses utilisateurs. C’est donc en contentant ses utilisateurs qu’il fera le maximum de bénéfices. Comment contente-t-il ses utilisateurs ? En leur proposant des résultats de requêtes adaptées à leurs besoins. Ainsi, le meilleur résultat de recherche sur un mobile est … un site mobile ! La définition du référencement mobile pourrait donc être :
Ensemble des méthodes permettant une visibilité accrue des sites WEB sur les supports mobiles.
Il faut alors distinguer 2 types de référencement mobile, comme on le fait pour le référencement « traditionnel » :
Le référencement mobile naturel
Il s’agit ici de SEO, avec en plus une couche technique intrinsèque au mobile.
Le référencement mobile publicitaire
Il s’agit ici de SEA, segmenté sur le mobile. Il est en effet possible sur la plupart des plateformes publicitaires (Adwords, Facebook Ads, …) de ne cibler que les mobiles.
Exemples d’optimisations techniques pour le référencement mobile
Avant tout, constatons qu’il existe plusieurs manières d’afficher correctement un site WEB sur un mobile.
Le site mobile
Si vous optez pour le site mobile, vous aurez un site WEB « classique », en version desktop, et un autre site dédié à l’affichage sur smartphones. Cela se concrétise par un site disponible sur le www. Et un autre sur le m.
Exemple :
http://m.zalando.fr/ et http://www.zalando.fr/
Allez sur la version mobile du site et vous constaterez, si vous faites partie des 90% d’internautes qui nous consultent en mode desktop, que le format n’est de toute évidence pas adapté à votre écran. Sur cette version, nous allons retrouver plusieurs paramètres récurrents sur les sites mobiles, notamment au niveau des métas :
<meta name= »apple-mobile-web-app-capable » content= »yes »/><meta name= »viewport » id= »viewport » content= »width=device-width,minimum-scale=1.0,maximum-scale=1.0,initial-scale=1.0″ />
Mais surtout la présence d’une canonical :
<link rel= »canonical » href= »http://www.zalando.fr/ » />
En effet, le principal risque d’opter pour une version mobile, en sus de la version desktop, est d’être confronté à un problème de duplication de contenu (puisque vous avez 2 sites, avec 2 URLs différentes, qui ont sensiblement le même contenu). La canonical permet donc d’indiquer aux moteurs de recherche que la page de référence pour le contenu présentement affiché est celle avec l’URL en www, ce qui vous évitera toute pénalité de la part de Google.
Notez également que sur la plupart de ces sites, on utilise ne serait-ce que pour les icones des images au format SVG.
Site avec responsive design
La meilleure façon d’éviter cette duplication de contenus, de faire dans la simplicité puisque vous n’avez plus alors qu’un seul et unique site WEB, c’est le responsive design. Les blocs de contenus y sont tout simplement prévus pour se redimensionner, apparaitre ou disparaitre, ou encore pour se placer côte à côte ou les uns en dessous des autres en fonction de la taille de la fenêtre de navigation. Le meilleur exemple est le site sur lequel vous êtes actuellement présent : https://www.la-revanche-des-sites.fr réduisez la taille de votre fenêtre de navigation progressivement : les éléments de la page se réordonneront en fonction de la largeur que vous leur laissez.
Site avec dynamic serving
Le dynamic serving est une solution intermédiaire. L’idée est de présenter une seule page WEB quel que soit le device, mais de n’afficher que les éléments adaptés en fonction du « user-agent » qui demande à afficher la page. Pour ce faire, il faut que la page WEB soit munie d’un en-tête http « Vary ». Pour détecter les différents devices utilisés, différents codes peuvent être mis en place. Vous en trouverez des exemples sur les sites suivants :
Il s’agit donc là de « RESS », pas de « Lazy loading » (méthode qui consiste à charger les éléments de la page uniquement lorsqu’ils sont effectivement utilisés). Le lazy loading est souvent associé au dynamic serving à tord, bien qu’il soit complémentaire et bénéfique pour le temps de chargement de la page.
Un bon exemple de lazy loading : http://m.leroy-merlin.fr/
Notons que l’adresse http://m.leroy-merlin.fr/ redirige en 301 vers http://www.leroymerlin.fr/?showSite=mobile. Il y a en plus ici un cookie avec la variable site=mobile. Donc même si vous retournez ensuite sur www, vous êtes sur la version mobile.
Un autre avantage important de cette solution est que si vous transférez l’adresse depuis votre mobile, c’est celle en www, contrairement à Zalando où vous transférez l’URL mobile. En sachant que l’utilisation nomade du mobile se prolonge souvent sur ordinateur, pour la finalisation de l’acte d’achat ou une recherche plus approfondie, on comprend l’intérêt qu’une seule URL soit correctement retranscrite quel que soit le device.
Référencement d’applications mobiles
Effectivement, la terminologie n’est pas bien définie pour l’heure dans chaque esprit et on confond en général « référencement mobile » et « référencement d’applications mobiles ». Au cas où vous seriez venu pour cela, nous allons donc nous permettre cette parenthèse. Google, nous serons d’accord, peut à minima référencer les contenus présents sur les landing pages qui proposent éventuellement le téléchargement de ses applications.
Il est également possible, sur Android pour l’heure, d’obtenir dans les SERPs de Google un résultat avec le lien non pas vers le site WEB « traditionnel » ou le site mobile, mais directement vers l’application mobile que vous auriez déjà installé sur votre smartphone : https://developers.google.com/app-indexing/webmasters/details
Egalement possible : lors de l’affichage de votre page WEB, proposer le téléchargement de l’application correspondante. Un encart vient alors se positionner dans le header grâce à la balise meta « apple-itunes-app » par exemple pour les iphones. Essayez par exemple d’aller depuis votre iphone sur le site zalando. L’application est proposée grâce à : <meta name= »apple-itunes-app » content= »app-id=585629514″/> <link rel= »apple-touch-icon-precomposed » href= »http://skin2.ztat.net/s/0ha/zalando/img/MOBILE/apple-touch-icon-precomposed.png » />
Notons enfin que des rich snippets existent également pour baliser les contenus relatifs aux applications mobiles.
Références :
Support Google sur l’ergonomie mobile : https://support.google.com/webmasters/answer/6101188
https://developers.google.com/webmasters/mobile-sites/mobile-seo/configurations/dynamic-serving?hl=fr
Un outil pour visulaliser un site WEB sur tous les devices : http://quirktools.com/screenfly/
