Le Responsive Web Design : un même site Internet disponible partout, sur tous les supports

01 août 2013

Les périphériques mobiles nous ont envahis. 44% de la population française possède un smartphone (selon ZDNET). Smartphones, tablettes, et désormais même phablets, ils ont investis nos intérieurs, sont immédiatement accessibles car constamment en veille, et ont petit à petit transformé les internautes en mobinautes. Les entreprises se doivent de répercuter cette profusion d’écrans et de faire évoluer leurs canaux de communication digitaux, leur site Internet d’abord. Heureusement, pour ça il y a le RWD, et l’expertise de l’agence Atmosphère.

Le RWD ? Associant à la perfection les deux compétences webdesign & intégration, le RWD, acronyme pour Responsive Web Design (ça fera un anglicisme de plus à la longue liste détenue par le web), est une construction spécifique d’un site Internet pour faire en sorte que ce dernier s’affiche idéalement quel que soit l’écran du périphérique que l’on utilise pour le consulter. Un site responsive (c’est plutôt ainsi qu’on les appelle) vous proposera ainsi, dans son affichage adapté aux smartphones, un site où vous aurez simplement à faire défiler les informations à l’écran, que ce soit verticalement ou horizontalement, sans besoin de zoomer/dézoomer.

responsive web design

Site mobile, site responsive ? Le site mobile et le site en version ‘classique’ (destinée aux écrans traditionnels) sont deux sites distincts, même s’ils partagent bien souvent la même base de données, de sorte que l’on n’ait pas à dupliquer les modifications apportées du site traditionnel vers le site mobile. Un site construit en RWD regroupe la version traditionnelle, la version mobile et les versions aux formats intermédiaires au sein d’une même entité : il s’agit donc d’un seul et même site Internet, qui sera simplement affiché différemment suivant les écrans.

Un site estampillé ‘mobile’ est pour sa part exclusivement conçu pour le canal mobile. Un tel site sera souvent l’occasion de proposer une version mobile simplifiée par rapport à la version traditionnelle, par exemple pour ne proposer que des contenus que l’on aura identifiés comme ayant un intérêt particulier auprès des mobinautes. Pour son client la CCVLA, Atmosphère a ainsi d’abord conçu le site Internet au format habituel puis une version mobile qui ne reprend du site normal que la rubrique dédiée au tourisme. Les autres rubriques, davantage destinées aux contribuables de la communauté de communes, sont évincées. Pour constater la différence, il suffira de consulter www.vallee-loire-authion.fr depuis un ordinateur puis sur un smartphone.

CCVLA sur mobile
CCVLA sur écran classique
CCVLA mobile CCVLA classique

Ceci dit, rien n’empêche un site responsive de proposer une hiérarchisation différente des contenus en affichage mobile. On prendra là encore l’exemple d’une communauté de communes pour illustrer la chose, avec le site de la CCBC (www.cc-bocage-cenomans.fr). Il suffit de le redimensionner dans un navigateur web pour constater qu’en smartphone, si les rubriques proposées demeurent les mêmes que sur un écran traditionnel, elles sont organisées différemment, avec la rubrique « accès rapide » avant les actualités.

Avant d’opter pour l’une ou l’autre des solutions, il conviendra donc de se poser quelques questions, comme « Ai-je besoin de proposer à mes mobinautes le même éventail de contenus qu’à mes internautes ? » ou encore « comment hiérarchiser mes contenus en fonction du périphérique et des utilisations ?« . Le responsive permettra également de jouer sur les transitions, comme sur le site de www.coteregards.fr où la navigation, horizontale sur un écran traditionnel, devient verticale sur petit écran.

Changé sur mobile
Changé sur écran classique
Changé mobile Changé ville

Faut-il opter pour un site en responsive ? Dans l’immédiat, cela dépendra de votre typologie de clientèle et de la réponse à la question : « Est-elle équipée ? ». Mais dans un laps de temps plus ou moins court (déjà écoulé ?), disposer d’un site responsive sera devenu une norme incontournable. La continuelle multiplication des périphériques connectés, et par conséquent des résolutions d’écrans différentes, impose déjà de se poser la question lorsque l’on entame un projet de création de site Internet.

En plus des liens que vous avez pu découvrir en parcourant cette page, voici quelques exemples de sites responsive : www.daumin-voyages.fr, www.fedepeche49.fr, www.ville-change.fr, www.noyen-sur-sarthe.fr, www.chs-sarthe.fr ou encore www.montfort-le-gesnois.fr. Redimensionnez votre navigateur une fois le site affiché pour voir comment il se comporte suivant la taille de l’écran.

Laisser un commentaire

Votre adresse e-mail ne sera pas publiée. Les champs obligatoires sont indiqués avec *