La composition appliqué au webdesign

Organiser, c'est créer du sens

L'erreur commune est de penser que l'on peut bâtir la composition d'une page web, comme on construit la mise en page d'une revue. Il n'en est rien. On ne peux pas parler d'un format en webdesign. Pour un même site, il y aura autant de formats différents que d'écrans d'utilisateurs, voir même d'utilisateurs tout court. L'un utilisera son navigateur en plein écran, tel autre n'ouvrira la fenêtre qu'au deux tiers ... la hauteur de l'affichage peux varier en conséquence. l'ensemble de la page est très rarement visible dans sa totalité. Si l'image de marque de l'éditeur du site est bien visible à l'ouverture du lien lorsque la page est calée en haut, qu'en est-il lorsqu'on arrive en bas de celle-ci?

CC:By−Nc−Nd aneartiste.com

« Le but d'une composition est de faire apparaître des points forts, des lignes de forces et des masses. »

Traditionnellement, une composition s'inscrit toujours dans une surface donnée, et fixe. Ce qui n'est pas le cas en webdesign. Certaines règles demeurent: la circulation des vides, l'équilibre des masses, le poids des valeurs colorées. Mais ces conditions d'équilibre, que le design soit fixe ou adaptatifs sont sans cesse remise en cause à chaque mouvement de scrolling ou changement de taille de la fenêtre. Sans un œil exercé, il est peu probable, contrairement à ce que certains prétendent, de parvenir à une composition intéressante en se limitant à de savants calculs mathématiques. En art, on parle de tracé régulateur. C'est dire qu'il ne s'agit que d'une ossature de départ.

« Aussi sont mal-avisés ceux qui ne cherchent pas à perpétuer (…) les choses utiles, car alors c'est en vain que la postérité en recherche l'origine, le perfectionnement et l'usage. »
—Cennino Cennini

Néanmoins, en dehors du nombre d'or, peu utilisé avant la fin du XIXe siècle, d'autres régles de compositions peuvent être intégrées au webdesign. Très courante, la proportion 5/8, (d'ailleurs souvent confondue avec la proportion dorée) qui correspond au format Marine en art, donne des résultats similaires (grand coté/petit coté = 1.6). Tout comme le format Figure (théoriquement constitué par la redondance du format précédent, grand coté/petit coté = 1.2307). Sans oublier le format Paysage, basé sur un rapport correspondant à √2 (1.4142) que l'on retrouve également dans le format Grand Aigle et ses dérivés (A3, A4, A5, etc).

formats de peinture

On peut encore y ajouter la règle des tiers, ou encore la composition dite de "Charles VII" (division de la surface de façon à obtenir deux carrés joints). Une composition basée sur le carré associé au rapport √2 s'avère visuellement très intéressante. On peut à ce sujet visiter le site web du New Yorker dont le design est en majeure partie construit sur cette règle. Ce choix couplé à l'importance donnée aux espaces et à une typographie reconnaissable entre toutes (destinée aux titres) lui donne une identité graphique très forte et attachante.

« Les objets ne finissent jamais ; ils s'intersectent avec d'innombrables combinaisons de sympathie et d'innombrables chocs d'aversion. »
—Boccioni

CC−By−Nc−Nd aneartiste.com

D'une manière générale, on cherchera à organiser la page d'une façon qui incite le visiteur à la parcourir le plus longtemps possible. Définir un rythme de composition agréable, créer des effets de surprises, maintenir l'attention sans lasser, seront des éléments décisifs. L'iconographie sera donc importante, ainsi que sa présentation, le choix des couleurs, les cadrages, etc. La plus grande partie des règles utilisées en publicité, et plus particulièrement à l'Affiche pourrait être apliquées au webdesign ... (voir article suivant: "affiche et webdesign").