SEO & Responsive : Le cas de la diffusion dynamique

Le Responsive Web Design (RWD), consiste, en quelques mots, à concevoir et à développer un site unique qui s’adaptera sur plusieurs résolutions d’écran tout en optimisant son contenu. La conception de ce procédé vous permettra d’optimiser votre expérience de navigation, créant une page web réactive et flexible, optimisée pour le dispositif qui y accède.
Le SEO (Optimisation pour les moteurs de recherche), quant à lui, est une stratégie pour optimiser le contenu et la structure de votre site internet. Il permet, entre autres, de favoriser la compréhension du contenu de vos pages web par les moteurs de recherche, et d’atteindre un classement élevé dans les résultats de recherche.
Afin d’améliorer sa présence dans les résultats de recherche Google, les étapes primordiales seront de concevoir un contenu de qualité, de gérer les balises et les métadonnées du site, ainsi que les backlinks. Le but des moteurs de recherche étant de fournir des résultats pertinents pour les utilisateurs, il est important de savoir optimiser son site internet.
L’internaute passe en moyenne 4 fois moins de temps sur internet depuis son mobile que sur son ordinateur de bureau. L’information doit donc être visible rapidement, claire, et proposer une navigation fluide/adaptée au support. Les solutions pour proposer des expériences uniques aux utilisateurs sur leur terminaux ont donc le vent en poupe, mais se doivent d’être les plus intéressantes possibles pour répondre aux besoins des utilisateurs, ainsi qu’au SEO.

Savoir profiter de l’occasion quand il le faut

Capture d’écran 2015-05-29 à 10.32.27
Il existe actuellement trois méthodes pour répondre à cette tendance de l’adaptation tout support:

  • Le Responsive Web Design présenté précédemment,
  • Le Dynamic Serving, qui sur une même adresse va chercher un fichier dédié en fonction du terminal,
  • Le site dédié, où ici le but est de développer une autre site, dédié seulement pour les terminaux mobiles.

Le Responsive va donc se baser sur un seul type de contenu, mis en forme seulement par la feuille de style et la taillle du viewport, alors que le Dynamic Serving et le site dédié vont proposer quant à eux des pages différentes selon le terminal.
D’une façon générale, Google prône l’utilisation du Responsive, mettant en avant le côté pratique de la maintenance et la rapidité d’accès. De plus pour ce qui est du contenu de votre site, le responsive tend à répondre et à se généraliser sur la demande/besoin des utilisateurs. Mais qu’en est-il de la visibilité et de l’accès à votre url sur les moteurs de recherches ?

S(e)o Responsive

Capture d’écran 2015-05-29 à 10.32.35
Bien se placer dans le positionnement des moteurs de recherche revient à titiller celui-ci, lui donner ce qu’il attend, et justement, Google est friand du Responsive. Il le recommande non seulement, mais le favorise aussi dans ses résultats de recherche pour les sites souhaitant être optimisé pour les smartphones (notamment via l’algorithme Hummingbird, procédant au principe de recherche sémantique).
De plus, comme le ResponsiveWeb Design se concentre sur une seule URL pour les versions mobile et desktop, elle va donc bénéficier de tous les backlinks et liens internes, et ne sera donc pas dispersée vers une autre URL (dédiée à une version mobile, de type m.ux-republic.com).
NOTE : De plus, les sites mobiles dédiés peuvent parfois poser des problèmes dans l’indexation de recherche. L’exemple le plus concret serait celui de e-commerçants connus en France, qui n’auraient vu qu’une partie de leur catalogue indexée sur une version mobile. L’internaute pouvait lancer une requête, et se retrouver sur un site non optimisé pour le mobile, plus lourd à charger, dégradant donc l’expérience utilisateur.
Enfin, le responsive va permettre d’abaisser le taux de rebond dans les moteurs de recherche, et garantir aux internautes de recevoir les informations qu’ils recherchent dans la forme la plus adaptée. Le taux de rebond rentre en compte dans le bon positionnement de votre site.
Un site responsive apporte donc des avantages non négligeables que ce soit au niveau de l’expérience utilisateur, du référencement, et du coût de développement. Pour autant, une solution responsive est-elle toujours préférable à un site mobile dédié ?

“Make it work, make it right, make it fast” (Kent Beck)

Capture d’écran 2015-05-29 à 10.32.41
Avant de prendre une décision stratégique, il faut avant tout se poser la question la plus importante : Qu’est-ce que l’internaute veut faire sur mon site, depuis son mobile ?Il est important de centrer ses priorités sur l’intérêt de l’utilisateur.
Par exemple sur un site de commande alimentaire, je vais vouloir commander au plus près de chez moi, le plus rapidement possible. Je n’aurai en aucun cas besoin de connaître l’historique de cette entreprise ni sa date de création avant de parvenir à mes fins.
Sur un site de réservation je n’aurai pas non plus besoin d’autres choses que de pouvoir réserver facilement et rapidement sur le site mobile.
Un site dédié est donc parfois beaucoup plus pertinent et beaucoup plus ciblé sur les besoins principaux des utilisateurs qu’un site responsive qui, même si l’on considère la mise en forme remaniée pour le mobile, sera moins performant au niveau du traitement d’information. Et les internautes vous le rendront bien.
A contrario, nous pouvons donc définir que, si les besoins fonctionnels sont les mêmes sur desktop et mobiles, le choix du responsive semble adapté et peut être même inévitable aujourd’hui pour répondre aux exigences de l’internaute.
Mais que se passe-t-il si certains contenus doivent être générés dynamiquement selon le type de support ?

“Houston, We’ve had a problem” (Jack Swigert)

Pour répondre à cette question, nous pouvons avoir plusieurs approches différentes, selon le besoin et l’utilité d’un SEO :

  • Générer tout le contenu (mobile, tablette, web) lors de la détection des robots. Pour sûr, on couvre toutes les possibilités, mais malheureusement nous proposons aux internautes des résultats de recherche non pertinents selon le support utilisé.
  • Générer par défaut le contenu d’un type de support. Dérive du mobile First, nous pourrions nous dire que le robot ne gérera que le SEO pour mobile. On peut s’en sortir, mais on pourrait faire mieux pour les utilisateurs. Il semble incompatible aujourd’hui de ne pas répondre exactement à ce que veux un internaute et avoir un bon taux de rebond.
  • L’utilisation de navigateur Webkit, comme par exemple PhantomJS. Solution prônée dans la plupart des projets utilisant de nouveaux frameworks tels que AngularJS ou Backbone. C’est l’une des références actuellement pour palier au problème de SEO, avec Varnish en complément (serveur de cache).
    Seul problème : Dans le cas d’un projet à fort traffic, possédant déjà un moteur de rendu (et donc possibilité d’injecter des données lors de la détection de robot ), qui possède une architecture complexe, nous pourrions craindre de devoir modifier l’infrastructure pour ajouter ces nouveaux outils, et craindre le temps de latence.
  • L’HTTP En-tête Vary : Voici une autre possibilité concrète, couramment utilisé pour cacher plusieurs fois une même ressource sous différentes formes, elle pourrait intervenir dans la redirection vers un contenu précis selon le user Agent du Robot. Le problème étant de connaître tous les User Agents pour les robots, faire des cas d’exceptions et donc préparer une base de données, maintenable et mise à jour pour chaque moteurs de recherche et à chaque nouvelle version. Attention : Si vous proposez du contenu différents entre les utilisateurs et les robots, vous risquez de vous faire blacklister.

Chacune des propositions présentent donc de bonnes idées, mais aussi des défauts non négligeables. À partir de celles-ci, nous pourrions nous demander : “Qu’est-ce qui répond réellement à mes besoins ?”
Si aucune approche proposée ne vous convient, vous pouvez décider de retourner à la première étape de cette article, et opter pour une autre solution.

Le choix de la priorité

Car oui, un site responsive, c’est dans l’air du temps, à moindre coût, et réellement utile. Mais il faut savoir l’utiliser à bon escient, et pour le bon type de projet.
Votre stratégie sur l’optimisation mobile ne doit pas être indépendante de votre stratégie globale. Il faut déterminer comment le contenu doit être interprété sur les différents terminaux. Si vous avez besoin de proposer un contenu complètement différent selon le support, il va être préférable d’opter par exemple pour un site mobile distinct qui aura ses propres URL, différents de ceux des autres formats. Si les contenus sont générés dynamiquement, que vous ne voulez pas embarquer tout un système de reconnaissance du terminal côté serveur, ou de la récupération des User Agent, du maintien, des mises à jours, et que le SEO est primordial pour vous, alors il serait préférable d’opter pour un site dédié.
Néanmoins, si les périmètres de ce même projet se limite à l’option du Responsive …
Alors le mot d’ordre concernant le SEO se devrait d’être : le Compromis.
Plus d’info sur les bonnes pratiques mobiles ?
http://www.etourisme-feng-shui.com/2014/06/17/smxparis-les-bonnes-pratiques-a-retenir-pour-sa-strategie-mobile/
Chiffre Utilisation Internet :
http://ookawa-corp.over-blog.com/2014/05/tous-les-chiffres-2014-sur-l-utilisation-d-internet-du-mobile-et-des-medias-sociaux-dans-le-monde.html
http://www.servicesmobiles.fr/services_mobiles/mobile_chiffres/
http://www.blogdumoderateur.com/chiffres-internet/
http://www.blogdumoderateur.com/top-20-sites-applications-mobiles/
Responsive et SEO simple :
http://admaker.fr/blog/infographie-top-5-des-raisons-dadopter-le-responsive-web-design/
http://www.searchenginejournal.com/4-seo-benefits-responsive-web-design/92807/
http://www.mostlytruestuff.com/benefits-responsive-web-design/
http://searchengineland.com/the-importance-of-responsive-web-design-for-b2b-sites-179358
http://www.intelligentpositioning.com/blog/2014/06/2-reasons-need-responsive-designed-website/
http://www.journaldunet.com/solutions/seo-referencement/responsive-design-et-seo.shtml
Contenu Dynamique :
http://searchengineland.com/when-responsive-web-design-is-bad-for-seo-149109
http://fr.slideshare.net/telezent/responsive-design-vs-dynamic-serving-vs-separate-mobile-website
Général :
http://www.webmasterworld.com/google/4669157.htm
https://developers.google.com/webmasters/smartphone-sites/details
http://blog.hubspot.com/insiders/how-to-follow-googles-mobile-rules-for-awesome-seo
Romain Maury – UX Scientist @UX-Republic