DevProNet

 Qu'est-ce qu'une interface utilisateur réactive?

interfaces
Sites et interfaces responsives

 

Le terme design réactif est souvent appliqué à la conception Web moderne. Mais quelle est la conception réactive et comment cela s'applique-t-il au développement de logiciels Web?

Au fur et à mesure que de plus en plus d'utilisateurs accèdent à Internet depuis la tablette et les appareils mobiles, il est devenu plus évident que les modèles de sites Web modernes ne conviennent pas aux écrans de petite résolution. De couse, vous pouvez zoomer sur la plupart des périphériques, mais cela rend l'action de naviguer autour d'un site assez laborieux.

Une solution était de développer des versions mobiles pour un site, qui a rendu différent le contenu pour les appareils mobiles. Cela fonctionne, et présente des avantages. Par exemple, avoir un site mobile entièrement différent signifie que le contenu et les fonctionnalités du site peuvent être adaptés exactement à un public mobile. Cependant, la plupart des commentateurs conviennent que les coûts l'emportent sur les avantages. Le premier coût est financier, la création d'un site entièrement différent coûte plus d'argent. Le deuxième coût est que les deux sites doivent être maintenus et mis à jour indépendamment, ce qui prend plus de temps.

Une autre solution consiste à utiliser une conception adaptée. Dans un design réactif, un site Web affiche le même contenu sur tous les périphériques, mais le contenu est différent selon l'espace disponible. Le plus souvent, un site Web affichera des informations dans plusieurs colonnes sur des appareils à écran large, mais bascule vers moins ou simplement une seule colonne sur les périphériques à écran petit. Une autre technique courante consiste à passer d'un menu à largeur totale à un menu déroulant sur un écran plus petit. Dans certains cas, une partie du contenu peut être cachée sur de petits écrans.

Cette technique qui a été développée pour les sites Web a rapidement trouvé son chemin dans la conception d'applications Web. Les avantages sont tout aussi convaincants dans ce cas. Bien qu'il faille plus d'efforts pour entrer des informations dans un appareil mobile (il suffit d'utiliser le clavier pour plus de travail), il est très utile de pouvoir afficher les informations dans votre application lorsque vous êtes en déplacement.

Une gamme d'outils utiles a été créée pour rendre plus faciles les applications Web réactives. Chez DevProNet, nous construisons habituellement nos applications Web à l'aide d'un framework connu sous le nom de Bootstrap. Il s'agit d'un cadre d'interface utilisateur développé par Twitter. Il a commencé la vie en tant que projet Twitter interne pour les aider à développer des logiciels internes, mais est désormais open source et utilisé par un grand nombre de sites. Le site que vous regardez maintenant a également été construit à l'aide de Bootstrap - et dans le cas présent, incorporé à Drupal.

Si vous êtes à la recherche d'un développeur d'applications Web et que vous souhaitez accéder à votre site à partir de tous les périphériques, assurez-vous de leur parler des avantages d'une conception d'interface utilisateur adaptée.