Vous avez peut-être entendu parler du « Responsive Webdesign » et vous vous demandez de quoi il s’agit ? Si vous doutez encore de son intérêt, lisez les lignes qui suivent pour comprendre pourquoi, aujourd’hui, il est devenu tout bonnement indispensable.

Qu’est-ce-ce que le « Responsive Webdesign » ?

Le « Responsive Webdesign », c’est tout simplement un style de présentation et de mise en page qui s’adapte automatiquement en fonction du support utilisé par les internautes qui vous rendent visite. En effet, imaginez qu’un internaute vienne voir votre site depuis son ordinateur, il aura besoin de pouvoir naviguer entre les différentes pages de votre site de façon simple, quel que soit le navigateur ou l’écran qu’il utilise. Autrefois, il était déjà agaçant pour un internaute de devoir faire défiler sa page vers la droite pour afficher les contenus en entier si un site était mal conçu et prévu pour une autre résolution d’écran ou un autre navigateur, mais imaginez maintenant que cet internaute va visiter votre site non-seulement depuis son ordinateur, mais aussi depuis son téléphone portable, puis depuis sa tablette. Dans ces conditions, la résolution de l’écran n’est plus le seul paramètre à prendre en compte, vous devez aussi réfléchir au fait que l’écran sera peut-être utilisé à la verticale et non plus à l’horizontale, etc. Par ailleurs les barres de menus devront maintenant être utilisées comme des boutons tactiles au lieu d’être cliquées simplement avec une souris, ce qui implique donc un design conçu pour une utilisation nomade facile. Le « Responsive Webdesign », c’est donc la conception d’un site Internet prévu, dès le début, pour tous les supports existants et non plus simplement pour une lecture sur ordinateur comme c’était le cas il y a quelques années. « Responsive » signifie en anglais « réceptif ou réactif », ce qui implique que votre site doit réagir de façon appropriée en fonction de l’appareil qui y accède.

Aller plus loin avec le « Responsive Webdesign » ?

Si vous voulez approfondir vos connaissances dans ce domaine, je ne peux que vous conseiller l’excellent livre d’Ethan Marcotte, qui reprend toutes les bases essentielles sur le sujet. Vous y apprendrez pourquoi et comment concevoir un site parfaitement adapté à tous les modes de lecture, que vos visiteurs soient plutôt accros à leur téléphone, leur tablette ou à leur ordinateur. Ce titre vous permettra aussi d’éviter les écueils qui peuvent se présenter sur votre route lorsque vous débutez. En effet, il est facile d’oublier de prendre en compte tous les cas de figure et, pour rester parfaitement exhaustif, il faut planifier l’architecture du site de façon claire bien avant de se mettre à écrire la moindre ligne de code. N’oubliez jamais qu’une navigation efficace est la clé pour éviter d’avoir un « taux de rebond » ridiculement élevé et pour que vos visiteurs reviennent vous voir de façon régulière !

Quel support de lecture privilégier en premier ?

Vous voulez que votre site continue à vivre et à générer un trafic important ? Dans ce cas, une approche responsive webdesign « mobile first » est absolument essentielle. Il est clair que de nos jours de plus en plus de personnes consultent Internet très fréquemment à l’aide d’un téléphone portable et, de plus en plus, depuis une tablette. Avec les fêtes de fin d’années qui approchent et les prix des tablettes et smartphones qui deviennent de plus en plus raisonnables, il est évident que la part des internautes qui consulte le web depuis un écran tactile ne peut aller qu’en augmentant. Dans ces circonstances il est donc essentiel de privilégier la lecture sur ces appareils, avant même de penser à la lecture sur PC ou Mac ! Par ailleurs, il semble logique de penser la conception d’un site d’abord pour le plus petit écran sur lequel il va être vu dans la mesure où c’est cette version qui risque de poser le plus de problèmes. Une fois le site mobile terminé, il est facile de le tester sur ordinateur pour voir si tout fonctionne aussi comme prévu.

Pourquoi privilégier le responsive web design (RWD) ?

La tendance actuelle montre clairement une augmentation de la navigation nomade et cela ne risque pas de s’inverser. Et puisque l’on consulte de plus en plus de sites Internet lors de déplacements, il est également évident qu’un site peu avenant sur téléphone portable risque d’en payer les conséquences en terme de trafic, y compris sur ordinateur. Car si beaucoup d’internautes utilisent encore leur ordinateur, ils préféreront bientôt visiter les sites qui leur permettent une lecture plus agréable confortablement installés sur leur canapé le soir après le travail, ou sur leur mobile dans les transports en commun en rentrant chez eux. Et si vous travaillez à la conception d’un site ecommerce, ceci est encore plus important à prendre en compte : si les achats sont trop compliqués à effectuer sur tablette ou téléphone, il y a fort à parier que les internautes se détourneront de votre site pour aller consommer chez votre concurrent ! Il suffit de visiter les sites des leaders de la vente en ligne pour se convaincre de l’importance stratégique du secteur des portables… D’autant plus que l’usage du portable se prête beaucoup plus aux achats impulsifs ! Qui a envie de passer des heures à faire du shopping sur un ordinateur quand les achats peuvent être réglés rapidement depuis un téléphone ? Merci le Responsive Webdesign !

En conclusion, que retenir du responsive webdesign ?

Avant toute chose, un site mobile doit pouvoir se charger de façon extrêmement rapide. N’oubliez jamais que, quel que soit le mode de connexion (3G/4G/Wifi), un internaute nomade perdra patience si le site n’offre pas une navigation confortable et rapide. Donc : attention aux vidéos ou images non optimisées, elles pourraient vous poser problème. Allez à l’essentiel en termes de contenus et optez au départ pour un style épuré, sans imposer des étapes inutiles à vos visiteurs. Pour le reste, bien entendu prévoyez de tester votre site sur le maximum de supports possibles, car personne n’est jamais à l’abri de bugs inattendus avec le responsive webdesign !

Grégory Chartier
Publié par Grégory Chartier

Expert Prestashop