Avant de s'attaquer aux écrans dans Photoshop, le graphiste doit impérativement avoir une vision globale du site, et s'approprier les schémas de page fonctionnels.
Le graphiste va ainsi repérer quels éléments doivent apparaître sur telle et telle page type. Chaque gabarit rassemble plusieurs "composants" qui vont structurer la page, par exemple :
La liste des types de composants est infinie et propre à chaque site.
En prenant connaissance des différents contenus du site, le graphiste peut se rendre compte de la similitude d'une page à l'autre. En effet, une grande partie des composants va se retrouver sur plusieurs pages.
L'objectif du graphiste est de simplifier, de factoriser, de créer des éléments communs. Le site gagnera en simplicité et en cohérence.
Cette simplification ne doit pas rendre le site monotone graphiquement.
Attention à maintenir une certaine richesse pour l’ensemble du site, et veiller à ce que les pages types du site soient suffisamment différenciées afin que l’internaute puisse immédiatement identifier leur niveau de hiérarchie dans l’arborescence.
Au fil de la conception, le graphiste va donc créer une bibliothèque d'éléments types qui vont être réutilisés d'une page à l'autre, d'un gabarit à l'autre. Les différentes combinaisons d'agencement de ces éléments vont constituer des gabarits différents ou des variantes de gabarits.
Il s'agit de créer des "briques" (composants) qui permettront de créer autant de "gabarits" (maisons), tous différents mais faisant partie d'un tout, d'un "site web" (style architectural) cohérent.
Cette économie de moyens offre de grands avantages :