That’s responsive !

Il y a quelques temps, j’ai organisé en compagnie de mes collègues de So-Buzz la première édition du Web In Provence, évènement durant lequel nous avons invité Stéphane Martin, Senior product designer chez StackOverflow, qui nous a exposé ce qu’était pour lui le responsive design, et plus largement, comment appréhender l’ère du « post-PC ».
La conception web multi device n’est plus aujourd’hui une tendance, mais une obligation. A l’heure ou près de 40% du trafic mondial se passe sur mobile ou tablette, comment imaginer de ne pas penser en amont l’utilisation d’un site sur ces appareils !

Je vous invite à suivre cette conférence, on ne peux plus instructive sur le sujet. Afin de suivre correctement la conférence, vous pouvez librement télécharger les slides.

 

« Le contenu doit s’adapter au contenant »

 

mobile-firstLe responsive design n’est pas qu’une question de redimensionnement du site. Ce doit être une réelle réflexion en amont, sur « qu’est ce que le mobinaute attend lorsqu’il consulte le site ». Lors de sa visite sur un site, depuis un mobile, l’internaute est dans un contexte particulier. Il n’est peut être pas chez lui, il effectue peut être d’autres actions en parallèle, il cherche peut être une information spécifique… Tout cela doit être réfléchi, et pris en considération. Plusieurs concepts, astuces et recommandations sont données à ce sujet par Stéphane, comme travailler « mobile first » par exemple. Le lien est aussi fait avec le design pur : Quelles sont les conséquences de la multitude des tailles de devices sur le design du site ? Quelles sont les contraintes ?

Par exemple, Stéphane Martin prend dans sa conférence l’exemple d’un site de cuisine. Lorsque l’internaute le consulte depuis son smartphone, il est peut être au supermarché en train d’acheter les produits nécessaires pour faire sa recette. Ne serait-il alors pas intéressant de lui afficher une fonction « check list » ? Lorsqu’il consulte le site sur une tablette, l’internaute est peut être en train de cuisiner. Ne serait-il pas intéressant de lui proposer une fonction « Timer » pour chronométrer sa recette, ou une fonction « étapes », lui permettant d’avancer pas à pas dans sa recette ? A l’inverse, ces fonctionnalités ne sont peut être pas pertinentes pour la version desktop du site.

Ceci est un exemple applicable pour la quasi totalité des sites web. Nous sommes en ce moment à l’agence en train de réaliser le site d’un hôtel. Nous avons logiquement proposé d’afficher sur la version mobile un bouton « Itinéraire », qui lance automatiquement l’itinéraire sur l’app Google Maps pour se rendre à l’hôtel, pensant que lorsqu’un internaute se connecte depuis un mobile, il se peut qu’il soit dans la rue en train de chercher l’hôtel. Bien entendu, le reste des fonctionnalités plus « classique » du site ne sont pas masquées, juste moins mise en avant. Les boutons « contacter » et « réserver » ont également été mis en avant sur mobile. Ce sont ces petits détails qui font la réussite d’un site. L’expérience utilisateurs doit être la base de toute réflexion, le design ne venant qu’ensuite, et la technologie n’étant qu’un moyen d’y parvenir.

perfAttention donc lorsqu’on vous propose un site « responsive ». Beaucoup ne voient le responsive que comme un redimensionnement du site, pour un affichage correct. Le vrai responsive va plus loin, on parle bien d’experience utilisateur et non d’affichage simple. L’affichage simple pose d’ailleurs des problèmes de performances. Il n’est pas compliqué d’admettre qu’un appareil mobile n’offre pas les même performances, notamment en termes de connexion (3G), qu’un ordinateur. Imaginons que le site desktop offre de belles et grandes images. Un responsive simple fera en sorte que votre mobile affiche cette même grandes images, mais en petit, ce qui est une source immense de perte de performances. Ceci n’est qu’un exemple parmi d’autres.

Stéphane Martin revient sur cette notion de « web performance » dans sa présentation, en montrant par A+B que les performances sont directement liées aux chiffre d’affaire généré par un site. A méditer donc.

Je vous laisse maintenant découvrir la conférence ! Bon visionnage !

 

Vous aimerez peut-être :

Lire les articles précédents :
florent-hernandez
Social Media Pipeline – Conférence gratuite

Il y a quelques semaine, j'ai répondu favorablement à l'appel de l'OMI, Online Marketing Institute, pour la réalisation d'une conférence...

cross
[ITW] Florent Hernandez : Les stratégies Cross Canal

J'ai récemment été interviewé par Rémi De Vos, étudiant en MS Marketing Management et Communication à TBS Toulouse Business School....

Fermer