responsive design

Webdesign responsive : galerie de sites

Depuis quelques temps déjà, la communauté de créatif et de développeurs parle beaucoup de design « responsive » sur la toile. Je profite donc de ce contexte pour aborder ici ce sujet.

Qu’est-ce-que le responsive design?

Commençons par quelques rappels. Qu’est-ce-que le responsive design? Pour répondre simplement à la question, je dirai que c’est un procédé de conception d’interfaces web prenant en compte les contraintes liées aux périphériques d’affichage de sites web. Concrètement, le site ainsi conçu s’adaptera selon que l’utilisateur le consulte sur un ordinateur, une tablette ou un smartphone. Grâce à ce procédé, plus besoin de créer d’application ou de site mobile, c’est le même site qui s’adapte aux contextes de mobilité.

A noter cependant que dans certains cas, l’application ou le site mobile dédié sont des solutions à privilégier si le projet d’interface est trop complexe. On a en effet naturellement tendance à voir le responsive design comme le nouvel eldorado de la conception web mais il présente tout de même beaucoup d’inconvénients (des délais de conception plus longs, une marge créative réduite, limites techniques, etc). Mais je ne vais pas m’attarder aujourd’hui sur les limites de ce procédé.

Il y a peu de temps, j’ai moi-même été confrontée à cette problématique, raison pour laquelle je voulais vous proposer une galerie de sites web conçus sur le principe du responsive design. Elle vous donnera peut-être quelques idées pour vous inspirer. Et comme une fois n’est pas coutume, je me suis quelque peu focaliser sur des exemples « made in France » histoire de montrer que les webdesigners français ont des ressources 😉

Le site du Festival de l’Histoire de l’Art

http://festivaldelhistoiredelart.com/

site web du Festival de l'Histoire de l'Art

site web du Festival de l'Histoire de l'Art

version mobile du site du Festival de l'Histoire de l'Art

version mobile du site du Festival de l'Histoire de l'Art

Le site de la Nuit Européenne des Musées

http://nuitdesmusees.culture.fr/

Site web de la Nuit des Musées

Site web de la Nuit des Musées

version mobile du site de la Nuit des Musées

version mobile du site de la Nuit des Musées

Le site de l’agence social média Text Invaders

http://www.textinvaders.com

site web de l'agence social media Text Invaders

site web de l'agence social media Text Invaders

version mobile du site de l'agence Text Invaders

version mobile du site de l'agence Text Invaders

Le blog du développeur front Bastien Penalba

http://blog.bastienpenalba.fr/

interface du blog de Bastien Penalba

interface du blog de Bastien Penalba

version mobile du blog de Bastien Penalba

version mobile du blog de Bastien Penalba

Le site événementiel 3200 Tigres par WWF

http://3200tigres.wwf.fr/les-actions-du-wwf/

 

Site Web pour l'opération 3200 Tigres par WWF

Site Web pour l'opération 3200 Tigres par WWF

Version mobile du site 3200 Tigres

Quelques liens pour aller plus loin :

La boite à Outil ultime du responsive design : http://designspartan.com/info_generale/la-boite-a-outil-ultime-pour-le-responsive-design/

Une galerie fournie de sites web responsives (tous à l’international) : http://mediaqueri.es/

 

Partagez cet article sur les réseaux sociaux !Share on FacebookTweet about this on TwitterShare on Google+Email this to someone