* Webmaster Annecy-le-Vieux

Webmaster Annecy-le-Vieux

Article:

Le Wireframe en web design renvoie à une maquette fil de fer pour réaliser un schéma définissant les zones d'un site Web, ou d'une page Web. Il peut être réalisé par une personne non technique. Pour Jakob Nielsen, le maquettage wireframe signifie un prototypage horizontal1, c'est-à-dire au développement de la partie graphique de l'interface homme-machine. Il accorde : La confirmation de la satisfaction des exigences de l'interface utilisateur et des possibilités du site web ; La simulation du fonctionnement a priori du site web selon les objectifs de départ ; Une première estimation du temps et du coût de développement.
Pour un site web, le rôle d'une première forme de maquette statique est de déterminer le « zoning » des écrans, c'est-à-dire le découpage des pages du site. Pour chaque type de page (ex: page d'accueil, page intérieure, chapeau de rubrique, etc.) le promoteur recherche les différentes zones de la page qu'il schématise à l'aide de blocs ou de boîtes afin de déterminer les grandes fonctionnalités et les zones principales du contenu. Il confirme la mission et la position de chaque zone et définit leur taille relative ainsi que leur importance visuelle2. Il peut aussi détailler et accorder des précisions sur les éléments de la page comme la hiérarchisation des différents textes, les dimensions en pixel des contenus, etc.
Le zoning facilite le travail du graphiste d'autant plus que ce dernier habille les différentes zones de l'écran ainsi définies en fonction de l'identité visuelle du produit. La maquette fil de fer peut servir de support de discussion avec les commanditaires du site web, mais également pour réaliser des tests utilisateurs. Il est possible également d'insérer des liens sur certaines parties de la maquette informatisée afin de permettre de naviguer entre les écrans et donc de vérifier l'ergonomie du système de navigation offerte voire de certaines modalités d'interaction. On parlera dans ce cas plus volontiers de prototype. Bien que le passage par le maquettage papier soit encore une technique ordinaire, il devient de plus en plus fréquent d'utiliser des logiciels dédiés ou détournés de leur principale fonction
LES OUTILS
Les plus élémentaires des outils pour l'accomplissement du Wireframe sont une feuille, une gomme, et un crayon de papier. Sans blague ! Pour perfectionner, vous pouvez additionner plusieurs feuilles, et des ciseaux. Vous pouvez ainsi positionner les éléments (des rectangles de papier) sur votre page Web virtuelle (une feuille). Cependant, beaucoup d'outils informatiques, plus ou moins perfectionnés, permettant le travail collaboratif ou non, en-ligne ou hors-ligne...