Scroll To Top

Qu’est-ce que le Responsive Web Design ?

Design, Web / Mobile 11 fév 2012

Responsive Web Design

Cela fait un moment que la notion de « Responsive Design », et plus précisément celle de « Responsive Web Design », commence à tourner dans le monde de l’utilisabilité, de la mobilité et de la création interactive. Mais de quoi s’agit-il ? Petite définition suivie d’exemples, histoire de comprendre en quoi le Responsive Web Design transforme notre approche de la conception d’interfaces multi-plateformes.

D’où vient la tendance du Responsive Web Design ?

Principalement de la diversification des formats d’écrans. Là où le Web Designer devait auparavant concevoir ses maquettes pour PC, dans des résolutions classiques comme 1024×768 ou 1280×800… de nouveaux formats ont commencé à s’imposer, avec la démocratisation des smartphones et l’émergence des tablettes tactiles.

La question est donc née : comment construire des interfaces flexibles, qui soient capables de s’adapter automatiquement à la résolution exploitée par le support ?

Qu’est-ce que le Responsive Web Design ?

Il s’agit d’une approche du Design d’applications et de sites Web Mobile qui vise à apporter une expérience de navigation adaptée à un utilisateur, qu’il soit sur un PC, sur un smartphone ou sur une tablette. En résumé : un Web Design Réactif.

Les experts de cette méthode de conception la définissent plus précisément ainsi : « une conception d’interfaces Web qui s’appuie sur une grille fluide, des images flexibles et des requêtes navigateur pour définir le support utilisé. »
Quelques exemples d’applications conçue en Responsive Web Design

Voici quelques sites réalisés en Responsive Web Design (où l’on découvre que, contrairement aux premières réflexions, le Responsive Web Design peut aussi très bien s’appliquer à des sites riches en contenus et a priori complexes) :

Responsive Web Design

Responsive Web Design WordPress

De nombreuses galeries ont été créées pour nous livrer les premiers exemples de réalisations en Responsive Web Design. La plus intéressante : Mediaqueri.es. D’autres exemples à partager, ou des commentaires à faire pour enrichir ce post ?

Visuels LiveFront & TheHappyBit & WooThemes

Articles liés :

L'AUTEUR

Ange

Serial-blogger depuis 2007, professionnel du Web et passionné par tout ce qui touche aux nouvelles technologies, à la créativité numérique, à la science-fiction... Plus particulièrement ? Fan d'Orwell, de Bradbury, des Daft Punk et de District 9.

DONNEZ VOTRE AVIS