Avec l’avènement des devices tactiles, le déploiement massif du responsive design s’est imposé aux retailers. Si on remarque que du coté des utilisateurs, le mobile comprend la majorité du trafic avec 60 % (cf notre rapport Digital Experience Benchmark), il reste cependant certain que les achats ont une plus grande valeur sur desktop avec x4 de la valeur moyenne des commandes sur desktop par rapport au mobile.
Et l’UX dans tout ça ?
Alors que la grande majorité des sites marchands semble s’être dotée de méthodes de conception de contenus s’adaptant à chaque interface, le responsive design qui fait de l’UX Design est-il le garant exclusif d’une bonne expérience utilisateur ?
Le responsive design, d’abord, qu’est ce que c’est ?
Le responsive design ou plus précisément le Responsive Web Design (RWD) est une approche technique de conception d’interface digitale qui permet de rendre une page Web adaptable à l’écran qui le lit. Le responsive design agit de manière automatique. Il s’agit pour les marques d’un concept à adopter pour améliorer l’expérience utilisateur de leur site sur tout support, mais aussi un critère de ranking pour Google. Il est différent de l’Adaptative Design bien que les deux concepts aient pour but d’améliorer l’ergonomie mobile du site web.
Le responsive design, un incontournable dont il paraît difficile de se passer
“Cette année, priorité au mobile-first !” Dorénavant devenu le leitmotiv de la plupart des retailers, il est encore fréquent de se retrouver à zoomer sur son smartphone pour pouvoir lire un contenu à la police illisible. Un repoussoir à utilisateur qui se double d’une sanction du célèbre et tant redouté moteur de recherche Google. Depuis le 21 avril 2015, un site aux contenus non adaptables sur device tactile prend le risque de passer en bas de liste en matière de référencement.
Si la conception en responsive design induit une certaine réactivité, les temps de chargements se font parfois plus longs et le redimensionnement des visuels n’est parfois pas optimisé.
[
](https://cdn2.hubspot.net/hubfs/2640385/Imported_Blog_Media/mobinautes_temps_chargement.png)
Or, souvent connectés dans des lieux peu propices à une consultation sereine tels que les transports, les mobinautes et autres adeptes de la tablette élèvent leurs exigences lors de la navigation. En 2016, près d’un mobinaute sur 5 est encore exposé à un temps de chargement supérieur à 5 secondes…alors que sa probabilité de quitter le site après la 5ème seconde s’élève à 50% !
Adapter les contenus sur smartphone et tablette, c’est s’assurer de présenter l’essentiel
La conception responsive nécessite de repenser les contenus présentés, cela semble aller de soi. Pourtant, comment faire un choix sans négliger certaines informations ? Un dilemme qui peut vite disparaître si l’attention des retailers se porte sur ce que souhaite consulter les utilisateurs sur les interfaces tactiles.
Sur mobile, la longueur de page n’effraie pas l’utilisateur : il scrolle en moyenne 1.6 fois plus vite que sur tablette. L’environnement du mobinaute ainsi que l’usage intense des réseaux sociaux impactent significativement la manière dont ce dernier lit le contenu.
Il ne s’agit donc pas de répliquer les éléments du site desktop sur la version mobile mais d’intégrer les interactions propres à l’utilisation de ces devices. Un scroll plus rapide signifie une consommation de contenus survolée d’où l’intérêt de présenter des informations pertinentes.
Si la nécessité de concevoir en responsive n’est plus à démontrer, les contenus et l’incitation à l’achat doivent se réinventer pour proposer à l’utilisateur un parcours simplifié, fluide et en adéquation avec le contexte et l’intention de ce dernier lorsqu’il décide d’interagir avec une marque.
Responsive design : notre checklist de bonnes pratiques :
Pour optimiser votre site web pour les moteurs de recherche et offrir une expérience utilisateur optimale, le responsive design est essentiel. Voici une checklist de bonnes pratiques à suivre pour mettre en place un responsive design efficace :
Test de compatibilité mobile : Vérifiez que votre site s’affiche correctement sur tous les appareils mobiles en effectuant des tests sur différentes résolutions d’écran et plateformes.
Conception flexible : Utilisez des grilles et des systèmes de mise en page flexibles pour vous assurer que votre site s’adapte aux différentes tailles d’écran sans distorsion ou troncature du contenu.
Images adaptatives : Utilisez des images adaptatives qui se redimensionnent automatiquement en fonction de la taille de l’écran pour éviter les temps de chargement excessifs et les problèmes de mise en page.
Texte lisible : Veillez à ce que le texte reste lisible et facile à lire, quel que soit le dispositif utilisé. Utilisez des polices appropriées et ajustez la taille du texte pour une lisibilité optimale.
Navigation simplifiée : Adaptez votre menu de navigation pour qu’il soit facile à utiliser sur les petits écrans, en utilisant des icônes ou un menu déroulant pour économiser de l’espace.
Temps de chargement rapide : Optimisez les performances de votre site en compressant les fichiers CSS et JavaScript, en utilisant des images optimisées et en minimisant les requêtes HTTP.
Tests multiplateformes : Vérifiez régulièrement l’apparence et le fonctionnement de votre site sur différents navigateurs et dispositifs, en effectuant des tests de compatibilité approfondis.
En suivant cette checklist de bonnes pratiques, vous pouvez vous assurer que votre site web est parfaitement optimisé pour le responsive design, ce qui améliorera votre classement dans les moteurs de recherche et offrira une expérience utilisateur positive sur tous les appareils.