Par , le 29 mai 2015

Pourquoi la peur du vide ?

Design | Webdesign | 0

Comme pour tout autre corps de métier, les designers ont leurs petites obsessions. Les nôtres sont variées : typographie, couleurs, photographie, composition, provenance de notre café… Mais ce que nous allons aborder aujourd’hui est une notion toute précise : le vide.

Par vide, nous ne parlons pas du syndrome légendaire de la page blanche. Non, le vide ne va pas être abordé ici sous un angle métaphorique voire inquiet, mais sous celui tout à fait concret et guilleret de la mise en page de nos sites web. Nous allons évoquer ici le sujet des marges, des espaces, des interlignages, des zones sans contenu… Bref de tout ce qui peut sembler un détail pour vous mais qui veut dire beaucoup pour nous (et pour les internautes, souvent inconsciemment).

"Carré blanc sur fond blanc"

“Carré blanc sur fond blanc” de Kasimir Malevitch (1918)

Se jeter dans le vide est essentiel

Que ce soit lors de l’intégration (“As-tu pensé à harmoniser les marges et les paddings ?”) ou de la présentation d’une maquette graphique au client (“Pourquoi tout ce vide ? Il faut remplir”), les espaces vierges peuvent souvent sembler problématiques. Ils sont pourtant essentiels : le vide vient apporter du souffle, il apporte la respiration nécessaire à un site, et il est essentiel pour une lisibilité optimale.

Pourtant, la tentation est souvent grande de vouloir mettre un maximum de contenu dans un minimum d’espace. Par exemple, toute personne ayant déjà côtoyé un projet web ces dernières années a sûrement entendu parler de la problématique du “fold” (ou “ligne de flottaison” dans notre langue) : la règle fut pendant longtemps de mettre un maximum de contenu dans les 600 premiers pixels de hauteur d’écran, afin que les moniteurs les plus répandus puissent afficher le-dit contenu sans besoin de faire défiler la page.

Le fold est désormais (enfin) mort, et pour une simple raison : les appareils connectés au web sont désormais terriblement nombreux et surtout variés, entraînant donc une multiplication des résolutions (d’un smartphone à une télévision, il y a de la marge), rendant cette “règle” caduque. L’autre raison de la disparition de cette règle est une évidence que l’on a retrouvé : l’utilisateur sait utiliser sa barre de défilement. C’est un réflexe sur internet, et en aucune façon une contrainte obscure et inconnue, que ce soit au doigt ou via sa souris. Et n’oublions pas le responsive design, nous obligeant à ne plus penser en terme d’écran, mais plutôt de contenu.

"I am the fold"

 « I am the fold » recense le fold de chaque utilisateur qui le visite, démontrant ironiquement la relative traîtrise de cette notion.

Une autre manifestation de la peur du vide réside dans les espaces vierges de contenu qu’un designer proposera à certains endroits d’un site. Des zones “neutres” apparaissent au fil de la page, des marges s’élargissent… et le client peut-être tenté de craindre une perte d’efficacité via un espace “inutilement gâché”. Rien n’est plus faux : la libération du joug terrible imposé par le fold s’est accompagnée d’une plus grande considération pour le confort visuel de l’utilisateur. En moyenne, de très maigres secondes sont passées sur une page web : nous ne lisons pas, nous scannons l’essentiel et nous zappons vers la suite, d’où un grand besoin d’avoir un contenu clair et lisible sous les yeux. De plus, la fatigue visuelle induite par nos écrans lumineux n’est plus à démontrer…

Bref, un visiteur, ça se chouchoute, et le but de ces zones vierges, de ces interlignages plus importants et de ces typographies au corps plus grand est de soulager le regard de l’utilisateur. Au final, le vide apporte de l’efficacité, de l’impact rapide, et une bien plus grande facilité de lecture pour le message que l’on veut délivrer.

Bloomberg

2012 vs 2015 : le site d’actualité Bloomberg est passé de l’étouffement à la respiration avec une remarquable efficacité. Sincèrement, lequel des deux préféreriez-vous consulter ?

Ne paniquez pas et faites le vide : vous êtes sur internet

Sans s’appesantir sur le sujet (il y aurait mille choses à aborder), résumons brièvement : le vide peut provoquer une certaine appréhension, mais nous nous devons de l’embrasser pour nos mises en pages. Et si un designer laisse désormais un peu plus d’espaces vierges, ce n’est pas par pure fainéantise ou absence d’imagination mais parce qu’il se préoccupe de l’harmonie et de la lisibilité du contenu.

Nous faisons certes un peu plus défiler nos pages web parce que l’on s’autorise enfin un contenu qui respire, et au fil de la navigation des zones vierges apparaissent effectivement, mais comparons-les à des aires de repos ponctuant nos longues pérégrinations numériques. Le vide ne dessert pas le message, il n’est pas contre-productif et il n’empêche pas une marque de s’exprimer, bien au contraire : il vient souligner tout cela par contraste naturel et ce comme nul autre artifice. Et il sert et guide ceux qui doivent toujours rester notre priorité : les utilisateurs.

Bref, dans le design de nos sites, le vide n’est pas vide de sens mais plein d’intentions. Nul besoin d’avoir le vertige.

Partager l'article :

Vous souhaitez réagir ?

En soumettant ce commentaire vous donnez à Silicon Salad le droit de citer vos propos ainsi que votre nom/site. Tous commentaires dégradants ou hors-sujet peuvent-être supprimés par décision de l’auteur. Votre e-mail, ne sert qu’à des fins d’authentification, il ne peut-être ni partagé ni diffusé.
Vous pouvez commenter avec la syntaxe Markdown. En savoir plus

Article précédent
Documenter son API REST avec API Blueprint