Définition du responsive par Diesel

Avec mon métier (Chef de projet digital), j’entends à longueur de journée « ton site, il est responsive ? », « un site pas responsive, c’est rédhibitoire ! »…oui, mais voilà, il y a responsive et responsive !

Le responsive en fonction de la taille de l’écran

diesel-responsive

Rapide explication de la notion de responsive design : le responsive n’est pas nouveau du tout puisqu’il est né avec le développement des téléphones mobiles. Il s’agit d’adapter le contenu d’un site internet au format mobile. Ainsi, on n’a plus besoin de « zoomer » sur le site pour pouvoir lire le contenu du site. Il existe toutefois différentes manières d’appréhender cette technique de développement.

Certains sites « responsive » s’adaptent au mobile en fonction du modèle de l’appareil (on parle d’ailleurs plutôt d’adaptative design). Oui, mais voilà, aujourd’hui, avec la multiplication des modèles, cela devient très complexe de tous les prendre en compte. C’est pourquoi il est aujourd’hui fortement recommandé d’adapter son site internet en fonction de la taille des écrans, en prenant en compte une multitude de « breakpoints » ou « points d’arrêt« . Vous pouvez faire le test sur votre ordinateur en réduisant la taille de la fenêtre de votre navigateur. Si le site s’adapte au fur et à mesure que vous réduisez l’écran, alors, votre site est vraisemblablement responsive !

Petite leçon de responsive par Diesel

La fameuse marque de jeans Diesel nous fait une belle démonstration d’un site responsive.

Pour faire la promotion de son Joggjeans, qui s’adapte à toutes les situations, Diesel a imaginé son lookbook en faisant se contorsionner ses mannequins. En modifiant la taille de votre écran, le mannequin va prendre toute sorte de position pour s’adapter à la taille de la fenêtre.

C’est l’agence Fred & Farid Shanghai qui est à l’initiative de cette belle opération.

 

Laisser un commentaire

Votre adresse de messagerie ne sera pas publiée. Les champs obligatoires sont indiqués avec *

Le temps imparti est dépassé. Merci de recharger le CAPTCHA.