Pour l’optimisation mobile de sites Internet, 3 possibilités sont envisageables pour les développeurs :
- La conception Web adaptative ou design responsive : utilisation des mêmes URL, du même code HTML mais avec code CSS différents en fonctions des apparails (ordinateusr, smartphones, tablettes).
- L’affichage dynamique : utilisation des mêmes URL mais appel dynamique d’un code HTML et CSS adapté à chaque appareil
- Des URL différente s: création de sites différents pour les ordinateurs et les appareils mobiles.
Dans son guide pour une construction de sites Internet mobile, Google semble avoir clairement pris position pour la 1ère solution, le design responsive :
Il s’agit de sites (ndrl.: les sites responsive) qui utilisent le même ensemble d’URL pour tous les appareils, chacune de ces URL affichant le même code HTML sur tous les appareils. Seul un code CSS est utilisé pour adapter l’affichage de la page en fonction de l’appareil. Google recommande cette configuration.
Source : https://goo.gl/7v3xP
Vous trouverez ci-dessous les raisons qui font que Google déclare le design responsive mieux adapté à son algorythme.
Détéction automatique par les User-agents
Google détécte automatiquement un site conçu selon selon les techniques CSS du design responsive :
Nos algorithmes détectent automatiquement cette configuration si tous les user-agents Googlebot (à la fois Googlebot et Googlebot-Mobile) sont autorisés à explorer les éléments de la page (CSS, JavaScript et les images).
Source : https://goo.gl/7v3xP
Pour s’assurer que les les robots de Google sont bien autorisés à parcourir votre site, afficher la page http://www.votredomaine.com/robots.txt. Si vous trouvez les lignes suivantes, vous n’avez aucun problème d’indexation :
User-agent: *
Disallow:
OU
User-agent: Googlebot
Disallow:
Si au contraire la valeur de l’attribut “Disallow” est “/”, votre site, même conçu avec un design responsive, ne pourra pas être indexé par Google.
Des URL identiques et accessibles par tous les appareils desktop et mobiles
Une même URL affichant un même contenu disposé de manière différente selon les appareils : tel est la définition simple du design responsive. Cela est particulièrement intéressant lorsqu’une URL est partagée par un utilisateur. Imaginons que vous consultiez un article depuis votre smartphone. En partageant l’article sur votre page Google+, votre cercle d’amis pourra afficher cette même URL depuis une tablette ou un ordinateur avec un design adapté, sans redirection ou, dans le pire des cas, sans se trouver face à une page d’erreur 404.
Cela améliore grandement l’expérience utilisteur, critère important pour se voir accorder la confiance de Google et disposer d’un bon positionnement dans les pages résultats naturels.
Un temps de chargement réduit
En optant pour un design responsive, aucune détection du type d’apareil ou redirection ne doit être mise en place. Cela n’impacte donc pas le temps de chargement, ralenti par des redirections, autre critère important pour la visibilité de votre site Internet dans Google.
Une seule exploration pour le user-agent
En optant pour le responsive, vous n’avez pas à déclarer votre site à un autre user-agent que le principal, Googlebot. Vous simplifiez donc la vie du moteur de recherche et libérerez des ressources serveur avec un seul passage.
Pas de différence entre smartphones et tablettes
Autre avantage du responsive : pas de développement supplémentaire pour les tablettes. Il faut simplement ajouter les CSS permettant d’afficher le contenu de manière optimisée pour toutes les définitions possibles (plus nombreuses que pour les smartphones).
Limite de la conception Web adaptative
Si Google déclare le design responsive comme le meilleur moyen d’optimiser un site Internet pour la recherche, il n’en oublie pas de préciser que cette technique n’est pas reconnu par les appareils mobiles autres que les smartphones. Il en revient donc aux webmasters la responsabilité de faire l’impasse sur ces utilisateurs potentiels ou d’opter pour l’une des deux autres techniques évoquées plus haut (Diffusion dynamique ou URL distinctes).
Nous recommandons aux webmasters des sites consultés par les utilisateurs de smartphones de recourir à une conception Web adaptative dans la mesure du possible. Toutefois, les feature phones (mobiles d’entrée de gamme) n’étant pas capables de suivre les requêtes de média CSS, les webmasters souhaitant adapter leur contenu à ce type de téléphone devront faire appel à la diffusion dynamique ou à différentes URL.
Source : https://goo.gl/7v3xP
Conception Web Adaptative et Javascript
L’une des difficultés de la conception Web adaptative est l’utilisation du code JavaScript. Google liste l’ensemble des consignes à suivre pour appréhender au mieux les éventuels problèmes rencontrés lors du développement :
Voir https://developers.google.com/webmasters/smartphone-sites/javascript?hl=fr
