Tout webdesigner devra un jour se frotter au « responsive
webdesign ». Pour vous aider, CréaNum vous propose un
premier aperçu sur les notions essentielles où l’on parle de
« media queries », de l’importance du CSS3, du HTML5,
mais aussi de la définition, des bonnes pratiques, en
proposant quelques ressources pour se lancer.
C’est le terme à la mode,
celui circule en boucle chez
un grand nombre de web
designers : « responsive
webdesign ». Que se cachet-
il derrière ce nom un peu
barbare ? C’est ce que nous allons tenter d’analyser
dans cet article, qui dresse un tableau aussi
complet possible sur ce « phénomène », qui est
en fait une adaptation du travail des graphistes à
l’ère moderne du Web 2.0 et surtout, de la mobilité.
« Le sentiment de contrôle que connaissent les designers dans les supports d’impression, qui est
souvent un désir dans les supports web, est simplement
inhérent à la limitation physique d’une
page imprimée. Nous devrions accepter le fait
que le Web n’adopte plus les mêmes contraintes,
et que nous designons en fonction de sa flexibilité.
Mais en premier lieu, il convient d’accepter "le
flux et le reflux des choses" ». Cette citation est
signée John Allsopp, dans son livre « A Dao
of Web Design », et elle résume bien ce qui a
conduit les graphistes à changer la manière
de travailler afin de s’adapter à un monde 2.0.
Rendons également une sorte d’hommage à
celui qui a(urait) inventé le concept de responsive
webdesign, Ethan Marcotte, dont
vous pouvez retrouver les articles (en anglais)
sur " www.alistapart.com.
Vous l’aurez très probablement remarqué si vous
travaillez régulièrement avec des clients pour la
réalisation de sites web par exemple. Désormais,
plus question pour eux de se contenter d’un
« site Internet » : on y ajoute une version mobile.
Mais certains veulent une version pour Black-
Berry d’autres pour iPhone, pour Android…
Sans oublier encore une autre pour Kindle, pour
l’iPad, etc. Et bien entendu, le site original doit
être compatible avec tous ces formats. Impossible
donc de créer une version spécifique pour
tous ces supports, sans compter que d’ici 5 ans,
le nombre de nouveaux formats aura très probablement
encore augmenté. La question à se
poser est donc : devons-nous simplement subir
la conséquence de perdre des visiteurs sur un appareil, au bénéfice d’en gagner sur un autre ?
Ou existe-t-il une autre solution ?
C’est à ces questions que le responsive webdesign
apporte une réponse : ni l’un ni l’autre. La
meilleure définition que l’on pourrait donner est :
une approche qui fait en sorte que le design et le
développement devraient répondre aux comportements
des utilisateurs, peu importe le terminal
qu’il utilise, sa plateforme ou son orientation. Plus
facile à dire qu’à faire… Mais il existe pourtant
déjà des solutions, utiliser des mixes entre grille
et mise en page flexible, des images et une utilisation
intelligente et cohérente des « media queries
» de CSS. Mais bien entendu, qui dit flexibilité
dit adaptabilité.