Le design plat ou « flat design » est un dérivé du style suisse ou style typographique international. Il a émergé dans les années 50 via, entre autres, Armin Hofmann.
La définition du style suisse par Wikipédia est particulièrement éclairante :
« Il met l’accent sur le dépouillement, la lisibilité et l’objectivité. Les éléments distinctifs du style international sont une mise en page asymétrique, l’utilisation de grilles, de polices de caractères sans-serif comme Akzidenz Grotesk, et l’alignement à gauche du texte, dont le bord droit est laissé irrégulier. La photographie, souvent en noir et blanc, est préférée aux illustrations dessinées. Bon nombre des premières créations du style international utilisent la typographie, en plus de son utilisation pour le texte, comme élément principal et structurant du design. »
Le design web est donc revenu lentement mais sûrement à ces bases essentielles de la communication.
Les grilles sont désormais aussi employées en intégration web : http://960.gs.
La typographie sans-serif (caractères sans « pattes ») revient en force pour sa lisibilité : Helvetica, Verdana, …
La photographie est généralement intégrée en couleurs et utilisée avec économie.
L’iconographie compte très peu de couleurs pour assurer la continuité et la stabilité du style.
PSD Design to HTML a relevé cinq avantages de l’utilisation d’un design plat.
Je me suis permis de remodeler les explications à ma guise.
Le design plat est simple et facile à utiliser
Il se focalise sur l’essentiel et évite de perturber le visiteur en limitant l’information au minimum.
Il est conçu en fonction des besoins de l’utilisateur et mise sur la clarté et l’intuitivité.
Il permet d’afficher le contenu sur des écrans de taille variées
Il permet de rester lisible aussi bien sur des écrans larges (télévisions) que sur de très petits écrans : smartphones, montres connectées, …
Ceci découle directement de sa structure faite de fragments (blocs d’informations ou de fonctionnalités qui continuent à faire sens, pris isolément), de l’absence de fioritures et de couleurs en excès.
Il allège le chargement des pages
Le design plat permet de réduire le temps de chargement de vos pages : les icônes et les fonds étant composés de très peu de couleurs, ils chargent beaucoup plus vite et ont un poids négligeable. De plus, dans le cas du format SVG, il permet un redimensionnement parfait de l’image, sans déformation, à partir d’un même fichier : un unique fichier peut être employé pour des usages multiples, sans problèmes de duplication de ressource.
Il vous aide à améliorer votre classement SEO
Conséquence du bénéfice précédent : le temps de chargement étant réduit par le poids limité des images plates, vos pages seront mieux classés par les moteurs de recherche.
Il vous oblige à vous focaliser sur le contenu ou la fonction
L’interfaçage étant réduit à sa plus simple expression, il oblige à mettre en oeuvre une économie de moyens pour atteindre des résultats efficaces : textes courts et pertinents, aération du contenu, actions simples et bien visibles, mécanismes d’interaction évidents, …
Le design plat est donc parfait pour construire une signalétique efficace, compréhensible par tous.
La forme ne prend plus le pas sur la fonction : les deux fonctionnent en harmonie.
D’après :
