3 septembre 2012 | Québec
Structure, contenu, navigation et accessibilité contribuent à la conception d’interfaces adaptées à leur fonction
Lorsqu’un internaute consulte un site Web, il interagit avec une interface utilisateur : menus, contenus, éléments de navigation et organisation des pages participent tous à la manière dont il accède à l’information.
La conception d’interfaces utilisateur, souvent appelée UI design, ne se limite pas à l’apparence d’un site. Elle demande également de réfléchir à la fonction de l’interface, à l’organisation du contenu et à la manière dont les différents éléments sont présentés.
Ces notions occupent une place distincte dans le programme de Design Web – LCA.C0 du Collège CDI, qui comprend un cours de 45 heures consacré à la conception d’interfaces utilisateur. Le plan de cours y aborde notamment la fonction des interfaces, le Web sémantique, l’importance du contenu, les grilles de mise en page, Bootstrap et l’accessibilité.
Qu’est-ce qu’une interface utilisateur?
Une interface utilisateur constitue le point de contact entre une personne et un site Web. Elle rassemble les éléments permettant de consulter le contenu et d’interagir avec lui.
Sa conception doit donc tenir compte de sa fonction. Une interface efficace ne consiste pas simplement à disposer des éléments sur une page : leur organisation doit correspondre à ce que l’utilisateur doit pouvoir consulter ou accomplir.
C’est pourquoi le plan de cours commence notamment par la définition d’une interface et par l’adaptation des interfaces à leurs fonctions respectives.
Le contenu au cœur de l’interface
Une interface sert d’abord à présenter du contenu. Son organisation joue donc un rôle important dans la manière dont l’information est repérée et comprise.
La hiérarchie, la disposition des éléments et la structure d’une page contribuent à rendre le contenu plus facile à parcourir. Ces principes établissent un lien direct entre la conception d’interfaces, la typographie et la mise en page.
👉 Découvrez également : Typographie Web et mise en page : des bases essentielles en design Web
Pourquoi utiliser des grilles de mise en page?
Les grilles permettent d’organiser les différents éléments d’une interface selon une structure cohérente. Elles servent de repères pour disposer des textes, des images et d'autres contenus sur une page.
Le cours de conception d’interfaces utilisateur aborde précisément les grilles de mise en page, ainsi que Bootstrap.
Ces notions rejoignent également celles étudiées en responsive design, où l’organisation d’une page doit pouvoir évoluer selon le format d’écran.
👉 Découvrez également : Responsive design et mobile first : concevoir des sites Web pour différents écrans
Le Web sémantique et l’organisation de l’information
Le plan de cours comprend également le Web sémantique et les microdonnées parmi les sujets abordés en conception d’interfaces utilisateur, ce qui montre que la conception Web ne se limite pas à ce qui apparaît visuellement à l’écran. La façon dont l’information est structurée fait également partie de la réflexion entourant une interface.
Quelle place occupe l’accessibilité?
Une interface doit également tenir compte des personnes qui l’utilisent. Le cours aborde ainsi l’accessibilité, les outils disponibles et les besoins de visiteurs atteints de cécité ou de troubles moteurs.
L’accessibilité constitue un sujet suffisamment important pour être approfondi séparément. Elle fera d’ailleurs l’objet d’un autre article de cette série.
UI design et responsive design : des notions complémentaires
Une interface peut être consultée sur différents appareils. Sa structure doit donc être conçue en tenant compte des variations de l’espace disponible.
Le programme permet de relier la conception d’interfaces utilisateur aux notions de responsive design et de mobile-first abordées dans un autre cours. Les grilles de mise en page constituent notamment un point de rencontre entre ces différents apprentissages.
Une compétence parmi plusieurs en design Web
Dans le programme de Design Web – LCA.C0, la conception d’interfaces s’intègre à des apprentissages plus larges en création, en technique et en programmation. Le programme vise à former des personnes capables d’intervenir à différentes étapes de la production d’un site Web, notamment en matière d’organisation du contenu, de design, de programmation et d’interactivité.
Comprendre le fonctionnement d’une interface permet ainsi de mieux saisir comment le contenu, la structure, la présentation et l’utilisation se rencontrent dans la conception d’un site Web.
Foire aux questions
1. Qu’est-ce que l’UI UI design?
L’UI design, ou conception d’interfaces utilisateur, concerne la conception et l’organisation des éléments avec lesquels une personne interagit lorsqu’elle consulte un site ou une interface.
2. Quelles notions de conception d’interfaces sont abordées dans le programme?
Le plan de cours comprend notamment la fonction des interfaces, le Web sémantique, les microdonnées, l’importance du contenu, les grilles de mise en page, Bootstrap et l’accessibilité.
3. L’accessibilité Web fait-elle partie de la conception d’interfaces?
Oui. Le cours aborde l’accessibilité, les outils disponibles ainsi que les besoins de visiteurs atteints de cécité ou de troubles moteurs.
Pour aller plus loin
👉 Une formation complète pour créer des sites Web professionnels
👉 Le contenu interactif : au cœur de l’expérience Web
👉 Créer des expériences Web : le rôle du designer Web
