Les smartphones et tablettes connaissent une adoption fulgurante. De 5% en 2009, ce sera bientôt 22% de l’humanité qui possèdera un smartphone à la fin de l’année. Cela a radicalement changé la manière dont les internautes accèdent à internet. Avoir un site web optimisé pour mobile est ainsi devenu indispensable pour un e-commerçant. Pour s’adapter, ceux-ci ont le choix entre deux stratégies.
La première consiste à construire un site spécifique, en plus du site existant. Le visiteur y accès automatiquement lorsqu’il se connecte au site via un smartphone, voire une tablette. La deuxième stratégie consiste à refondre le site web existant, pour le remplacer par un site responsive , adaptant dynamiquement l’affichage des blocs de contenu selon la taille du navigateur web du visiteur. (Quelques exemples ici )
La deuxième méthode, dite responsive, semble apporter une solution unique, durable, compatible avec toutes les tailles d’écrans, dans un univers mobile de plus en plus fragmenté : Smartphones, Phablettes, mini-tablettes et tablettes. C’est d’ailleurs la méthode recommandée par Google (même si Google dit ne pas pénaliser les sites mobiles dans son algorithme). Cependant, force est de constater que très peu de grands e-retailers l’ont adoptée dans le monde, à commencer par les plus grands : Amazon, Walmart, Tmall ou Taobao. En France, même constat : selon notre baromètre, seulement 6% des e-commerçants Français ayant un site adapté au mobile ont choisi la voie responsive. Pourquoi les sites mobiles sont-ils pour l’instant privilégiés ?
1 – Le temps de chargement : facteur critique
Trois éléments font qu’un site est responsive :
- Une grille fluide, sur laquelle s’adapte le contenu
- Des images et medias (vidéos) flexibles, s’adaptant à leur contenant
- Des Media queries, ajustant l’affichage des blocs selon la largeur ou hauteur du navigateur utilisé par le visiteur.
La principale raison évoquée pour la non-adoption du Responsive Web Design (abrégé RWD) est son temps de chargement sur mobile. La plupart des sites responsives font presque le même poids sur mobile ou sur desktop : souvent, le même contenu est téléchargé, même s’il n’est pas forcément affiché. (Dans cette étude basée sur 471 sites responsive, seulement 9% d’écart a été constaté entre le poids du site visité sur desktop et celui du même site visité sur mobile.)
Ceci est particulièrement problématique pour les taux de transformations de sites marchands, lorsqu’on considère ce point critique qu’est la vitesse de téléchargement en 3G, et le fait que les utilisateurs mobiles sont encore moins patients que sur desktop.
2 – Le contexte de visite
Le besoin de l’utilisateur détermine son contexte de visite, et celui-ci n’est évidemment pas le même quand un visiteur visite votre site sur mobile dans les transports, sur tablette dans son canapé, ou sur PC au bureau : il suffit d’observer vos Analytics pour constater un temps moyen et des pages visitées différentes selon les appareils utilisés. Les utilisateurs mobiles auront plus tendance à vouloir localiser / appeler le magasin le plus proche, rechercher un produit spécifique, ou télécharger l’application.
De plus, une ligne de texte se limitant sur mobile à environs 75 caractères , afficher le même descriptif produit sur desktop ou sur mobile peut être incohérent. Pourtant, l’approche RWD basique consiste à servir le même contenu.
3 – La complexité
Le responsive demande un changement transverse au sein de l’entreprise, et une refonte complète du site existant. L’investissement à effectuer pour repartir de zéro est massif, et le projet d’autant plus complexe pour un site marchand. Il est paradoxalement plus simple de construire et connecter à la base de donnée un site distinct, qui inclue moins de HTML, des CSS et JS plus légers, et des images de taille adaptée. Le recettage est largement simplifié, ainsi que l’optimisation (A/B testing) ou la maintenance. (À ce sujet, retrouvez notamment l’avis de Justin Ziegler, Directeur technique de Priceminister.)
Pourtant, la plupart des problèmes mentionnés ci-dessus peuvent être contournés. La problématique de temps de chargement notamment.
Des approches intermédiaires peuvent aussi être adoptées : de nombreux sites choisissent d’être responsive sur desktop et tablette, puis adoptent un site séparé pour le mobile. D’autres, la démarche inverse, comme DPAM, qui propose un site desktop, et un site responsive couvrant le mobile et les tablettes.: il est possible de détecter avec des media queries quelles images servir, ou côté serveur les bons éléments à envoyer, en fonction du type d’appareil utilisé , et de sa bande passante, voire de sa capacité de calcul. Tout ceci reste cependant expérimental. Malgré tout, certains grands acteurs sont toute de même passés au RWD, notamment les sites du groupe Dixons (Pixmania , Currys ou encore PCworld. Quelques excellents cas de sites RWD marchants existent, notamment skinny ties , Burton , ou encore notre référence RWD chez ikomobi, Indochino.
Tous les grands retailers choisissent généralement d’avoir à la fois un site mobile, et une application mobile et tablette. C’est signe que pour l’instant, une expérience rapide, fluide et agréable se doit d’être native. Les sites mobiles sont quant à eux un premier pas vers le m-commerce, pour répondre à un traffic existant. Avec l’accélération des technologies HTML5, CSS3 et l’exécution javascript, il est possible que le temps du responsive arrive, à moyen terme.
