* Montage PSD2HTML RESPONSIVE DESIGN MOBILE Roubaix

***Web2007 est un bureau indépendant situé à Genève et a l'habitude de travailler pour des entreprises PARTOUT en France et en Europe

Montage PSD2HTML RESPONSIVE DESIGN MOBILE Roubaix

Article:

L’usage du Responsive Web Design ne s’applique pas seulement à un site internet. On peut penser de manière adaptative tout ce qui utilise des technologies web. Il est de ce fait possible de concevoir des emails HTML adaptatifs, des applications HTML5 mobiles adaptatives ou bien des applications Facebook Responsive.

Mobile first (le mobile en premier)

Nous pouvons envisager la notion de mobile first comme un mode de pensée dans lequel on privilégierait la construction d'une interface ergonomique pour terminaux mobiles avant d'établir celle d’un terminal "desktop" (de bureau). Ce qui est, dans l'histoire d'Internet, l'affichage traditionnel. Cette pensée a pour objectif de perfectionner l'expérience utilisateur (UX).

l'élaboration d'une interface ergonomique sous la contrainte d'un espace d'affichage réduit force à aérer au maximum les éléments visibles par l'utilisateur final. Une tendance de plus en plus observée dans l'ergonomie des interfaces web.

Cette pensée est de plus en plus privilégiée par des outils dédiés à la création de site web. Par exemple le CMS Drupal élabore la version 8 de son CMS en essayant d'intégrer cette pensée "Mobile First"10. La croissance constante des ventes de "Smart Connected Devices" (PC, Smartphone et tablette) a augmenté l’intérêt de réalisation de templates en RWD pour la majorité des outils de gestion de contenu. Wordpress et Joomla proposent aussi des design intégrant la dimension responsive. Pour aller plus loin, la conception de nouveaux Systèmes de gestion de contenu intègre le responsive web design. Certains CMS comme Rubedo intègrent nativement des méthodes de mise en page à l’aide de Grille Fluides et permettent (grâce aux Media Queries) de sélectionner les éléments des pages qui s'afficheront en fonction des supports à l’aide de simples cases à cocher.

Responsive degradation

En partant de la version ordinateur de bureau du site web, certains éléments de la page web sont progressivement adaptés à mesure que la largeur d'écran diminue, quand ils ne sont pas tout simplement enlevés. Le but est d'adapter le design en fonction de la résolution décroissante de l'écran. L’exemple le plus fréquent et le plus parlant est le passage d'un site en plusieurs colonnes en version bureau, à une seule en version mobile.

Cette méthode est parfois discutée dans la communauté des web designers, car dans la réalité, un smartphone chargera la version bureau du site web et la version mobile, et donc téléchargera des données de style inutiles et des images qui peuvent être lourdes depuis un réseau cellulaire.