Le Web évolue vite. Il y a 2 ans, avec l’arrivée du HTML5, le monde de l’Internet découvrait le terme de « Responsive Web Design ». Aujourd’hui, avec l’explosion de la navigation web depuis des terminaux mobiles, il est déjà devenu un terme clé, incontournable dans tout nouveau projet Web.

Qu’est-ce que le Responsive Web Design ?

Le « Responsive Web Design » est un terme inventé par Ethan Marcote dans son livre du même nom. En théorie, un site responsive est censé être fluide quelque soit la taille du support et ce, grâce aux feuilles de styles CSS et plus particulièrement aux media queries, mais le but de cet article n’est pas de s’étendre sur la partie technique du sujet. La mise en page s’adapte au support, les blocs se repositionnent, etc… mais aucune modification n’intervient dans l’organisation des éléments, la structure et les fonctionnalités de la page.

Le Responsive Web Design séduit naturellement. Tant au niveau de l’ergonomie que du coût de production, il s’impose aujourd’hui comme un savoir-faire à maîtriser pour tous les professionnels de la création de site Internet. Il paraît évident que développer autant de versions d’un site qu’il y a de résolutions d’écran existantes semble rapidement décupler le temps de travail et donc, la facture finale ! La solution pragmatique à ce problème grandissant s’est donc imposée d’elle-même : le Responsive Web Design permet de créer un unique design fluide qui s’adapte quelque soit l’appareil utilisé.

Le « Responsive Web Design », un terme galvaudé

Il faut cependant faire attention à me pas utiliser le terme de « Responsive Web Design » en toutes circonstances ! Parfois, différents paramètres peuvent nécessiter l’adaptation spécifique d’une page selon le support, et ce, dans l’unique but d’améliorer l’ergonomie d’interface pour l’utilisateur. Par exemple, un menu classiquement affiché sur un écran d’ordinateur, peut prendre la forme d’une liste déroulante pour simplifier la lecture sur un smartphone. Théoriquement, il ne s’agit alors plus de Responsive Web Design mais plutôt d’Adaptive Web Design, terme inventé par Aaron Gustafson dans son livre également du même nom. Il base son concept sur le « Progressive Enhancement » (Amélioration progressive), comprenez l’optimisation de l’expérience utilisateur selon le support. L’Adaptive Web Design est un compromis de HTML, CSS et de Javascript essentiellement, mais peut par exemple aussi intégrer une technologie spécifique de l’appareil.

A les comparer, on s’aperçoit que le Responsive Web Design s’apparente plus à une méthode de travail basée sur des grilles fluides, des images flexibles et le tout géré par les media queries d’une feuille de style CSS, tandis que l’Adaptive Web Design est un réel concept intégrant une approche réfléchie pour adapter l’expérience utilisateur aux capacités et fonctionnalités du support. Le terme de Responsive Web Design est en fait régulièrement galvaudé au détriment de l’Adaptive Web Design. Il faut cependant admettre que les 2 concepts sont étroitement liés et que lorsqu’un client nous parle de Responsive Web Design, on entend bien qu’il souhaite un site répondant à la problématique d’adaptabilité ! Rares sont les sites purement « responsive ». Les objectifs d’un client, les contraintes techniques, l’ajout de fonctionnalités spécifiquement liées aux capacités des appareils, l’optimisation et l’accessibilité des contenus, voilà autant de raisons qui nécessitent une véritable réflexion sur la stratégie d’un site Internet.

Aujourd’hui, l’adaptabilité d’un site Internet se définit dès la conception d’un projet, il faut bien définir les différentes attentes d’un mobinaute et celles d’un internaute, il peut y avoir des objectifs distincts d’un support à un autre. Comment intégrer ces nouvelles problématiques et en gérer l’impact sur chaque étape de la réalisation d’un projet Web, voilà un sujet intéressant à aborder… dans un prochain article.