* Montage PSD2HTML RESPONSIVE DESIGN MOBILE Avignon

Montage PSD2HTML RESPONSIVE DESIGN MOBILE Avignon

Article:

Le Responsive Web Design peut être appliqué à d'autres usages qu'un site internet. Tout ce qui utilise des technologies web peut être pensé adaptatif. Il devient donc possible de concevoir des emails HTML adaptatifs, des applications HTML5 mobiles adaptatives et même des applications Facebook Responsive.

Mobile first (le mobile en premier)

La notion de mobile first peut-être comprise comme un mode de pensée dans lequel serait privilégiée la construction d'une interface ergonomique pour terminaux mobiles avant d'établir l'ergonomie pour un terminal "desktop" (de bureau). Dans l'histoire d'Internet, il s’agit de l'affichage traditionnel. Améliorer l'expérience utilisateur (UX) est le premier objectif de cette pensée.

l'élaboration d'une interface ergonomique sous la contrainte d'un faible espace d'affichage force à épurer au maximum les éléments visibles par l'utilisateur final. Une tendance que l'on retrouve de plus en plus fréquemment dans l'ergonomie des interfaces web.

Cette pensée est de plus en plus privilégiée grâce à des outils destiné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. Les ventes de "Smart Connected Devices" (PC, Smartphone et tablette) ne cessent de croître, ce qui a entrainé un regain d’intérêt dans la réalisation de templates en RWD pour la plupart des outils de gestion de contenu. Wordpress et Joomla proposent également des design intégrant la dimension responsive. Pour aller plus loin, de nouveaux Systèmes de gestion de contenu assimilent le responsive web design dans leur conception. Certains CMS comme Rubedo intègrent nativement des systèmes de mise en page à l’aide de Grille Fluides et permettent (grâce aux Media Queries) de définir 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 qui constituent la page web sont progressivement remis en forme à mesure que la largeur d'écran diminue, ou parfois ils sont tout simplement enlevés. Le design doit être adapté en fonction de la résolution décroissante de l'écran. Le cas le plus fréquent et le plus illustratif est le passage d'un site disposant de plusieurs colonnes en version bureau, à une seule en version mobile.

Cette méthode est parfois remise en question dans la communauté des web designers, puisque dans la réalité, un smartphone chargera la version bureau du site web et la version mobile. Il téléchargera donc des données de style non nécessaires et des images qui peuvent être trop lourdes depuis un réseau cellulaire.