Le Responsive Design est-il une si bonne idée ?
Pas vraiment, répond un spécialiste du Design Web lors de la conférence AgoraCMS

Le , par Gordon Fowler, Expert Confirmé Sénior
Lors d'AgoraCMS, l’évènement sur les CMS co-organisé par Cyril PIERRE de GEYER qui se déroule aujourd’hui, une session très intéressante sur « les tendances actuelles du design et des nouveaux usages » est revenue sur une pratique de plus en plus populaire dans la réalisation de sites : le Responsive Design.

Cette technique consiste à adapter l'affichage d'une page en fonction de la taille de l'écran. Intégrée de plus en plus en natif aux principaux CMS du marché, elle permet de répondre simplement à la diversification des terminaux (écrans de smartphones de diagonales et de ratios différents, tablettes 7 et 10 pouces, laptops ou écran large de bureau) en modifiant le nombre de colonnes, l'emplacement et les grandeurs des éléments.

Un parfait exemple en est le site du Boston Globe, un des premiers à avoir franchi le pas depuis plusieurs mois.

Boston Globe, version « PC » :



Boston Globe, version « tablette » :


Boston Globe, version « smartphone » :



Une manière simple de faire du multicanal. Trop simple ?

Un peu trop, au goût de Patrick MARUEJOULS, créateur de l’agence de design global Think Think et professeur à HEC, qui analyse que la limite - et donc la grosse faiblesse du Responsive Design quand il est utilisé de manière « brute » - est qu'il ne modifie pas les contenus affichés, mais comment ils sont affichés. Ce qui ne serait pas cohérent au regard des usages.

Les besoins auxquels répond un site mobile ne sont en effet pas les mêmes que ceux d’un site Web « pour bureau ». « Mettre les même contenus dans les deux, c’est une belle connerie », résume franchement Patrick MARUEJOULS.

Il synthétise cette idée en une formule, plutôt bien trouvée : Convergence (développer une fois pour plusieurs plateformes pour économiser les coûts) mais aussi Divergences.

Lors de sa session à AgoraCMS, le designer a pris l'exemple de Nike pour illustrer cette Convergence/Divergence.

Les visiteurs du site web « classique » de la marque de chaussures sont une infime minorité à consulter la rubrique « Trouvez un magasin » (en ordre de grandeur ils sont environ 2 %).

La fonctionnalité est donc presque cachée.



À l’inverse, un utilisateur nomade qui consulte le site mobile (m.nike.com) aura une propension beaucoup plus grande à rechercher un magasin à proximité. Ce ne sera pas nécessairement son premier besoin, mais l’importance de cette possibilité augmente.

Fort logiquement, Nike a donc amélioré l’exposition de cette fonctionnalité sur son site mobile. D’une part en augmentant sa taille, mais aussi en épurant la page pour n’y garder que quelques éléments pertinents.


Là où le Responsive Design « de base » ne fait que modifier l’agencement, une véritable stratégie multi-écran se devrait donc, d’après l’expert, de repenser l’architecture entière des sites en fonction des besoins identifiés - et contextualisés - de l’utilisateur.

Patrick MARUEJOULS ne jette toutefois pas le bébé avec l’eau du bain. Le plus important est, pour lui, de toujours centrer la réflexion de la construction d'un site autour de l’utilisateur final. Le Responsive Design inclus en natif dans les CMS pourrait donc dans bien des cas parfaitement convenir. Mais pas toujours. Voir pas souvent. L'adapter et le personnaliser resterait une étape quasi-indispensable pour arriver à un vrai sites web 100 % adaptatif. À du vrai Responsive Design donc.

Reste à savoir le pourcentage de sites où les versions mobiles et desktops doivent différer radicalement pour coller aux attentes de l’utilisateur en toute circonstance. Et donc, en creux, combien de fois cette technique dans sa version simplifiée et intégrée aux CMS reste une solution tout terrain et très économique.


Patrick MARUEJOULS


N.B. : Pour ceux et celles qui n’ont pas eu la chance de pouvoir venir à AgoraCMS, les slides des présentations de toutes les sessions seront mis en ligne prochainement.

Et vous ?

Le Responsive Design est-il adapté à la majorité des sites ? Et pourquoi ?


Vous avez aimé cette actualité ? Alors partagez-la avec vos amis en cliquant sur les boutons ci-dessous :


 Poster une réponse

Avatar de Jaujon Jaujon
http://www.developpez.com

le 15/05/2013 16:38
Le Responsive Design permet de jongler entre plusieurs contenus différents: il est possible, grâce aux media queries, de dissimuler ou d'afficher des contenus différents en fonction de la nature du terminal, de sa taille et même de la densité de pixels.
Cet article repose donc sur du vent, puisqu'il est tout à fait possible de proposer du contenu adapté pour un affichage donné grâce à la souplesse fournie par la méthodologie Responsive Design.
Évidemment, on n'est conscient de cela que lorsqu'on est allé au fond des choses, et pas après être allé consulter deux-trois sites et jeté un oeil distrait sur quelques CMS.
Avatar de Gordon Fowler Gordon Fowler
http://www.developpez.com
Expert Confirmé Sénior
le 15/05/2013 16:45
Bonjour Jaujon,

Le propos de Patrick MARUEJOULS était bien de dire que le Responsive Design "automatisé" dans les CMS ne suffisait pas et qu'il fallait aller modifier plusieurs choses pour le rendre plus pertinent.

Je pense également que cette mise en garde répond à toute une industrie qui présente le Responsive Design comme une solution miracle. Lui dit, comme vous, qu'il faut aller voir un peu plus loin.

En gros Patrick MARUEJOULS et vous êtes d'accord. Désolé que cet article ne l'ait pas bien fait ressortir (je viens d'essayer de préciser ces éléments).

Cordialement,
Avatar de camus3 camus3
http://www.developpez.com
Membre Expert
le 15/05/2013 17:34
Si les boites ont le temps et le budget de présenter un site avec 15 contenus différents pour 15 médiums différents ,juste parce que le responsive design, "c'est pas optimal",tant mieux.
Avatar de thelvin thelvin
http://www.developpez.com
Modérateur
le 15/05/2013 18:03
Je n'ai qu'à peine touché au responsive design.

Si je comprends bien, l'intérêt, c'est de ne pas se traîner les 15 versions de documents possibles, et notamment ne pas leur donner 15 URLs ou de la différence de présentation par paramètre de l'URL, chose pas géniale vis-à-vis du référencement ?

Parce que bon, se traîner 15 versions dans la génération du HTML, ou dans les CSS, ça me semble plutôt au désavantage du CSS. La génération automatique, elle au moins, elle se farcit pas de garnir le document de tout ce qui pourrait possiblement servir à un terminal de la planète.
Avatar de JérémieL JérémieL
http://www.developpez.com
Membre confirmé
le 15/05/2013 18:25
Le Responsive Design consiste à adapter un même site web à différents supports, en modifiant la façon d'afficher les contenus mais aussi en masquant/affichant tel ou tel contenu selon le support.

Ce n'est pas parce que certains thèmes "responsive design" fournis de base avec certains CMS ne sont pas adaptés à tous les contenus (ce qui est évident), que le Responsive Design est une mauvaise méthodologie pour autant.
Avatar de thelvin thelvin
http://www.developpez.com
Modérateur
le 15/05/2013 18:29
Oui ok c'est ce que ça fait. Mais en quoi c'est intéressant de faire ça au lieu de juste générer le format adapté ? (En admettant quand même qu'on sache quel format générer. Si c'est pas le cas je le vois, l'intérêt)

Je veux bien entendre une réponse du genre "c'est pas spécialement plus intéressant, les deux se valent, suivant le cas rencontré."
Avatar de CapFlow CapFlow
http://www.developpez.com
Membre confirmé
le 15/05/2013 18:32
Citation Envoyé par Jaujon  Voir le message
Le Responsive Design permet de jongler entre plusieurs contenus différents: il est possible, grâce aux media queries, de dissimuler ou d'afficher des contenus différents en fonction de la nature du terminal, de sa taille et même de la densité de pixels.
Cet article repose donc sur du vent, puisqu'il est tout à fait possible de proposer du contenu adapté pour un affichage donné grâce à la souplesse fournie par la méthodologie Responsive Design.

Cacher c'est sympathique, mais faire télécharger du contenu inutile (puisque tu vas le cacher par la suite), surtout sur mobile où ce n'est pas encore la folie niveau puissance, je trouve ça plutôt très mauvais.

alors oui, actuellement il vaut mieux faire deux versions. (Limite, faire du responsive design pour PC - tablette, mais faire une autre version pour mobile).
Avatar de roche.jul roche.jul
http://www.developpez.com
Membre actif
le 15/05/2013 19:17
@CapFlow: en effet, cacher des éléments n'est pas une solution en soit (à utiliser pour l'aspect desktop, mais pas pour l'aspect mobile).

Mais il ne faut pas se cantonner au responsive design et aller plus loin: appliquer le responsive ! Notamment un sous-ensemble du responsive étant le RESS: REsponsive Server-Side.

Le principe: générer un contenu adapté au média (potentiellement aussi au navigateur). Ainsi, rien nous empêche d'utiliser des librairies RESS qui permettent de détecter le média (et ses capacités) et de générer une page / style / javascript adapté.

Ainsi, nous pourrions utiliser le CSS de base avec ses règles responsives et de ne pas injecter le contenu de certaines zones qui ne s'afficheront pas (je n'ai pas encore trouvé comment agrandir les fenêtres sous smartphones / tablettes).

Cordialement
Avatar de CapFlow CapFlow
http://www.developpez.com
Membre confirmé
le 15/05/2013 19:25
Citation Envoyé par roche.jul  Voir le message
Mais il ne faut pas se cantonner au responsive design et aller plus loin: appliquer le responsive ! Notamment un sous-ensemble du responsive étant le RESS: REsponsive Server-Side.

Le principe: générer un contenu adapté au média (potentiellement aussi au navigateur). Ainsi, rien nous empêche d'utiliser des librairies RESS qui permettent de détecter le média (et ses capacités) et de générer une page / style / javascript adapté.

De ce côté-là je suis d'accord. Je ne connaissait pas le RESS, merci de l'information.
A vrai dire je me suis demandé si on pouvait gérer facilement côté serveur les media, (oui, du coup) mais j'ai préféré aller au bout de ma pensé.

Donc responsive oui, mais pas que en CSS (et éventuellement JS), il faut le faire des deux côtés (serveur - client)
Avatar de camus3 camus3
http://www.developpez.com
Membre Expert
le 15/05/2013 20:07
Mais il ne faut pas se cantonner au responsive design et aller plus loin: appliquer le responsive ! Notamment un sous-ensemble du responsive étant le RESS: REsponsive Server-Side.

lol , le responsive server-side , antinomique par définition, à moins d'y rajouter un bonne couche d'ajax , et encore , ça ne fait qu'alourdir et la page et l’expérience utilisateur...

Et tu fais comment quand l'utilisateur redimensionne l'écran , tu recharges le tout coté serveur ? Il vaut mieux un contenu existant mais caché , plutôt qu'une couche framework X-Yqui va encore alourdir les traitements cotés serveurs ainsi que coté client via javascript surtout quand CSS est suffisant.
Offres d'emploi IT
Ingénieur en conception / gestion des exigences (H/F)
CDI
NEO SOFT - Bretagne - Rennes (35000)
Parue le 21/10/2014
Ingénieur Développeur Java JEE / Expert Technique (H/F)
CDI
Linkeo.com - Ile de France - Paris (75008)
Parue le 23/10/2014
Responsable de domaine bi (h/f)
CDI
CAREER BOOSTER - Ile de France - Antony (92160)
Parue le 06/10/2014

Voir plus d'offres Voir la carte des offres IT
 
 
 
 
Partenaires

PlanetHoster
Ikoula